Adding Widgets to Your Storefront

Creating a plan sets everything up on the backend, but you still need to make it visible on your storefront. This page covers three separate setup steps.

1. Subscription Widget (Regular, Gift, and Curated plans)

Regular, Gift, and Curated plans share one widget — it’s added directly to your product page template as a theme app block, and automatically shows the right version (recurring options, gift pricing, or curated box info) depending on which type of plan is linked to that product.

Adding the widget

1. Go to Shopify Admin → Online Store → Themes.
2. Click Customize on your live theme.
3. Navigate to a product page in the customizer (use the page picker at the top, or open any product URL).
4. Click into the Product information section, then click Add block.
5. Find Subscription Widget in the app blocks list and add it.
6. Position it where you want it to appear — typically just below the price, or below the variant picker and above the Add to Cart button.
7. In the block settings, you can customize:
   • Widget Title — the heading shown above the subscription options (default: “⚡ Subscribe & Save”).
   • Primary Button Color — the accent color used in the widget.
8. Click Save.

Note

The widget automatically detects which plan (Regular, Gift, or Curated) is linked to the product it’s placed on — you don’t need a different widget for each type. If a product has no plan linked to it at all, the widget stays hidden and shows nothing.

Repeating for other templates

If your store uses more than one product template (e.g. a different template for a specific collection), repeat the steps above for each template that should show subscription options.

2. Bundle Plans

When you create a Bundle plan, Subsy automatically creates a real Shopify product for it — the same way it does for Curated plans. You’ll find it listed under Shopify Admin → Products, titled with your bundle plan’s name.

Unlike Regular/Gift/Curated products, the bundle product’s page should show only the bundle widget — not your theme’s normal price, variant picker, or Add to Cart button, since the customer builds their box entirely inside the widget. To get this clean layout, create a dedicated template for the bundle product and add the widget there.

Step 1 — Create a new template

1. Go to Shopify Admin → Online Store → Themes.
2. Click Customize on your live theme.
3. At the top of the customizer, click the page picker and select any Product page.
4. In the template dropdown (top toolbar, next to the page picker), click Create template.
5. Base it on your default Product template, and give it a clear name — e.g. bundle.
6. Click Create template.

Step 2 — Strip the template down

Inside this new template, find the Product information section and remove everything from it except the Title block:

1. Click on each block inside Product information (Price, Variant picker, Quantity selector, Buy buttons, Description, etc.).
2. Click the trash/remove icon on each one, leaving only the Title block behind.

You should end up with a template that shows just the product title, and nothing else from the default product layout.

Step 3 — Add the Bundle Widget block

1. With the Title block still selected (or right after it in the block list), click Add block.
2. Find Bundle Widget in the app blocks list and add it — it will appear directly below the title.
3. Click into the block’s settings and set the Widget Title (e.g. “Build Your Bundle”) if the option is available.
4. Click Save.

Step 4 — Assign the template to your bundle product

1. Go to Shopify Admin → Products, and open the product that was auto-created for your bundle plan.
2. Scroll down to the Theme template section (usually in the bottom-right of the product page).
3. Select the template you just created (e.g. bundle) from the dropdown.
4. Click Save.

Repeat Step 4 for every bundle product — but you only need to create the template itself (Steps 1–3) once, and reuse it for all your bundle products.

Note

If you create additional bundle plans later, you don’t need to rebuild the template — just assign the same bundle template to each new bundle product from its Theme template dropdown.

Hiding the bundle product from your catalog listing (optional)

The bundle product Subsy creates is a real, published Shopify product — so it will automatically appear in Shopify’s default “All Products” collection (usually linked from your navigation as “Catalog” or “Products”), the same as every other published product.

If you don’t want customers to stumble on it while browsing your catalog — and only want them to reach it via a direct link you share yourself — switch your storefront’s main product-listing page to a manual collection instead of the automatic “All Products” one:

1. Go to Shopify Admin → Products → Collections.
2. Click Create collection.
3. Give it a name (e.g. “Catalog” or “Shop”).
4. Under Collection type, choose Manual — this means only products you add yourself will appear in it.
5. In the Products section of this collection, manually add every product you do want visible in your catalog — leave the bundle product out.
6. Save the collection.
7. Go to Shopify Admin → Online Store → Navigation, edit your “Catalog” menu item, and point its link to this new collection instead of the default “All Products” one.

Note

This only controls whether the bundle product shows up when customers browse. It does not affect the product’s direct URL (/products/build-your-bundle, or whatever your bundle’s handle is) — that link keeps working exactly the same, since it depends on the product being published to the Online Store channel, not on collection membership.

If you’d rather keep using the default “All Products” collection as-is for everything else, you can leave this step out — the bundle product being visible in the catalog doesn’t break anything, it just means customers could discover it by browsing instead of only through a link you share.

Common ways to link customers to the bundle builder:

• Add it as a navigation menu link (see the Customer Portal instructions below — the same menu-link method applies).
• Add a button or banner link on your homepage or a custom page.
• Feature it in a collection description or announcement bar.

3. Customer Portal Link

Customers manage their own subscriptions (pause, skip, cancel) from the Customer Portal, available at:

/apps/subscription/customer-portal

This isn’t visible anywhere by default — you need to add it to your store’s navigation so customers can find it.

Adding it to a menu

1. Go to Shopify Admin → Online Store → Navigation.
2. Choose the menu you want to add it to (commonly your main menu or footer menu).
3. Click Add menu item.
4. For the Name, enter something customer-facing, like “My Subscriptions.”
5. For the Link, choose the option to enter a custom URL and paste:

/apps/subscription/customer-portal

6. Click Add, then Save menu.

Customers who click this link while logged into their account will see their own subscriptions. If they aren’t logged in, they’ll be redirected to log in first.

Where to go next

• Creating a Regular Subscription Plan
• Creating a Bundle Subscription Plan
• Managing Subscriptions