> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.boxiapps.com/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# How to Add Builder on Any Store Page?

${frame}[Add builder to any store page](https://www.youtube.com/embed/GFKYgsmH4l8?start=260)

You’ve created a builder in Charmi app (for example, Charm Bracelet) and now want to display it on your store. 

![](https://storage.crisp.chat/users/helpdesk/website/-/3/7/a/6/37a622ee17372e00/screenshot-2026-05-04-175826_11ggzj6.png =1000x670)

You can place the builder almost anywhere - on a collection page, homepage, or a custom page.

In this tutorial I will show you how to embed the base picker and builder into a collection page.
---

**Step 1: Create a New Collection Template**

First, we’ll create a dedicated template where your builder will live.

1. Open your [Theme Editor](https://admin.shopify.com/themes)
2. Click on **Home Page** at the top, then click on **Collections**
3. Click **Create template**

![](https://storage.crisp.chat/users/helpdesk/website/-/3/7/a/6/37a622ee17372e00/screenshot-2026-05-04-175535_1yhlsxd.png =1000x362)

4. Give it a name (e.g., charm-bracelet) and click **Create template**

You are now inside your new template.

5. Remove any unnecessary sections from the template

![](https://storage.crisp.chat/users/helpdesk/website/-/3/7/a/6/37a622ee17372e00/screenshot-2026-05-04-175704_1f9daz9.png =1000x293)

6. Click **Save**
---

**Step 2: Add the Builder from Charmi**

Now let’s connect your builder to this template.

1. Go back to the [Charmi](https://admin.shopify.com/apps/charmi/app) app
2. Find your builder and click the three dots (**⋯**) → **Add to store**

![](https://storage.crisp.chat/users/helpdesk/website/-/3/7/a/6/37a622ee17372e00/screenshot-2026-05-05-091835_z974xh.png =1000x422)

3. Find Base Picker and Builder and click **Follow instructions**

![](https://storage.crisp.chat/users/helpdesk/website/-/3/7/a/6/37a622ee17372e00/screenshot-2026-05-04-at-09251_hhtrfi.png =1000x328)

Your active theme will already be selected.

4. Select your newly created template (e.g., charm-bracelet)
5. Click **Add "Base Picker and Builder" block**

![](https://storage.crisp.chat/users/helpdesk/website/-/3/7/a/6/37a622ee17372e00/screenshot-2026-05-05-092341_1e4szzl.png =1000x918)

You’ll be redirected to the Theme Editor, where you’ll see a confirmation message that the block has been added successfully.

6. Click on the block to open the **Charmi builder selector**
7. Select your builder

![](https://storage.crisp.chat/users/helpdesk/website/-/3/7/a/6/37a622ee17372e00/screenshot-2026-05-05-093154_14t585t.png =1000x284)

You’ll instantly see a preview of how it will look in your store

8. Click **Save**

![](https://storage.crisp.chat/users/helpdesk/website/-/3/7/a/6/37a622ee17372e00/screenshot-2026-05-05-093238_1xmugl.png =1000x414)

---

Almost there - just one final step.

**Step 3: Assign the Template to the Collection**

1. Go to [Collections](https://admin.shopify.com/collections) in Shopify
2. Open your base products collection
3. In the **Theme template** section, select your new template (e.g., charm-bracelet) and click **Save**

![](https://storage.crisp.chat/users/helpdesk/website/-/3/7/a/6/37a622ee17372e00/screenshot-2026-05-05-094620_l586w1.png =1000x576)

4. Click **View** to see your builder

![](https://storage.crisp.chat/users/helpdesk/website/-/3/7/a/6/37a622ee17372e00/screenshot-2026-05-05-094641_qt39lm.png =1000x53)

✅ Done!

![](https://storage.crisp.chat/users/helpdesk/website/-/3/7/a/6/37a622ee17372e00/screenshot-2026-05-05-094805_18rv865.png =1000x650)

Your builder is now displayed on the collection page, and your customers can select the base to create a unique jewelry.