Store Location
Combine a map, newsletter signup, contact info, and social links into a unified layout. Perfect for physical stores wanting to drive foot traffic.
Overview
The Store Location section provides everything customers need to find and contact you. It integrates Google Maps for interactive directions.
🗺️
Interactive Map
Google Maps integration
📧
Newsletter
Built-in email signup
📞
Contact Info
Phone, email, directions
🔗
Social Links
Connect all platforms
When to Use
- Contact page — Combined with contact form
- About page — Show where you're located
- Footer area — Quick access to location details
- Standalone page — Dedicated store locator
Quick Setup
Add Store Location in 4 Steps
- 1Add section → Store location
- 2Enter your Google Maps API key and Map query
- 3Configure contact options (directions, phone, email)
- 4Add Info row and Social row blocks for additional details
Section Settings
Content
| Setting | Type | Default | Description |
|---|---|---|---|
| Heading | text | Visit our store | Main section heading. |
| Subheading | richtext | - | Supporting text below the heading. |
Newsletter
| Setting | Type | Default | Description |
|---|---|---|---|
| Placeholder | text | Email address | Placeholder text for the email input. |
| Button | text | Subscribe | Submit button label. |
| Button style | select | Primary | Button appearance: Primary or Secondary. |
Map
| Setting | Type | Default | Description |
|---|---|---|---|
| Fallback image | image | - | Static image shown when no Google Maps API key is provided. |
| Google Maps API key | text | - | Your Google Maps Embed API key for interactive maps. |
| Map query | text | - | Location search query (address or place name). |
Directions
| Setting | Type | Default | Description |
|---|---|---|---|
| Show button | checkbox | true | Display a 'Get directions' button. |
| Label | text | Get directions | Button text. |
| Link override | url | - | Custom directions link. If empty, auto-generates Google Maps link. |
| Open in new tab | checkbox | true | Open directions in a new browser tab. |
| Style | select | Secondary | Button style: Primary, Secondary, or Link. |
Copy Address
| Setting | Type | Default | Description |
|---|---|---|---|
| Show button | checkbox | false | Display a 'Copy address' button. |
| Address text | text | Map query value | The text to copy when clicked. |
| Label | text | Copy address | Button text. |
| Success text | text | Copied! | Confirmation message after copying. |
Phone
| Setting | Type | Default | Description |
|---|---|---|---|
| Show link | checkbox | false | Display a clickable phone link. |
| Label | text | Call us | Link text. |
| Number | text | - | Your phone number. Triggers a call on mobile devices. |
| Style | select | Link | Appearance: Primary, Secondary, or Link. |
| Setting | Type | Default | Description |
|---|---|---|---|
| Show link | checkbox | false | Display a clickable email link. |
| Label | text | Email us | Link text. |
| Address | text | - | Your email address. Opens default mail client. |
| Style | select | Link | Appearance: Primary, Secondary, or Link. |
Layout
| Setting | Type | Default | Description |
|---|---|---|---|
| Reverse on desktop | checkbox | false | Swap map and content positions (content on left, map on right). |
| Width | select | Inherit | Container width: Inherit, Narrow, or Wide. |
Spacing
| Setting | Type | Default | Description |
|---|---|---|---|
| Desktop/Mobile top/bottom | range | 0px | Margin spacing above and below the section. |
Block Types
Info Row
Add custom information rows with icons.
| Setting | Type | Default | Description |
|---|---|---|---|
| Icon | image | - | Small icon image (24×24px recommended). |
| Heading | text | - | Row label (e.g., 'Opening Hours'). |
| Text | richtext | - | Row content (e.g., 'Mon-Fri: 9am-6pm'). |
Use for:
- Opening hours
- Parking information
- Special services
- Accessibility features
Social Row
Display links to your social media profiles.
| Setting | Type | Default | Description |
|---|---|---|---|
| Icon | image | - | Optional icon for the row. |
| Heading | text | - | Row label (e.g., 'Follow us'). |
💡 Note: Social links are pulled from your Theme Settings → Social configuration. Add your social URLs there to display them in this section.
Google Maps Setup
Get an API Key
- Go to Google Cloud Console
- Create or select a project
- Enable Maps Embed API
- Create credentials → API Key
- Restrict the key to your domain(s)
Configure the Section
- Paste API key in Google Maps API key
- Enter location in Map query (e.g., "123 Main St, New York, NY")
- The map will appear automatically
Fallback Option
If you don't want to use Google Maps API:
- Upload a static map screenshot as Fallback image
- The image will display instead of an interactive map
Best Practices
Contact Information
- Enable multiple contact options — Phone, email, and directions
- Use clear labels — "Call us" is better than just the phone number
- Add opening hours — Use an Info row block
- Include parking info — Helpful for physical stores
Map Presentation
- Use the interactive map — It's more engaging than static images
- Verify your map query — Test that it shows the correct location
- Consider reverse layout — Put content next to important page sections
Accessibility
- All links include proper ARIA labels
- Copy button provides feedback on success
- Phone links work on mobile devices
Troubleshooting
Map not displaying
- Verify API key is correct and active
- Check that Maps Embed API is enabled in Google Cloud
- Ensure Map query returns a valid location
- Try using the fallback image
Copy address not working
- Ensure Show button is enabled
- Verify Address text is filled in
- Check browser clipboard permissions
Newsletter signups not received
- Check Shopify Admin → Customers for new entries with "newsletter,store-location" tags
- Verify form is submitting without errors