How to Integrate and Adjust the Embedded Form in GemPages
GemPages allows you to create custom pages on Shopify, and if you are using an embedded form, you may need to adjust its position within your design. This guide explains how to modify the placement of the form and add a scroll-to-form button using Liquid blocks in GemPages.
To place the embedded form in a specific location on your GemPages layout, follow these steps:
Open GemPages and navigate to the page where you want to embed the form.
Add a Liquid block at the desired position.
Replace the default code inside the block with the following:
Save and publish the page.
This ensures that the embedded form appears exactly where you place the Liquid block.
If you want to include a button that scrolls the page to the embedded form, follow these steps:
Go to GemPages and open the editor for the page where the form is located.
Insert a Liquid block at the location where you want the button to appear.
Replace the default code in the block with the following:
Save and publish the page.
Once applied, this button will allow users to automatically scroll to the form when clicked, improving navigation for customers.
Open your store and navigate to the page where you added the embedded form and/or scroll button.
Verify that the form appears in the correct position.
Click the scroll button to ensure it moves the page to the form location.
If the form or button does not work as expected, clear your cache and refresh the page.
If you encounter any issues while integrating the form into GemPages, contact support for further guidance.
Step 1: Changing the Position of the Embedded Form
To place the embedded form in a specific location on your GemPages layout, follow these steps:
Open GemPages and navigate to the page where you want to embed the form.
Add a Liquid block at the desired position.
Replace the default code inside the block with the following:
<div class="_rsi-cod-form-is-gempage"></div>
<div id="_rsi-cod-form-embed-custom-hook"></div>Save and publish the page.
This ensures that the embedded form appears exactly where you place the Liquid block.
Step 2: Adding a Button to Scroll to the Form
If you want to include a button that scrolls the page to the embedded form, follow these steps:
Go to GemPages and open the editor for the page where the form is located.
Insert a Liquid block at the location where you want the button to appear.
Replace the default code in the block with the following:
<div class="_rsi-cod-form-is-gempage"></div>
<div class="_rsi-cod-form-gempages-button-hook"></div>Save and publish the page.
Once applied, this button will allow users to automatically scroll to the form when clicked, improving navigation for customers.
Step 3: Testing the Integration
Open your store and navigate to the page where you added the embedded form and/or scroll button.
Verify that the form appears in the correct position.
Click the scroll button to ensure it moves the page to the form location.
If the form or button does not work as expected, clear your cache and refresh the page.
Need Assistance?
If you encounter any issues while integrating the form into GemPages, contact support for further guidance.
Updated on: 19/03/2025
Thank you!