> For the complete documentation index, see [llms.txt](https://bestwpexpert.gitbook.io/product-reels/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://bestwpexpert.gitbook.io/product-reels/widgets/create-a-widget.md).

# Create a widget

Start a widget by choosing its name, layout and reel shape.

A widget is a group of reels shown together on a page. You choose the reels, the layout and the style, then place the widget anywhere with its shortcode, the block editor or Elementor.

## Create a new widget

1. Go to **ProductReels → Widgets** and click **Create widget**.
2. Fill in the dialog:

| Field           | What it does                                                                                                                                                     | Example            |
| --------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------ |
| **Widget name** | Helps you find the widget later. Shoppers don't see it unless you turn on the widget title in the [Layout step](/product-reels/widgets/layouts.md#widget-title). | `Homepage stories` |
| **Layout**      | How reels are arranged: Grid, Carousel, Marquee, Stacked or Popup                                                                                                | Carousel           |
| **Reel shape**  | **Rectangle** (9:16 video tiles) or **Circle** (story bubbles)                                                                                                   | Circle             |

3. Click **Choose reels**. The [widget editor](/product-reels/widgets/widget-editor.md) opens on the **Reels** step.
4. Add your reels and click **Save widget**.

After the first save, the editor header shows the widget's shortcode, and a message offers to take you to **Place it**.

{% hint style="success" %}
**Not sure which layout to pick?** Start from where the widget will go:

* Homepage hero or section → **Carousel**
* Product page, under the gallery → **Carousel** with small tiles
* Category or collection navigation → **Carousel** with the **Circle** shape
* Landing page full of UGC → **Grid**
* Eye-catching promo strip → **Marquee**
* Always-visible corner video → **Popup**

You can change the layout at any time in the Layout step.
{% endhint %}

## The Widgets screen

**ProductReels → Widgets** is your home screen. Before you have any views, it shows a short getting-started guide. Once your widgets have views, it shows:

* **Totals:** Views, Clicks, Click rate and Reels in use across all widgets.
* **Top reels:** your six most-viewed reels, each with views and click rate.
* **Widgets table:** every widget with its layout, ID, number of reels, shortcode, views, clicks, click rate and creation date.

### Row actions

Each row has an **Edit** button and a **more** menu (⋯) with:

| Action             | What it does                                          |
| ------------------ | ----------------------------------------------------- |
| **Statistics**     | Opens per-reel and per-button numbers for this widget |
| **Duplicate**      | Makes a copy with the same reels and settings         |
| **Copy shortcode** | Copies `[productreels id="…"]` to your clipboard      |
| **Delete**         | Deletes the widget. Its reels stay in your library.   |

{% hint style="info" %}
**Duplicate to experiment safely.** Want to try a new style without touching the live widget? Duplicate it, change the copy, and swap the shortcode on the page when you're happy.
{% endhint %}

## Example

**Scenario:** a bakery wants two widgets with the same videos: a large carousel on the homepage and small circles on the menu page.

1. Create **Homepage bakes**: Carousel, Rectangle. Add the six baking videos and save.
2. In the Widgets table, open the ⋯ menu on **Homepage bakes** and choose **Duplicate**.
3. Rename the copy to **Menu stories**. In the Layout step, change the shape to **Circle** and reduce the reel width.
4. Place each widget on its own page.

Both widgets share the same reels. Editing a reel's title updates both.