Every marker popup element except image has its own Alignment and Text color, and all of those except media buttons also have Background color and Border color.
Step 1: Open the popup content settings
In Store Locator, open Settings -> Markers.
Step 2: Pick an element to edit
Find the Marker popup content card and click Edit next to any element except image.
Step 3: Set its alignment and colors
Set Alignment and Text color, plus Background color and Border color when they are shown, then click Done.
Step 4: Go further with custom CSS
For anything those fields do not cover, open Settings -> Appearance and find the Custom CSS code card.
Step 5: Add your rules
Paste your rules into the CSS code field. It saves with the rest of your appearance settings and applies to the whole widget, including the popup.
What to do next
For the full set of per-element popup options, use Customizing marker popup content in your store locator.
For everything else custom CSS can touch, use Implementing custom CSS code.
To change the map look itself rather than the popup, use Customizing map style.
Stuck on any of this? Open the chat in the bottom right corner of the app and we will help you set it up.
Last verified on 2026-10-02 against proguscommerce-store-locator c7f49d0b (kb-ref: style-the-location-popup-with-custom-css).