How to Install Back in Stock Product Alerts on your Shopify Dev Theme

When the Back in Stock Product Alerts app is installed on your store, it is installed on to the default live theme. At times, your current theme might not be suitable for the needs of your store or fit its visual presentation, and you may wish to install the Back in Stock Product Alerts on a Dev theme/ Unpublished theme. You might want to make modifications to your Dev theme/ unpublished and validate them before publishing them to the live store.

You may also follow these steps below if you wish to completely remove  Back in Stock Product Alerts from your current theme. Here is how it is done:

Disabling Back in Stock Product Alerts on a Live theme/ Current theme/ Production theme

1. In the admin console, go to Online Store > theme 

2. Choose the Current theme/ Production theme

3. Click on Action> Edit Code

4. In the “Search files” tab on the left, look for “theme.liquid” file and open it

5. Search for the line of code – {% include ‘swymSnippet’ %}

6. Comment this code out. This can be done by replacing {% include ‘swymSnippet’ %} with this instead –

{% comment %}{% include ‘swymSnippet’ %}{% endcomment %}

Now Back in Stock Product Alerts is disabled on your Production theme/Current theme. When you feel like you are ready to re-enable the app on the theme, just retract the commented line and replace it back to {% include ‘swymSnippet’ %}.

Enabling Back in Stock Product Alerts On Dev themes or Unpublished theme

To enable/install the Back in Stock Product Alerts on the Dev theme/Unpublished theme, you need to create two snippets files as part of the Dev theme.

  • Open the Production theme/ Current theme on a new tab
  1. In the admin console, go to Online Store > theme 
  2. Choose the Current theme/ Production theme
  3. Click on Action> Edit Code
  • Open the Dev theme/Unpublished theme on a new browser tab
  1. In the admin console, Go to Online Store> theme 
  2. Choose one of the unpublished themes onto which you would like to enable the app (under More themes section)
  3. Click on Action > Edit Code
  • In the Dev theme/Unpublished theme, on the “Search files” tab, look for “theme.liquid” file and open it
  • Add code – {% include ‘swymSnippet’ %} into the “theme.liquid” file (we recommended you add it before the </body> tag).
  • On your dev theme, create a new snippet. You can do this by clicking on the ‘Add new snippet’ option under Snippets.
  • Name the snippet ‘swymSnippet.liquid’ and click on create snippet.
  • Now your “swymSnippet.liquid” file is created and it will open an empty file on the editor
  • You must now copy the content of the snippet from the Current theme/Production theme onto the Dev theme
    • Go to your Current theme/Production theme tab on the browser that you previously opened 
    • On the search tab, look for “snippets/swymSnippet.liquid” and open it. 
    • Select all the contents of the file and copy it 
    • Go back to the browser tab with the Dev theme/Unpublished theme.
    • Paste the contents you just copied into this blank file.
  • You will need to create a new snippet on your dev theme called swym-product-view as detailed in this article here.

Click Save on top right corner to make changes permanent. 

You are done! Your Back in Stock Product Alerts from the Production theme/Current theme is now applied on to the Dev theme/Unpublished theme. You can preview the unpublished theme to make sure all settings and layouts are as desired before going live. 

Let's discuss your needs!

Let's discuss your needs!

Let's discuss your needs!