If you are using manual installation, you will have to insert a code snippet on your theme in order for this app to work correctly on your storefront. Where the code snippet needs to be inserted may vary depending on your theme.

Please use the instructions below to enable the app on your storefront.

To finish installing open templates/product.liquid in the theme editor.

Does your theme use sections?

If your template looks like the example above, open section/product-template.liquid in the theme editor.

Next, find the form that adds an item to your cart. The start of the form will look something like this:

Insert the following code directly under this tag:

<script data-app="esc-out-of-stock" type="text/json">
[{% for variant in product.variants %}{"id":{{ variant.id }},
"title":"{{ variant.title | escape }}",
"option1":{% if variant.option1 %}"{{ variant.option1 | escape }}"{% else %}null{% endif %},
"option2":{% if variant.option2 %}"{{ variant.option2 | escape }}"{% else %}null{% endif %},
"option3":{% if variant.option3 %}"{{ variant.option3 | escape }}"{% else %}null{% endif %},
"sku":{% if variant.sku %}"{{ variant.sku | escape }}"{% else %}null{% endif %},
"requires_shipping":{{ variant.requires_shipping }},"taxable":{{ variant.taxable }},
"featured_image":{% if variant.featured_image %}"{{ variant.featured_image }}"{% else %}null{% endif %},
"available":{{ variant.available }},"name":"{{ variant.name }} | escape",
"public_title":"{{ variant.public_title }} | escape","options":{{ variant.options | json }},
"price":{{ variant.price }},
"weight":{% if variant.weight %}{{ variant.weight }}{% else %}0{% endif %},
"compare_at_price":{% if variant.compare_at_price %}{{ variant.compare_at_price }}{% else %}null{% endif %},
"inventory_quantity":{{ variant.inventory_quantity }},
"inventory_management":{% if variant.inventory_management %}"{{ variant.inventory_management }}"
{% else %}null{% endif %},
"inventory_policy":
{% if variant.inventory_policy %}"{{ variant.inventory_policy }}"{% else %}null{% endif %},
"barcode":{% if variant.barcode %}"{{ variant.barcode }}"
{% else %}null{% endif %}}{% unless forloop.last %},
{% endunless %}{% endfor %}]
</script>

If you would like to show your Back In Stock form in a specific place on your product page, you will also need to insert the following code in the place you want the form to appear:

<div id="esc-oos-form"></div>

Congratulations! You have successfully enabled the app on your online store theme. 🎉

If you are still having troubles, feel free to contact our friendly support team and they will do it for you.

You can also schedule a meeting with our Product Manager here.