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.
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.