> Portal Navigation:
> 
> - Append `.md` to any URL under `https://dev.wix.com/docs/` to get its markdown version.
> - Pages are either content pages (article or reference text) or menu pages (a list of links to child pages).
> - To get a menu page, truncate any URL to a parent path and append `.md` (e.g. `https://dev.wix.com/docs/sdk.md`, `https://dev.wix.com/docs/sdk/core-modules.md`).
> - Top-level index of all portals: https://dev.wix.com/docs/llms.txt
> - Full concatenated docs: https://dev.wix.com/docs/llms-full.txt

## Resource: Add Nested Widgets in Blocks

## Article: Creating and Managing Widgets Within Widgets

## Article Link: https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-blocks/site-widgets/add-nested-widgets-in-blocks.md

## Article Content:

# Add Nested Widgets in Blocks

<blockquote class="caution">

**Editor compatibility**

Wix Blocks apps aren't supported in the Wix Harmony editor. Existing Blocks apps remain available for purchase on the Wix App Market for Wix Editor and Wix Studio sites. To learn more, see [About Wix Harmony and Blocks](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-blocks/about-wix-harmony-and-blocks.md).

</blockquote>

Blocks lets you embed one widget within another widget. This is useful in various cases, such as:
* Reusing a widget in several places in your app.
* Creating widgets that are elements, such as buttons.

In the product image shown below, the counter is a separate widget with its own logic, embedded in the main widget. When users install this app on a site, both the external widget and the internal (nested) widget can be customized in the editor. 

This is the main widget:

![product widget](https://wixmp-833713b177cebf373f611808.wixmp.com/images/cfef89a9c61658cf4f617750b77e0d87.png)

This is the nested widget: 

![product widget](https://wixmp-833713b177cebf373f611808.wixmp.com/images/d32de41ac40a51a7bf7d672bf668b147.png)

## Nesting a widget into another widget

Select the outer widget, in which you want to insert an inner widget, in the **Widgets** section of the **Widgets and Design** Panel. Now, there are two ways to add another widget.

### Add a nested widget from the Widgets panel:

1.  Hover over the name of your widget and click the **More Actions**  ![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/12345678-1234-1234-1234-1234567890ab/2021/11/24/e1f918a4-43e9-457c-9e9c-0fbc239352ab/9f3ba7b7-4535-40e6-b076-2378a71a76bd.jpg)  icon.
2.  Click **Add Widget**.
3.  Select the widget that you want to add. The widget is then added to your current widget. 

### Add a nested widget from the Add Elements panel:

1.  Open the **Add Elements**  ![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/378fd532-728d-473b-8f03-30140bda59af/2022/01/25/c582389c-247c-44d8-834f-dd5f8af3ea74/6f030282-4363-40e3-abb0-fd018a7e167c.jpg)  panel.
2.  Click **My Widgets**.
3.  Click or drag the widget that you want to add to your current widget.

When you click the nested widget in the outer widget, you will see the ![](https://wixmp-833713b177cebf373f611808.wixmp.com/images/6ca18063973e65b36ea00cc604a4670b.png) icon next to its ID, indicating that this is a nested widget. 

![indication](https://wixmp-833713b177cebf373f611808.wixmp.com/images/4a8decef1027ba06c5218aaa8460b617.png)

## Managing the nested widget in the editor

When a user adds a widget that includes a nested widget to their site, they can customize both the outer and nested widgets. Here are two main things they might want to configure: 

### Change properties

If your inner widget has [properties](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-blocks/widget-api/blocks-widget-properties.md), users can access them through the **Settings** panel of the inner widget. The following screenshot is from a site where the slot machine app is installed. Users can change the speed of the spinner window, which is a property of the widget.

![inner widget settings](https://wixmp-833713b177cebf373f611808.wixmp.com/images/e27f167521d2b6590050ab8df8b5419d.png)

Use [`getNestedWidget`](https://dev.wix.com/docs/sdk/host-modules/editor/widget/get-nested-widget.md) to get the inner widget properties in custom panel code. 

### Change design presets

[Design presets](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-blocks/widget-design/about-design-presets.md) allow you to create various layouts designs for the same widget. When users install the app on a site, they can easily change the design prests of the outer or nested widget, or both:

![design presets widget in widget in the editor](https://wixmp-833713b177cebf373f611808.wixmp.com/images/ced102e6b20baecc9bad4ec80fc3166c.png)

## Limit configuration abilities for nested widgets

In some cases, you might want the nested widget to behave as an inseparable part of the outer widget, and limit what users can do with it. Here are two options: 

### Disable selection
Define the nested widget as non-selectable in the [Configuration](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-blocks/editor-experience-configuration/configure-display-names-and-behavior-in-blocks.md) tab within the Editor Experience ![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/378fd532-728d-473b-8f03-30140bda59af/2024/04/24/d885478b-0fa3-46d0-950a-801399d94383/8dc747a0-244b-4714-bd4c-7a71986a8394.png) panel. 

### Hide the widget from the Add Elements panel
If you don't want users to be able to add the nested widget independently, not as part as the outer widget, you can define it in the **Preset Visibility** section of your app's [Installation Settings](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-blocks/deploy-and-manage-blocks-apps/configure-blocks-installation-settings.md). To do so, uncheck the **Add panel** option for all the presets of the nested widget.