How to install Grona on Shopify
Add Grona to your Shopify store and start optimizing your pages. One snippet in your theme file.
Under 2 minutesWhy you need the Grona snippet
Grona's research and competitive intelligence features work without any code on your site. You can analyze competitors, review traffic data, and get AI-powered recommendations right from the dashboard.
To make live changes on your website, like editing text, swapping images, adjusting styles, or running experiments, Grona needs your permission. Installing this snippet grants that permission and connects your site to Grona's optimization engine.
Live editing
Change text, images, and styles through AI chat.
Experiments
Run A/B tests and track results in real time.
Your choice of scope
Add to specific pages or your entire site.
Your Grona snippet
Copy this and paste it into your website's <head> section.
<link rel="preconnect" href="https://cdn.grona.ai">
<script src="https://cdn.grona.ai/workspaces/YOUR_WORKSPACE_ID/antiflicker.js" data-grona-af-bg="#ffffff"></script>
<script src="https://cdn.grona.ai/workspaces/YOUR_WORKSPACE_ID/main.js" async></script>Preconnect: Speeds up loading by establishing an early connection to Grona's CDN.
Antiflicker script: Loads synchronously to prevent content flash before optimizations apply.
Main script: Powers Grona's optimization engine: live editing, experiments, and tracking.
Adding the snippet to theme.liquid loads Grona on every page of your store, including product pages, collections, cart, and checkout. If you want to optimize only specific pages, you can wrap the snippet in Shopify's conditional tags.
Replace YOUR_WORKSPACE_ID with the ID from your Grona dashboard. The complete snippet with your ID is available in Settings > Installation.
Step-by-step instructions
Follow these steps to add the Grona snippet to your Shopify site.
Log in to your Shopify admin
Go to your Shopify admin panel. You can access it at your-store.myshopify.com/admin.
Navigate to your theme files
Go to Online Store > Themes. Find your current (published) theme and click the "..." menu, then select "Edit code."
Open theme.liquid
In the left sidebar under Layout, click on theme.liquid. This is the main template file that wraps every page of your store.
Paste the Grona snippet
Find the </head> closing tag in theme.liquid. Paste the Grona snippet directly above it. This ensures the script loads on every page of your store.
If you only want Grona on specific pages, you can use Shopify's conditional logic to limit where the snippet loads. For most users, adding it to theme.liquid (site-wide) is recommended.
Save your changes
Click the Save button in the top right. Your changes go live immediately.
Verify your installation
Confirm the snippet is loading correctly.
- 1Visit your live Shopify store in a browser.
- 2Open DevTools (right-click > Inspect > Network tab).
- 3Filter by "grona" in the network requests.
- 4Confirm you see antiflicker.js and main.js loading successfully (status 200).
- 5Go to your Grona dashboard. Your site should appear as connected.
Ready to optimize your site?
Paste your URL to see what Grona can do. Free to start.