> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://docs.bloy.io/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# GemPages  integration

**GemPages** is the **#1 page builder** for Shopify, trusted by thousands of merchants to create stunning, high-converting storefronts, all without coding. With its drag-and-drop editor, you can fully customize every page to match your brand identity.
By integrating **BLOY** into **GemPages**, you can display your loyalty widget directly on GemPages-built pages, allowing customers to easily engage with your rewards program while enjoying a seamless shopping experience.
This guide walks you through integrating BLOY into GemPages using the **App Element method** - the simplest and most stable approach recommended by both platforms. 

### How to integrate with GemPages step-by-step
###### Step 1: Integrate with GemPages
* Navigate to the Integrations tab, you will see the app GemPages there. Click **Integrate** to be redirected to the GemPages's app listing. If you've already installed the GemPages, click Open app. 
![](https://storage.crisp.chat/users/helpdesk/website/-/5/9/c/9/59c9b009a3f42400/image_fllsxl.png)
###### Step 2: Create a page on GemPages
* Go to the [**GemPages Dashboard**](https://app.gempages.net/dashboard) and select your preferred page to enter the Editor. 
###### Step 3: Insert BLOY app blocks on the GemPages
* Navigate to the left sidebar > **Shopify apps** section. This is where you’ll discover all the apps equipped with app elements. You can make use of the search bar to quickly locate **BLOY Loyalty. **
![](https://storage.crisp.chat/users/helpdesk/website/-/5/9/c/9/59c9b009a3f42400/image_14ynvjo.png)
* Drag and drop the element into the position you prefer. 
![](https://storage.crisp.chat/users/helpdesk/website/-/5/9/c/9/59c9b009a3f42400/image_1c5e5ot.png)
* Click on the app element to open the **Settings** tab.
![](https://storage.crisp.chat/users/helpdesk/website/-/5/9/c/9/59c9b009a3f42400/image_herw2m.png)
###### Step 4: Save and Publish the page
 Click **“Save”** and **“Publish”** to make the changes go live.
![](https://storage.crisp.chat/users/helpdesk/website/-/5/9/c/9/59c9b009a3f42400/image_1c6pngt.png)
### Best practices
* **Placement:** Put the widget where customers are most likely to see it.
* **Visual Consistency:** Match your BLOY widget colors and fonts with your brand theme from the BLOY dashboard.
* **Mobile View:** Switch to GemPages mobile preview to ensure it displays properly on smaller screens.
* **Avoid Duplication:** Don’t add multiple BLOY elements on one page, one is enough for smooth performance.
* **Test Functionality:** After publishing, visit your live page and test the flow: Check that points or rewards are displayed correctly
### Troubleshooting
If the BLOY widget doesn’t show up:
* Confirm the **BLOY app and GemPages** is installed and embedded in Shopify. 
* Ensure the page is **published** in GemPages.
* Refresh your browser or clear cache (sometimes Shopify apps take a few minutes to load in the editor).
* If issues persist, contact **BLOY Support** or **GemPages Support** for compatibility checks.
That's how you can utilize the GemPages integration feature. If you need assistance, feel free to reach out to us via in-app Live Chat or at [__support@bloy.io__](mailto:support@bloy.io)