Skip to content
Help Center Pasilobus Help Center home

Theme Integration

Add Store Locator to your theme using the app block

Store Locator uses a theme app block to display on your storefront. You can add it to a dedicated page or embed it alongside other content on any page.

Creating a Dedicated Store Locator Page

This is the most common setup — a full page dedicated to your store locator.

Step 1: Create the Page

  1. In your Shopify admin, go to Online Store > Pages
  2. Click Add page
  3. Enter a title like "Store Locator", "Find a Store", or "Our Locations"
  4. You can leave the page body empty — the app block will provide all the content
  5. Click Save

Step 2: Add the App Block

  1. Go to Online Store > Themes and click Customize on your active theme
  2. Use the page dropdown at the top of the editor to navigate to your new page
  3. Click Add section
  4. Under Apps, select Store Locator
  5. Click Save

Your store locator page is now live. Visit the page URL to see it in action.

Adding to an Existing Page

You can embed the store locator on any page that supports sections, such as your Contact page or homepage.

On a Page Template

  1. Go to Online Store > Themes and click Customize
  2. Navigate to the page where you want the store locator
  3. Click Add section
  4. Under Apps, select Store Locator
  5. Drag the section to position it where you want
  6. Click Save

The app block works on any page template that supports sections. This includes the default page template, custom templates, and the homepage.

App Block Settings

After adding the Store Locator block, you can configure it directly in the theme editor:

  • Search bar - Show or hide the search input
  • List position - Place the location list on the left or right side of the map
  • Map height - Adjust the height of the map display

These settings are per-block, so you can have different configurations on different pages.

Make your store locator easy to find by adding it to your navigation menu:

  1. Go to Online Store > Navigation
  2. Select the menu to edit (e.g., Main menu or Footer menu)
  3. Click Add menu item
  4. Enter a name like "Locations" or "Find a Store"
  5. In the link field, search for and select the store locator page
  6. Click Save menu

Mobile Responsiveness

The store locator automatically adjusts for mobile devices:

  • Map and location list stack vertically on small screens
  • Touch-friendly controls and gestures
  • Optimized for mobile performance
  • "Get Directions" links open native map apps on mobile

Test the store locator on various devices to ensure a good experience for all customers.