Use Design & settings in your dashboard to change what customers see and how your locator works.
Change the settings for your task, then select the save button on that page. Open Preview locator to check the result.
Start with your goal
| What you want to change | Where to go |
|---|---|
| Fonts, colors, or locator height | Appearance |
| Map style or location pins | Map & markers |
| Website links or directions buttons | Fields |
| Search suggestions, distances, or filters | Search & filters |
| The message when a search finds nothing | No results |
| Button wording or languages | Phrases |
| Styling written in CSS | Custom CSS, for advanced changes |
On this page
Settings overview
The sections above use the names shown under Design & settings. Most settings pages use Save Settings. The No results page uses Save changes.
Saving applies the change to your locator. Use the preview to check it before making more changes.
Appearance
Accent/Brand color
The accent color supplies the default color for map pins, buttons, and links. Choose your brand color as a starting point. Individual color settings can override it.
Font
| Setting | What it changes |
|---|---|
| Font Name | Chooses the typeface. Inherit from website uses your website's font. |
| Font Size | Sets the text size, from X-Small (12px) to X-Large (17px). |
Widget height
The widget is the locator displayed on your website. Height sets its height in pixels.
The locator fills the width of the website block that contains it. To change its width, adjust that block in your website editor.
Location selection display
Choose what happens when a customer selects a location:
| Option | What customers see |
|---|---|
| Detail Panel | Location details open inside the results list. |
| Map Popup | Location details open above the map pin. |
Map & markers
Map style
| Style | What customers see |
|---|---|
| Default | A full-color map. |
| Light Grayscale | A light map using shades of gray. |
| Dark Grayscale | A dark map using shades of gray. |
| Satellite | A map made from aerial images. |
| Accent Color Style | A map tinted with your accent color. |
| Custom Style | Your own Mapbox Studio style, when using Mapbox. |
Location pins
A marker is a pin that shows a location on the map. You can change its color or upload an image.
Clustering groups nearby pins into a numbered marker when the map is zoomed out. It helps customers see dense groups of locations.
See Custom Map Markers for setup steps, including different pins for tagged locations.
Fields
A location card is the part of the result list that shows one location's details.
Links
Link Color sets the color of clickable links on location cards.
Website field
| Setting | What it changes |
|---|---|
| Display as Button | Shows the website link as a button instead of text. |
| Label | Sets the words customers see. Leave it blank for the default label. |
| Button Color | Sets the button's color when button display is enabled. |
| Link Behavior | Chooses whether the website opens in the same tab or a new tab. Automatic lets Storepoint choose. |
Directions button
| Setting | What it changes |
|---|---|
| Display Button | Shows or hides the directions button. |
| Label | Sets the button text. The default is Get Directions. |
| Button Color | Sets the directions button's color. |
To add booking buttons, extra text, or more phone numbers, use Custom Fields.
Search & filters
For complete task instructions and examples, see Set up location search.
Initial view
Default View controls the map before a customer searches:
- Show all locations fits your locations into the map view.
- Center on user location starts near the customer's approximate position, estimated from their internet connection.
Request GPS Location Permission asks to use the device's more precise position. If the customer agrees, the map moves to that position.
See Auto-Detect Location for details.
Search options
| Setting | What it changes |
|---|---|
| Search Bar Placeholder Text | Sets the hint inside the empty search bar, such as Search by city or postcode. |
| Restrict Search Bar Suggestions to Certain Countries | Limits suggested places to the selected countries. |
| Restrict Search Bar Suggestion Types | Chooses which kinds of places appear, such as cities, postcodes, or addresses. |
| Enable Keyword-Based Suggestions | Adds matching location names to the search suggestions. |
| Show GPS Location Button | Shows a button customers can use to search near their device position, with permission. |
Selecting a location name moves the map to that location. Nearby results can also appear.
Keyword search bar
Enable Keyword Search Bar adds a second search field. It narrows the result list by name or other text.
The main search bar chooses a place. The keyword bar narrows the results for that place. For example, customers can search a postcode, then narrow the list by store name.
Keyword Search Placeholder Text sets the hint in this second field.
Showing where the customer searched
Show Search Point on Map adds a marker for the searched place or the customer's detected position.
Filter options
Hide Filters hides filter controls in the search area. Filter Logic controls how selected options work together:
| Option | Which locations match |
|---|---|
| AND | Locations that match every selected option. |
| OR | Locations that match at least one selected option. |
| OR within each filter, AND across filters | Locations that match at least one selected option in each filter. |
See the worked example in Tags & Filters.
Radius & limit settings
The radius is the distance around a searched place within which Storepoint looks for locations.
| Setting | What it changes |
|---|---|
| Default Search Radius | Sets the starting distance. With miles selected, 25 searches within 25 miles. |
| Hide Distance/Radius Filter | Hides the distance dropdown. The radius still applies. |
| Distance Unit | Uses miles, kilometers, or the unit local to each visitor. |
| Radius Options | Sets the distances customers can choose. Edit radius options. |
| Focus Map on Nearest Locations | Zooms to a chosen number of nearby results. Leave it blank to fit results within the radius. |
| Limit Number of Results | Caps the number of results shown. Leave it blank for no cap. |
Changing the zoom does not expand the search radius or override filters. Use the search guide to test a wider search.
Spotlight provides additional rules for areas, locations, and messages.
No results
No results message is the text customers see when a search has no matching locations.
- Open Design & settings → No results.
- Enter a message, such as
No stores found nearby. Try another city or a wider search distance. - Select Save changes.
- Test a search with no matching locations.
Only suggest a wider distance if customers can change it in your locator. Leave the message blank to use the default text.
Basic HTML is supported. The placeholders {{radius}} and {{units}} insert the search distance and unit into your message.
Phrases
Customizing text labels
Phrases contains wording such as button text, day names, and status labels. Select a phrase to edit its text. Save your changes after editing.
Multi-language support
- Select Add Language.
- Choose a language.
- Enter translations for the phrases.
- Save your changes.
Storepoint selects the language from the customer's browser settings. You can also set a fixed language for a page.
Custom CSS
CSS is code that changes visual styles. Use Custom CSS for advanced styling that the standard controls do not cover.
See Styling the Locator for instructions. Contact our team if you would like help matching your website design.
Check your changes
- Open Preview locator after saving.
- Check the setting you changed, such as a button, map pin, or search result.
- Check the locator on your published website too.
If the result differs from the preview, check for styling or code applied by your website.