Sign Customiser

Navigation

Dark mode

Enable sticky add to cart button on your customiser.

Copy page

Last updated:

Use these settings to keep the visualiser in view when the shopper scrolls. See this example page. On mobile, you can also keep the price box and its button fixed. Fixed is sometimes called sticky.

Before you start. Sticky Visualiser is a setting in the Shopify theme editor. It is in the Sign Customiser block and in the Sign Customiser - Embed block. It does not work when Use iframe (experimental) is on. See Use the iframe option in the Shopify app block. The Liquid iframe wrapper code has no theme editor setting for Sticky Visualiser.

Keep the visualiser fixed on desktop

  1. From your Shopify admin, go to Online Store > Themes. Find the theme that you want to edit, and then open it in the theme editor.

  2. Open the page or product template that shows your customiser.

  3. Open the block:

  4. Under Desktop settings, tick Sticky Visualiser. The visualiser stays in view when the shopper scrolls. This setting applies to desktop only.

    This older screenshot shows the setting as Sticky add to cart. The current label is Sticky Visualiser.

  5. Preview the page. Make sure that the setting works with your theme. Then select Save.

Keep the visualiser and price box fixed on mobile

  1. Go to your Sign Customiser admin.

  2. Select Customisers from the home screen.

  3. Select the customiser that you want to change.

  4. In the menu on the left, select Settings > General Settings.

    The Customiser Menu in the Sign Customiser admin with Settings and General Settings selected

    If the admin page is less than 799 px wide, select Menu first. Then find General Settings under Settings.

  5. Scroll to Mobile Style Options. Set Mobile View to Stacked all at once. Fixed Visualiser and Finish Position show only for this view.

  6. Set Fixed Visualiser to Yes. The visualiser stays in view when the shopper scrolls on mobile.

  7. Set Finish Position to Sticky at the Bottom. The price box and its button stay at the bottom of the screen while the shopper chooses options. By default, when Enable review screen is on, the button reads Finish on the screens before the review screen. On the review screen, and on every screen when Enable review screen is off, it reads Add to Bag by default. Quote Mode and Etsy mode show their own button text instead. Below selections puts them after the selections.

  8. Select Save.

For all mobile settings, see Mobile Style Options.

Why is the sticky setting not working?

If a setting above is on but the visualiser or price box does not stay in view, check these items:

  • On desktop, make sure that Use iframe (experimental) is off. Sticky Visualiser does not work when Use iframe (experimental) is on.

  • Some themes do not support Sticky Visualiser. Contact support if it does not work on your theme.

  • Look for conflicting CSS in your theme. Find the parent elements of the Sign Customiser div. The div has the ID neon-customiser-app. Make sure that no parent element has overflow set to hidden, scroll or auto.

Type a question and press Enter. Use the arrow keys to move between the results.