Docs / Getting Started / Embed on Your Website / How to Add a Store Locator to WooCommerce

How to Add a Store Locator to WooCommerce

Add a searchable store locator, dealer page, or where-to-buy product locator to your WooCommerce store. No plugin to install. Works with Gutenberg, Elementor, Divi, WPBakery, and every page builder.

A Storepoint store locator on a WooCommerce store with search, filters, and brand-matched design

Add a store locator to any WooCommerce page in a single paste. Your Storepoint locator updates straight from your dashboard whenever your locations change, so the storefront you built stays exactly as you built it.

Use it as a store locator, dealer locator, stockist page, where-to-buy product locator, retailer finder, or service-area page. Drops into a Custom HTML block in Gutenberg, or the equivalent code element in Elementor, Divi, WPBakery, Beaver Builder, Bricks, and Oxygen. Works on every WooCommerce theme.

Start your free trial   See examples and features


Step 1: Set up your locator

  1. Create a Storepoint account and follow the prompts (you'll pick a map provider and a few basics), or log in if you already have one
  2. Add your locations: type them in, import a spreadsheet, or sync from Google Sheets
  3. Open Embed in the dashboard sidebar and copy your snippet

Open the Storepoint dashboard

Step 2: Paste it onto your page

In WordPress admin, go to Pages. Either edit your locator page (if you've built one) or click Add New and name it ("Store Locator", "Find a Store", "Where to Buy"). Then pick the path that matches your editor.

Gutenberg (the default editor)

  1. Click the + to add a block, search Custom HTML
  2. Paste your Storepoint snippet
  3. Click Publish or Update
Quick shortcut

On a new line in the editor, type /html and hit Enter. Custom HTML block, instantly.

Elementor

  1. Open the page with Edit with Elementor
  2. Drag in the HTML widget (in the General widgets section)
  3. Paste your Storepoint snippet into the HTML Code field
  4. Click Update

Divi

  1. Open the page in the Divi Builder
  2. Add a Code module to a row
  3. Paste your Storepoint snippet
  4. Click Save

WPBakery

  1. Add a Raw HTML element to your row
  2. Paste your Storepoint snippet
  3. Click Save Changes

Beaver Builder, Bricks, Oxygen, anything else

Look for an HTML block, Code Block, or Raw HTML element in your builder. Paste the snippet, save.

Classic Editor

  1. Click the Text tab in the top right (not Visual)
  2. Paste your Storepoint snippet
  3. Click Publish or Update
Stay in Text mode

If you switch to Visual after pasting, the editor will rewrite or strip the snippet. Paste in Text mode and save without flipping back.

Step 3: View your live page

Open the page on your site. Search for a location. Confirm the map and list both load.

Caching plugins

If you use WP Rocket, W3 Total Cache, LiteSpeed Cache, or your host's cache, purge once after pasting. Some caches hold an old version of the page until you do.

That's the full setup. From here, every location update flows through your Storepoint dashboard. Your WooCommerce store stays exactly as you built it.


Add it to your menu

To help shoppers find the page:

  1. Go to Appearance > Menus
  2. In the Pages box, tick your locator page and click Add to Menu
  3. Drag it to where you want it in the menu order
  4. Click Save Menu

If you use a mega-menu plugin, add it the way you'd add any other page.

Make it full width

Most WordPress themes hold pages to a content column with a sidebar. To let the locator stretch:

  • Look for a Full Width or No Sidebar template under Page Attributes in the page sidebar
  • In Elementor, mark the section as Stretch Section in the section's Layout settings
  • In Divi, set the row width to 100% and section padding to 0
  • In WooCommerce-aware themes (Storefront, Astra, Kadence), there's usually a "Full Width Page" template ready to go

Match your theme

Style it yourself from the dashboard: map style, marker pins, colors, button shapes, layout, custom CSS. Full CSS access is open on every plan.

Or have us style it for you, free.

Send us your WooCommerce store link and we'll match your locator to your theme. Fonts, colors, header height, button radius. Included on every plan. See examples →

Have a question?

Email [email protected] with your page link. We read every message and reply ourselves.

Where to go next

Still have questions?

We're happy to help anytime.

Get in Touch

Ready to get started?

Create your locator in minutes.