Overview

We will be showing size charts in the mobile app using shopify pages and product tags. This method ensures we can show different size chart content on different products and is also easy to maintain.

Example:

We want to show 4 size charts an our products:

Step 1: Finalise 4 tags corresponding to each of the 4 size charts

Each page can have the content we want to show on the size guide

Lets say our tags are: regular-fit-tshirt, slim-fit-tshirt, regular-fit-jeans, slim-fit-jeans

We need to ensure these tags are added to the products on which we want the size charts to be shown.

So in our example scenario we need to ensure, all tshirts of regular fit have regular-fit-tshirt tag on them, tshirts of slim fit have slim-fit-tshirt tag on them, jeans with regular fit will have regular-fit-jeans tag on them and finally jeans with slim fit will have slim-fit-jeans tag on them

Step 2: Create 4 pages one corresponding to each product tag

The page handles are of the format

size-chart-<tag>

So in our example scenario we will have 4 example pages

pages/size-chart-regular-fit-tshirt

pages/size-chart-slim-fit-t-shirt

pages/ size-chart-regular-fit-jeans

pages/size-chart-slim-fit-jeans

Update the content for each case. Generally, brands add an image showing how to measure and a table which shows all the measurements corresponding to each size.

Step 3: Update shopify theme to remove unnecessary scripts, headers, footers and popups

This ensures the page loads fast and the app user only sees the content relevant to them

The steps to do that are mentioned in the link below.

https://help.appbrew.com/merchandising/app-web-view/control-web-elements-in-app-webview

Step 4: Share the tags with appbrew team on support@appbrew.tech

Option to update this from dashboard is coming soon

FAQ

  1. How to add new size charts in the future?

    Create a new tag and a page as mentioned above and share the tag with the appbrew team on support@appbrew.tech

  2. How to modify existing size charts?

    Modify the page content on shopify dashboard like you would modify any other page