Help Center > Search & Filter Features

Add an External Search Bar for Your Locator Widget

Learn how to easily add a search bar to any page on your website that integrates seamlessly with your Storepoint store locator or directory. This step-by-step guide covers setup, tag filtering, and helpful tips to enhance your website’s search functionality. Perfect for locators, directories, and more!

Would you like your customers to search for locations directly from any page on your website? With Storepoint, you can easily add a search bar anywhere on your site that seamlessly works with your store locator. This guide will walk you through how to set it up.

Setting Up the External Search Bar

Step 1: Add the Search Form to Your Page

Copy and paste the code below wherever you'd like the search bar to appear on your site. Make sure to replace STORE_LOCATOR_URL_HERE with the URL where your store locator is located.

<form action="STORE_LOCATOR_URL_HERE" method="get">
    <input type="text" name="locate" placeholder="Find near..." />
    <input type="submit" value="Search" />
</form>
  • Replace the Placeholder: Update STORE_LOCATOR_URL_HERE with the URL of the page where your locator is embedded. For example, if your locator is on https://example.com/locator, use that URL.

Note: This setup requires minimal development skills. You just need to replace the placeholder URL with your own store locator page link.

Step 2: (Optional) Add Tag Filtering

If you want users to also filter by a specific tag, you can add a dropdown for tag selection. Here's an example of the full code snippet to do that:

<form action="STORE_LOCATOR_URL_HERE" method="get">
    <input type="text" name="locate" placeholder="Find near..." />
    <select name="tags">
        <option value="">--Select a Tag--</option>
        <option value="example-tag-1">Example Tag 1</option>
        <option value="example-tag-2">Example Tag 2</option>
    </select>
    <input type="submit" value="Search" />
</form>

This will allow your customers to search by location and also pre-filter results by tags.

How It Works

  • When someone uses this search bar, they will be redirected to your store locator page, and the results of their search will be displayed immediately.
  • All searches made using this external search bar will use geocoding (converting locations like cities or ZIP codes into map coordinates). These requests will count toward your geocoding requests on your map provider (Mapbox or Google Maps), just like searches made directly in the locator.

Need Help?

If you have any questions or need assistance setting this up, our support team is here for you! Feel free to reach out at [email protected].

Summary

This guide helps you add a separate search bar anywhere on your website to allow customers to find locations effortlessly. It will redirect them to your Storepoint locator and perform the search automatically. Whether it's for a simple search or including tag filtering, this easy setup can greatly enhance your website's navigation.