# Widget Overview

### ℹ️ What is a widget?

A **widget** is a block that shows product recommendations on your store.

Each widget controls:

* **Where** recommendations appear (Product page, Cart page, etc.)
* **What** products are shown
* **How** they look (layout, design, style)

<figure><img src="https://3173367560-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRM5h2vtdtoVXQ1FbxweB%2Fuploads%2FZ1Ooxok4BxSj6oRatPDF%2F2025-12-19_15-36-37.png?alt=media&#x26;token=996253c9-126a-402c-99d5-fd683747736e" alt=""><figcaption></figcaption></figure>

***

### ⚙️ How to set a widget

Every widget follows the same simple flow:

1. **Create a widget** in the app
2. **Choose a placement**
   * Product page
   * Collection page
   * Cart page
   * Home page
   * Search page
   * Thank you page
3. **Select a layout**
   * Related products
   * Frequently Bought Together
   * Add-ons
   * Recently viewed
4. **Choose which products to recommend**
   * Automatically (same collection, tags, etc.)
   * Manually (you pick the products)
5. **Customize the design**
6. **Activate the widget** and add it to your theme

<figure><img src="https://3173367560-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRM5h2vtdtoVXQ1FbxweB%2Fuploads%2FI5zd2phZxYEl9QP1i8ae%2F2025-12-19_15-37-19.png?alt=media&#x26;token=acfb3128-ae73-46ab-ac23-ccdfc6f2385f" alt=""><figcaption></figcaption></figure>

***

### 📍 Where widgets appear

Widgets can appear on different pages of your store.\
Each widget can be used on one placement only.

Examples:

* Product page → Show “You may also like”
* Cart page → Show “Frequently bought together”
* Thank you page → Show post-purchase upsells

<figure><img src="https://3173367560-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRM5h2vtdtoVXQ1FbxweB%2Fuploads%2FTMrCQI0AfojnQ5cHM40r%2F2025-12-19_15-38-09.png?alt=media&#x26;token=6560efb6-1c92-4165-9f87-3f126482cfa6" alt=""><figcaption></figcaption></figure>

***

### 🗂️ Manage multiple widgets

You can create **multiple widgets** for different pages and use cases.

On the **Widgets** page, you can:

* Create new widgets
* Edit existing widgets
* Duplicate widgets
* Delete widgets
* Enable or disable widgets

<figure><img src="https://3173367560-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRM5h2vtdtoVXQ1FbxweB%2Fuploads%2FZGD1CXjQfBvW9JMQeTUp%2F2025-12-19_15-39-06.png?alt=media&#x26;token=6dd9b976-472c-4579-bf54-23321afd0fa9" alt=""><figcaption></figcaption></figure>

💡 Tip: Use clear names like\
\&#xNAN;**“Related – Product page”** or **“Upsell – Cart page”** to stay organized.

***

### ✅ When a widget shows on your store

A widget will appear on your store when:

* The widget is **Active**
* The widget’s **placement matches the page**
* The widget is added to your theme
  * App block (Online Store 2.0)
  * Shortcode (Vintage themes)

<figure><img src="https://3173367560-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRM5h2vtdtoVXQ1FbxweB%2Fuploads%2Fcahkp9gQmyONGZCPD1wm%2F2025-12-19_15-39-40.png?alt=media&#x26;token=738848f9-ff59-447c-b191-228c7f65252b" alt=""><figcaption></figcaption></figure>

***

### 📘 What you’ll learn in this section

The **Manage widgets** section includes these guides:

* Create a widget
* Display a widget on your store
* Edit a widget
* Duplicate a widget
* Delete a widget

👉 Start with **Create a widget** to build your first recommendation.

***

**🙋 Still need support?**

If you still need help, please feel free to contact us at <hi@tipo.io>. We’ll be happy to assist you further.