Skip to main content

Make a store card or image clickable

Use element-level links when only the image or a specific piece of text should be clickable. Use a card-level link when the entire result should open one destination.

Link an image or text element​

  1. Go to Store Locator → Builder.
  2. Open the Store Card or Map infobox design you want to change.
  3. Select the hero image or text element on the canvas.
  4. Open its link or interaction settings in the inspector.
  5. Select Store details page to use the current store's generated URL, or choose Custom URL and configure the supported store field/value.
  6. Choose whether the link opens in the same window or a new window.
  7. Save the design and test at least two different stores.

The destination must resolve separately for every repeated card. Do not paste one store's fixed details URL into a reusable template.

Make the complete card clickable​

  1. Select the outermost card container.
  2. Open the container's link or interaction settings.
  3. Choose Store details page or the required dynamic custom URL.
  4. Add a visible hover and keyboard-focus treatment so visitors know the card is interactive.
  5. Save and test with a mouse, keyboard, and touch viewport.

Do not make the entire card a link when it also contains separate clickable phone, directions, website, or details controls. HTML does not support links nested inside another link reliably.

Choose one of these patterns:

  • whole card opens details, with no separate links inside;
  • only the image/title/details button opens details, while phone and directions remain separate;
  • a non-link card contains several clearly labelled actions.

When a custom URL is empty​

Test a store that has no value in the selected URL field. The element should remain non-clickable or use the configured fallback; it should never produce an empty link, reload the current page, or navigate to an unsafe protocol.