How it works

Locator turns a set of store-location posts into a searchable, accessible directory. This page explains how it renders and how shoppers use it.

Server-side rendering first

When a page contains the [locator] shortcode, Locator queries every published location and renders them as cards directly in the HTML — as a list or a responsive grid, depending on your setting or the layout attribute. Because the cards are in the page from the start, the directory works even with JavaScript disabled and search engines see the full content.

Instant client-side filtering

When JavaScript is available, a search box appears above the cards. As the shopper types, Locator filters the cards already on the page by:

• city,
• postcode, or
• store name.

No request is made and no data leaves the page — the filtering is purely in the browser, so it is instant even with many stores. The result count is announced through an ARIA live region, so screen-reader users hear how many stores match.

Each card

A card shows the fields you enabled in settings: address, opening hours, phone, email and a Get directions link. Phone and email render as click-to-call and mailto links. Get directions opens the visitor’s map app using the store’s coordinates, or its postal address when no coordinates are set.

Accessibility

Locator is accessible by design:

• the result count uses an ARIA live region,
• the directory is keyboard friendly with visible focus styles,
• screen-reader-only text labels the search and results, and
• it respects prefers-reduced-motion.

The admin and storefront styles are also dark-mode aware.

Overriding the markup

To customise the card markup, copy the template into your theme:

templates/locator-list.php  →  your-theme/locator/locator-list.php

Your theme copy takes precedence, so you can restyle or restructure the cards without touching the plugin and without losing changes on update.

Performance

Locator only loads its assets on pages that contain the shortcode, and renders without layout shift. There is no external API, no map key and no tracking, which keeps both the page weight and the privacy surface small.