How to Set Up the Preorder and Notify Me Button on GemPages

STOQ automatically detects products on your storefront by looking for links (<a> tags) that point to product pages. GemPages does not add these product links by default, which means STOQ cannot identify products on GemPages-built pages. Without product links, the Preorder button and Notify Me button will not appear. This article walks you through how to fix this and enable STOQ's preorder and notify me buttons on your GemPages collection, home, search, and custom pages.

Why the Preorder and Notify Me Button Does Not Appear on GemPages

STOQ scans your page for links that contain /products/ in the URL. It uses these links to identify which products are displayed and then adds the appropriate Preorder or Notify Me button next to each one. When you build a page with GemPages, the product list may not include standard product links. If STOQ cannot find any product links, it has no way to know which products are on the page — so no buttons appear.

Supported GemPages Page Types

STOQ supports adding the Preorder and Notify Me button to any GemPages-built page that displays products. This includes:

• Collection pages — Product grids on collection or category pages built with GemPages
• Home page — Featured products, product carousels, and product grids on your GemPages home page
• Search pages — Products displayed in GemPages search results
• Custom pages — Any custom landing page or section built with GemPages that shows products

The fix described below applies to all of these page types. Once you add the product link element in GemPages, STOQ can detect products on any of these pages.

Step 1: Check if STOQ Can Detect Products on the Page

Before making changes, confirm whether the issue is a missing product link. Follow these steps to check.

1. Open the GemPages-built page on your storefront in Google Chrome.
2. Right-click anywhere on the page and select Inspect to open Chrome DevTools.
3. Click the Console tab.
4. Type the following command and press Enter:

window._RestockRocketConfig.products

5. Review the output:

• If the output is empty or shows {} — STOQ cannot detect any products on the page. This confirms the issue. Continue to Step 2 below to fix it.
• If you see product names or handles listed — STOQ is detecting products correctly. The issue is likely in your STOQ page settings. Go to Preorders → Settings → Pages in the STOQ app and make sure the correct page type is enabled.

Step 2: Add a Product Link Element in GemPages

To fix the missing product link, you need to add a "Product view more" element in GemPages. This element creates the <a> tag that STOQ needs to detect products on the page.

1. Open the GemPages app in your Shopify Admin.
2. Go to Sections and find the page or section that contains your product list.
3. In the Elements tab, look for the Product view more element.
4. Drag and drop the Product view more element onto any product in the collection. It will automatically apply to all products in that list.

Step 3: Hide the Product Link Button

The "Product view more" element adds a visible button to the page that you likely do not want customers to see. You can hide it using a CSS class and custom code in GemPages.

Add a CSS Class to the Element

1. Select the Product view more element you just added.
2. Click the Advanced tab in the element settings panel.
3. In the CSS class field, add a class name. For example: stoq-hidden-link

Add Custom CSS to Hide the Element

1. In the GemPages editor, open the Layer tree by clicking the seventh icon on the left sidebar. It shows a tooltip that says Layer tree when you hover over it.
2. In the layer tree, find and select the Row or Product list element that contains your products.
3. Right-click the element and select Custom code.
4. In the custom code editor, add the following CSS to hide the element:

.stoq-hidden-link {
  display: none;
}

5. Click Save to apply the custom code.

Step 4: Save, Publish, and Verify

After adding the hidden product link, save and publish your changes to confirm everything works.

1. Click Save and then Publish in GemPages.
2. Open the page on your storefront.
3. Verify that the "Product view more" button is not visible on the page.
4. Check that the Preorder or Notify Me button now appears on the relevant products.
5. If the buttons still do not appear, check your STOQ settings:

• Make sure the app embed is enabled (see How to check if STOQ app embed is enabled).
• Make sure the correct page type is enabled under Preorders → Settings → Pages.
• Make sure your preorder offer is enabled and linked to the relevant products under Preorders → Offers.

Step 5: Enable Quick Buy and Featured Product Integrations (Optional)

If your GemPages pages use Quick Buy modals or Featured product sections, the full preorder experience can also appear inside these elements. These integrations require a one-time setup by the STOQ team.

1. In the STOQ app, go to Preorders → Settings → Pages.
2. Click the Pages card to open the page editor.
3. Under each page type (Collection, Home, or Search), look for the Quick Buy checkbox. On the Home page, you will also see a Featured product checkbox.
4. Click the Request setup link underneath the relevant checkbox.
5. The STOQ team will review your GemPages layout and build the integration for your theme. You will receive an email and a chat message once it is ready.
6. After setup is complete, the Request setup link is replaced by a toggle you can enable or disable.

Known Limitations

• GemPages must include product links — STOQ relies on <a> tags with /products/ in the URL to detect products. If the "Product view more" element is removed or the link structure changes after a GemPages update, the buttons will stop appearing.
• Online Store 2.0 required — STOQ's app embed only works with Online Store 2.0 themes. This applies regardless of whether you use GemPages.
• Custom product card layouts — If your GemPages layout uses a non-standard product card structure, STOQ may not position the button correctly. You can use Dev mode to set custom selectors for button placement.
• Collaborator access required — If the STOQ support team needs to help configure your GemPages setup, they will need collaborator access to your store.
• Quick Buy and Featured Product require paid plan — These integrations also require a one-time setup by the STOQ team.

Troubleshooting

FAQs

Q: Does this fix apply to all GemPages page types?

A: Yes. Any GemPages section that displays a list of products — whether on a collection page, home page, search page, or custom landing page — needs the "Product view more" element for STOQ to detect the products.

Q: Will I need to redo this if I update my GemPages layout?

A: If you rebuild the product list section from scratch, yes. However, minor edits to the existing section should preserve the "Product view more" element and CSS class.

Q: Can I use a different class name to hide the element?

A: Yes. You can use any class name you prefer. Just make sure the class name you enter in the element's Advanced tab matches the one in your custom CSS code.

Q: Does this work for both Preorder and Notify Me buttons?

Yes. Both buttons rely on the same product detection mechanism. Once STOQ can detect products via the product links, both Preorder and Notify Me buttons will appear based on your offer and alert settings.

Q: Do I need collaborator access to make these changes?

A: You need access to the GemPages editor for the store. If you are the store owner, you already have access. If the STOQ support team is helping you, they will request collaborator access to your Shopify store.

Q: Does this also work with PageFly or other page builders?

A: The specific steps (adding "Product view more" and hiding it with CSS) are specific to GemPages. Other page builders like PageFly have their own integration methods. Contact STOQ support for help with other page builders.

Q: Do I need to repeat these steps for each GemPages page?

A: Yes. Each GemPages section that contains a product list needs the "Product view more" element added. If you have multiple pages (e.g., a collection page and a home page), you will need to add the element in each section separately.

Updated on: 08/05/2026