Skip to main content

Installing StoreRocket on Webflow

How to add your store locator to a Webflow website and avoid common issues.

Updated yesterday

Webflow and StoreRocket work great together. Here's how to set it up.

Adding the embed code

  1. Go to your Widget Install page in StoreRocket and copy the embed code

  2. In the Webflow Designer, open the page where you want the store locator

  3. Add an Embed element (find it in the Components panel or press A and search "Custom Code")

  4. Paste the StoreRocket embed code

  5. Click Save & Close

  6. Publish your site

The store locator will appear on your published site. It won't show in the Webflow Designer preview since that doesn't run external JavaScript.

Common Webflow issues

Widget disappears after republishing

This is the most common Webflow issue. When you republish your site in Webflow, sometimes the embed code gets stripped or reset.

Fix: After republishing, check that the Embed element still contains the StoreRocket code. If it's gone, paste it again and republish.

Prevention: Keep your embed code saved somewhere (like a Google Doc) so you can quickly re-paste it when needed.

Widget not showing in Webflow preview

This is normal. Webflow's Designer preview doesn't execute external scripts. Publish your site and check the live URL instead.

Google Maps API key domain restrictions

If you're using Google Maps, add your Webflow domain to the API key's allowed referrers:

  • *yourdomain.com/* (your custom domain)

  • *yoursite.webflow.io/* (your Webflow staging domain)

  • *storerocket.io/*

  • *.storerocket.io/*

Widget not full width

Webflow containers have a max-width by default. To make the store locator full width:

  1. Place the Embed element inside a Section (not inside a Container)

  2. Or set the parent container's max-width to 100% and remove padding

Using the floating button on Webflow

  1. Go to your Floating Button Install page in StoreRocket

  2. Copy the floating button code

  3. In Webflow, go to Project Settings > Custom Code

  4. Paste the code in the Footer Code section

  5. Publish

The floating button will appear on every page of your Webflow site.

Questions? Hit us up on live chat.

Did this answer your question?