StoreRocket works great with Shopify. You can install it through the Shopify App Store or add the embed code manually. This guide covers both methods and the most common questions.
Method 1: Install via the Shopify App Store
Go to the StoreRocket app on the Shopify App Store
Click Add app and follow the prompts
Once installed, you'll be redirected to StoreRocket to set up your store locator
The app automatically connects your Shopify store to StoreRocket. It also creates a page called Store Locator on your Shopify store with the locator already on it, so you do not need to add any code. You can manage everything from the StoreRocket dashboard.
Method 2: Manual embed (for more control)
The app already puts the locator on its own Store Locator page. If you prefer to add it to a different page, or you did not install the app:
Go to your Widget Install page in StoreRocket
Copy the embed code
In Shopify, go to Online Store > Pages
Create a new page (or edit an existing one) for your store locator
Click the <> (Show HTML) button in the page editor
Paste the embed code
Save
Your store locator will appear on that page.
Will StoreRocket slow down my Shopify store?
StoreRocket does not inject code across your entire Shopify storefront. It loads only on pages where you add the locator, so your home, product, collection, and checkout pages stay untouched unless you deliberately place StoreRocket there.
On the locator page, the widget script loads asynchronously. The rest of the page can render while the locator loads separately instead of waiting for it first.
This page-scoped setup works the same way on any website, not only Shopify. If you install the optional floating button across your whole site, its script loads sitewide by design.
Setting up the map
After installing, you'll need a map provider. You have two options:
Google Maps: Requires a Google Maps API key. More features, but requires a Google Cloud account.
Mapbox: Free up to 50,000 loads/month, no credit card needed. Great for getting started fast.
Set your map provider in your Map Provider settings.
Google Maps API key on Shopify
If you're using Google Maps, you need to add your Shopify domain to the API key's allowed referrers. In the Google Cloud Console, add these referrers to your API key:
*yourstore.myshopify.com/**yourcustomdomain.com/*(if you have a custom domain)*storerocket.io/**.storerocket.io/**admin.shopify.com/*(for the Shopify admin preview)
Important: Billing on Shopify
If you pay through Shopify, uninstalling the StoreRocket app cancels its Shopify charge. If you pay by card, uninstalling does not cancel that subscription, so cancel it from your Billing page first.
To cancel without uninstalling:
If you pay by card: go to Account > Billing Portal and cancel your subscription in Stripe
If you pay through Shopify: cancel through Shopify admin, go to Settings > Apps and sales channels > StoreRocket > Cancel subscription
Adding the floating button on Shopify
The floating button is a small map pin icon that sits in the corner of your site. When visitors click it, the store locator pops up.
Go to your Floating Button Install page in StoreRocket
Copy the embed code
In Shopify, go to Online Store > Themes
Click Customize on your active theme
Look for App embeds or use the theme editor to add a custom HTML section
Paste the floating button code
Save
The floating button requires the Business plan.
Troubleshooting
Widget not loading on my Shopify store
Check these in order:
Is the embed code on the page? Go to the page in Shopify, click <> to view HTML, and confirm the StoreRocket script is there
Is your map provider set up? Check your Map Provider settings
Is your subscription active? Check your Billing page
Using Google Maps? Make sure your API key referrers include your Shopify domain (see above)
Locator is blank or missing from my page
If your StoreRocket account is inactive after its trial or subscription ends, the locator is hidden and visitors see no error message about the account. Open Account > Billing Portal to subscribe or reactivate, then reload your website to check the locator.
Linked to the wrong StoreRocket account
If the Shopify app connected to an old or wrong StoreRocket project, contact us on live chat and we'll help you relink to the correct account.
Widget too narrow or not full width
The widget takes the width of its parent container. If your Shopify page layout is narrow, the widget will be narrow too. You can adjust this by:
Using a full-width page template in your Shopify theme
Adding custom CSS in your theme to make the container wider
Questions about Shopify? Hit us up on live chat.