Show product availability by store

What this article helps you do

Assign products to stores and add the product-availability block to your theme. The block shows shoppers which stores have a specified product.

Before you start

• Mapstore is installed.
• Mapstore has one or more stores.
• You assigned products to stores in the store form.
• You use the Shopify Online Store theme.

Step-by-step instructions

1. Assign products to stores

1. Go to Stores.
2. Open a store.
3. In the Product assignments or Products section, add the products this store carries.
4. The first time you select products, Shopify can request product-catalog access for Mapstore.
5. Accept the request to open the product picker.
6. Save the store.
7. Do the procedure again for other stores. You can assign a product to more than one store.

2. Add the product availability block

1. Go to Shopify Admin -> Online Store -> Themes -> Customize.
2. Open a product template (or the product page).
3. Add a new App block.
4. Select Mapstore product availability or Product availability.
5. If necessary, configure the button and drawer text.
6. Save.

3. Configure what shoppers see

With the product availability block selected, you can adjust labels such as:

• Button label
• Drawer title
• Loading text
• Empty state text
• Directions label
• Email and phone labels
• Close button label
• Error text

You can also select whether Mapstore shows email and phone links for a store.

4. Verify the block

On a product page with the block, shoppers see a button. When a shopper clicks the button, a drawer shows stores that have the product.

How to verify it worked

1. Open a product page that has the block and has products assigned to one or more stores.
2. Click the availability button.
3. Make sure that a drawer opens and shows store names, addresses, and directions links.
4. If a product has no stores assigned, the block shows an “unavailable” message.

Troubleshooting

Related articles

• Add Mapstore to your theme
• Add or edit stores