01Copy your saved widget
In Locator → Widgets, save the widget and copy its Install snippet. This installs the widget on your storefront; it does not connect a product feed.
02Add Custom Liquid to the product template
In Shopify, open Online Store → Themes → Customize. Select the product template, choose Add section → Custom Liquid and paste the product snippet. Keep the generated embed id and origins; the example id below is a placeholder.
<script
src="https://cdn.test.stockisto.com/widget.js"
data-api-base="https://api.test.stockisto.com"
data-embed="we_0123456789abcdef0123456789abcdef"
data-sku="{{ product.selected_or_first_available_variant.sku | escape }}"
async
></script>
03Check the SKU and save
Liquid prints the selected or first available variant’s SKU and escapes it for an HTML attribute. Use a SKU that identifies the same product in Stockisto. An empty SKU does not identify a product. Save, open two published product pages and check that each sends its own code. A variant switch without a page reload needs the theme to remount the widget with the new SKU.
04Other placements and the app block
For a brand-wide finder, use the generated snippet without data-sku in a regular page or footer Custom Liquid section. Choose the widget type in your saved widget.
If you already have the Stockisto custom app installed, choose Add block → Apps → Stockisto Widget. Set its embed id and SKU source to Auto on a product template, then save. This custom app is distributed by an install link, not the Shopify App Store. Do not also paste the manual tag in the same placement.
05Verify the published page
Open the published storefront outside the theme editor. Check the embed lookup, product identity and shop links, then follow the installation checks and CSP rules.