Using Bundlex with a page builder (GemPages, PageFly, Shogun)

If your product page is built with a page builder like GemPages, PageFly, or Shogun, the Bundlex widget may not land where you expect, or may not appear at all. The fix is a single anchor snippet that you paste into a custom HTML block to tell the widget exactly where to render.

Why a page builder needs an anchor

Normally the widget auto-detects your product form and inserts itself right above it. Page builders restructure the product page, so that automatic position is often wrong or missing. Dropping in the anchor snippet gives the widget an exact spot to attach to, so you control placement instead of leaving it to auto-detection.

Get the snippet

The anchor is a copy-ready snippet in the bundle editor.

1. Open the bundle you want to show on the page-builder page in your Bundlex dashboard.
2. Open the Advanced tab.
3. Find the Using a page builder? option and click it to expand.
4. Click Copy to copy the snippet to your clipboard.

The snippet is always the same:

<div data-bundlex-widget></div>

Paste it into your page builder

1. Open your product page in your page builder's editor (GemPages, PageFly, Shogun, or another builder).
2. Add a custom HTML or code block at the exact spot where you want the widget to appear, for example just below the price or above the add-to-cart button.
3. Paste the snippet into that block.
4. Save and publish the page.

With the app embed active and no custom placement selector taking priority, the widget renders inside the anchor. An app block renders at its own block position instead.

One snippet works for every bundle

You do not need a different snippet per bundle. The exact same <div data-bundlex-widget></div> is used for all of them. Bundlex decides which bundle to render based on the product the page is showing, so the anchor only controls where the widget appears, never which bundle. Paste it once on each page-builder product page that needs it.

Place it only on the relevant surface

Add the anchor only to the page surface where you actually want the widget. If the same snippet ends up in more than one place that loads at once, for example a cart drawer or a quick-view popup that repeats your product markup, the widget attaches to the first anchor it finds in the page. To keep placement predictable, put the snippet in a single, relevant spot rather than scattering it across templates.

If the widget doesn't move after pasting

Browsers and page builders cache scripts aggressively, so a stale version can ignore the new anchor. If the widget hasn't moved to the new spot:

• Check that you are using the app embed, not an app block positioned elsewhere. A custom placement selector in the embed also takes priority over the anchor.
• Hard-refresh the storefront page to clear cached scripts: Cmd/Ctrl + Shift + R.
• Confirm the page is published, not just saved in the page builder's editor.
• Make sure you pasted the snippet exactly, with no extra characters around it.

If the widget still doesn't appear at all

The anchor only positions the widget. It still needs the usual conditions to load:

• The Bundlex app embed must be turned on for this anchor method. Use an app block when you want placement controlled by the block instead.
• A published bundle must match the product on that page.

If the embed and matching discount are active, check placement priority and product-form detection. Contact support with the product URL if the anchor remains empty.

Landing pages are different

The anchor snippet works on product pages only. If you want bundle offers on a regular Shopify page (any /pages/ URL), such as a campaign landing page, use the Bundlex Bundles featured block in the theme editor instead. It has its own product picker and loads the widget without a snippet.

For the full picture of how Bundlex chooses a placement, including the featured product block for landing pages, the custom placement selector, and the theme app block, see Where the widget appears on your product page.