Set up STOQ buttons on GemPages
STOQ finds products on a page by looking for links that contain /products/. GemPages pages don't add those product links by default, so STOQ can't detect the products and the buttons don't show. Adding a product link element fixes it.
Before you begin
- You're on an Online Store 2.0 theme with the STOQ app embed enabled. See Enable STOQ on your theme.
- The page type is turned on in STOQ (under Preorders > Settings > Pages, or the back in stock equivalent).
- Your preorder offer or back in stock signups are active for the products on the page.
Add a product link GemPages elements can be detected by
Add a product link element
In your GemPages editor, add the Product view more element to each product in the list. This creates the /products/ link STOQ needs to detect the product.
Hide the element visually
You don't want that link visible. Give the element a CSS class (for example stoq-hidden-link) and add custom CSS display: none; in GemPages so the link stays in the HTML but isn't shown.
Save and publish
Save and publish the page. Buttons only update on the published version.
Confirm the buttons show
Open the live page and confirm the STOQ button appears while your hidden helper element stays out of view.
Add the element to each GemPages section that lists products. For Quick Buy modals or Featured Product layouts, ask STOQ support to set those up.
Troubleshooting
Buttons still don't appear
Confirm each product has the hidden product link element, the page type is enabled in STOQ settings, and the offer or signups are active. In Chrome DevTools, window._RestockRocketConfig.products should list the page's products.
Buttons stopped appearing after a GemPages update
A GemPages change may have altered the link structure. Re-add the product link element to the affected sections.
The button is in the wrong spot on a custom card
Custom product card layouts may need Dev mode to position the button. See Position elements with dev mode.
