Treez

How to Customize Your Location Pop-Up

You can now update the headers, button text, and links in your location modal using the new Store Locator document in Prismic. Follow the steps below to get started.

Step 1: Add the Store Locator Page in Prismic

Log in to Prismic and open your content management repository.

Create a new page by clicking the “+ Create a new page” button in the top-right corner.

Search for “Store Locator” in the document types and select the Store Locator template.

1. Log in to Prismic and open your content management repository.
2. Create a new page by clicking the “+ Create a new page” button in the top-right corner.
3. Search for “Store Locator” in the document types and select the Store Locator template.

Step 2: Customize the Store Locator Page

Once your page is created, you’ll be able to configure the following elements:

Title – Displayed at the top of the modal. Example: “How Do You Want to Shop?” or “Pickup or Delivery”

Pickup Section Title – Text shown after a user selects Pickup. Example: “Select Pickup Location”

Delivery Section Title – Text shown after a user selects Delivery. Example: “Enter Your Delivery Address”

- Title – Displayed at the top of the modal. Example: “How Do You Want to Shop?” or “Pickup or Delivery”
- Pickup Section Title – Text shown after a user selects Pickup. Example: “Select Pickup Location”
- Delivery Section Title – Text shown after a user selects Delivery. Example: “Enter Your Delivery Address”

Main Button Type – Choose the button style:

- Primary (main theme color)
- Secondary
- Tertiary

Pickup Main Button Text – Example: “Shop Pickup”

Delivery Main Button Text – Example: “Shop Delivery"

- Main Button Type – Choose the button style:
 - Primary (main theme color)
 - Secondary
 - Tertiary
- Pickup Main Button Text – Example: “Shop Pickup”
- Delivery Main Button Text – Example: “Shop Delivery"

Secondary Button Text – Example: “View Map”

Secondary Button Link – Define the page to link to. Example: “store-locator”

Hide Secondary Button – Set to True to hide this button.

Hide Icon on Secondary Button – Set to True to hide the map pin icon.

- Secondary Button Text – Example: “View Map”
- Secondary Button Link – Define the page to link to. Example: “store-locator”
- Hide Secondary Button – Set to True to hide this button.
- Hide Icon on Secondary Button – Set to True to hide the map pin icon.

The image below shows how each field in Prismic maps directly to elements in the Location Pop-Up on your ecommerce site, making it easy to see where your customizations will appear.