The ‘Back in Stock’ button gets attached below the 'Sold Out' button on your product details page. This is based on the availability of space in your page layout or on the HTML code of your theme.
This is a default setting, but you can customize the Back in Stock button placement according to your preferences in just 2 simple steps. All you need to do is create an empty div sector by placing an HTML code in your liquid files!
Step 1: Go to Shopify Admin > Online Store > Themes > Edit Code.
Step 2: Find the template/snippet file which renders your product page (eg: main-product.liquid). Identify the section where you'd like to place the button. In this example, we are placing the button next to the Price element. Then, paste the following HTML code directly below that section.
HTML code to be copy-pasted:
<!-- Swym button on product pages -->
<div class="swym-isa-button-bar"></div>
<!-- Swym button on product pages -->
You can use this code and place it wherever you think is the right fit according to the theme of your website. Once the button is attached, you can use CSS to style/align the button as required. Note: Our button codes are dynamically rendered and is not available on the product template. Alternatively, you can choose to create a custom button and wire our app to the custom button using our Javascript APIs. This way you will have complete control over the position and style of the button. Additionally, you can add the Back in Stock button to both mobile and desktop layouts by placing the code snippet in the respective containers. This ensures the button is visible across all device types. If you wish to replace the Sold Out button entirely, you can implement a custom form using Swym’s SDK and render it in the desired location.
Troubleshooting Common Issues
If the Back in Stock button is not appearing or functioning as expected, consider the following troubleshooting steps:
Check App Enablement: Ensure the Swym Back in Stock Alerts app is enabled for your store. If the button behaves inconsistently across URLs for the same product, verify that both links use the same template and that no third-party app overrides the Swym button on one of the URLs.
Resolve Client-Side Issues:
Cookie Consent: Accept cookie consent on the storefront, as the app scripts require cookies to load.
Browser Cache: Clear the browser cache and refresh the page.
Extensions or Content Blockers: Disable browser extensions or use a private/incognito window to bypass potential blockers.
Allow up to 30 minutes for cached information to reinitialize after clearing.
Specific Scenarios and Explanations
Preorder Products: The Back in Stock button does not appear for preorder products. These products use a separate preorder button and flow, so the BiS button is not injected on such pages.
Test Emails: During testing, BiS emails may reference random products from your store’s catalog, including draft or unexpected items. This is normal behavior for test sends.
Need further assistance?
You can always reach out to us at [email protected].
If you're already on our messenger, simply say "talk to an agent," and Fin will connect you with a member of our team who can provide further assistance.