If you build your product pages with GemPages, you can add the AI Frame try-on button right where you want it. The setup happens in two places, first in GemPages, then in your Shopify theme editor so just follow the steps in order and you'll be set.
Before you start
Make sure AI Frame is installed and its app embed is enabled on your theme. (If you haven't yet, see How to Install AI Frame's Virtual Try-On & Size Chart on Your Store.)
Step 1: Open your product page in GemPages
In your Shopify admin, open the GemPages app.
Select the page you want to edit; specifically a product page template, since that's where you want the Try-on & Size Chart button to appear.
Open that product page template in the GemPages editor.
Step 2: Add a Shopify app block and publish
On the page, go to "Integrated with all apps" and drag and drop a Shopify app block where you'd like the try-on button to appear.
Click in the top right corner on "Publish" the page.
Step 3: Open the Shopify editor from GemPages
Click on the Shopify app block you just added.
On the left, you'll see a setup panel - it shows steps like Set up in Shopify and Publish this page, with an option to Open Shopify editor.
Click Open Shopify editor.
Step 4: Add the AI Frame block inside the app section
This is the important part: the AI Frame block goes inside the Shopify app section, not in a separate block!
In the Shopify theme editor, scroll down until you see the Shopify app block on your product page template
2. On the left, you'll see the template's blocks. Click on the block (section) from the Shopify app.
3. Inside that section, click Add block. (This step matters !! the AI Frame block must be added within this section.)
4. Click Apps.
5. Choose AI Frame – Virtual Try-On to add it inside the block.
6. Click Save in the top right corner.
Check it worked
Preview your product page and look for the Try-on & Size Chart button. Give it a click to make sure the widget opens as expected. That's it, AI Frame is now live on your GemPages product page.
What's next? Make the widget match your store: How to Customise the Try-On Widget to Match Your Brand.
Need a hand? If the button isn't appearing on your GemPages page, send us a message, we're here to help!