How to install Grona on WooCommerce
Redesign your WooCommerce store pages, product listings, cart, and checkout with Grona.
Under 2 minutes
Why install
Why 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 redesign your live site, generate whole new sections with images, and ship campaigns, Grona needs your permission. Installing this snippet grants that permission and connects your site to Grona's agentic engine.
Live editing
Generate new sections, images, and styles on your existing pages through AI chat.
Campaigns
Run live campaigns and track results in real time.
Your choice of scope
Add to specific pages or your entire site.
The snippet
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 Grona's changes apply.
Main script: Powers Grona's agentic engine: live editing, campaigns, and tracking.
The snippet loads on all pages, including your shop, product pages, cart, and checkout. This means you can redesign any part of your store's purchase flow with Grona.
Replace YOUR_WORKSPACE_ID with the ID from your Grona dashboard. The complete snippet with your ID is available in Settings > Installation.
Install
Step-by-step instructions
Follow these steps to add the Grona snippet to your WooCommerce site.
- 1
WooCommerce runs on WordPress
WooCommerce is a WordPress plugin, so the installation process is the same as WordPress. You can use either the plugin method or the theme file method.
If you haven't already, check the WordPress installation guide for detailed instructions on both methods.
- 2
Install via WPCode plugin (recommended)
Install the WPCode plugin from Plugins > Add New. Once activated, go to Code Snippets > Header & Footer and paste the Grona snippet in the "Header" section. Click Save Changes.
- 3
Or edit your theme's header.php
Go to Appearance > Theme File Editor, open header.php, and paste the Grona snippet just before the </head> closing tag. Click Update File.
Theme file edits are overwritten during theme updates. The plugin method is more reliable for long-term use.
Verify
Verify your installation
Confirm the snippet is loading correctly.
- 1
Visit your WooCommerce store in a browser.
- 2
Navigate to a product page, the shop page, and the cart page.
- 3
Open DevTools (right-click > Inspect > Network tab) on each page.
- 4
Filter by "grona" and confirm both scripts load on every page.
- 5
Go to your Grona dashboard. Your site should appear as connected.
Ready to redesign the site you already have?
Paste your URL and watch Grona redesign it. Free to build, pay to go live.