Skip to main content
Troubleshooting

The widget is too narrow or has a big gap

If the widget is too narrow, has a large gap, or overlaps nearby content, start with its built-in width and spacing settings. If those do not solve it, the theme's placement container may need attention.

Set the width

  1. Open the discount in Bundlex and go to the Style tab.
  2. Expand Widget style, then Container.
  3. Set Max width to Full width (100%), or choose Custom and enter a width.
  4. Save and check the product page on desktop and mobile.

The default width is Shopify default (44rem). Full width fills the widget's parent container, so it cannot make a narrow theme column wider.

Adjust the space above or below

In the same Container section, use Margin top and Margin bottom to adjust the gap. These settings belong to this discount and are easier to maintain than a shop-wide CSS override.

If changing the margins does not affect the gap, the space may belong to another theme block or section. Share the product URL with support so we can identify which element owns it.

The widget overlaps reviews, badges, or other blocks

A widget placed inside a container designed for a short buy button can grow beyond that container's fixed height. It then covers the delivery text, reviews, or other content below it. Increasing the widget's width or adding margins may not solve the underlying placement.

Contact support with the product URL and a screenshot showing the overlap. We can check a suitable placement outside the constrained container. Do not remove another app just because its content happens to sit underneath the widget.

Before switching to an app block

If you choose manual block placement, first check that the block is inside a section that renders on the actual product page. After turning off the embed, reload that page immediately. If the widget disappears, turn the embed back on and contact support.

For discounts with gifts, keeping the embed also preserves cart-page gift cleanup. See choosing between the embed and app block.

When custom CSS is needed

Use custom CSS only when the built-in settings cannot express the change. Send support the product URL and the layout you want, including whether it should differ on mobile. This lets us target the right container instead of applying a broad rule to every discount.

Was this article helpful?

Your feedback helps us improve our docs.

Thanks - we'll keep improving this article.

Want to chat with our team? Still have a question?

Still need help?

Our team is one click away. Send us a message and we'll get back to you.

We use a few cookies to keep this site working, measure how it is used, and power our chat widget when you open it. See our cookie policy.