How to add a Size Chart to your product pages

Pipeline has the ability to show a popup Shopify Page on all your product pages. This or product tabs can be used for displaying a size chart to your customers. 

How to use:


Create a size chart page

In your Shopify Admin, create a page that will be used as your size chart to display on your product pages. That's done in your Page admin:

Note - The title will be used as the popup link. Choose a title like Size Chart or something that best describes the link. 

See the links below for help with creating responsive tables that will work best for mobile devices and desktop browsers.


Open your product page settings in the theme editor

Customize theme:

From the top drop-down menu, choose Product pages:

The left sidebar will now show Product pages - Click on that section to open the settings:

In the Product page settings find the Optional Sizing Popup settings:

Here you can choose your size chart page you created in Step 1. 

Notes: The same size chart is used on all your product pages. When creating a size chart page, try and include all types of sizes needed for the customer. If you need custom size charts, there is a link below to a tutorial that requires some custom code. Another option is to use tabs with links to all your size charts. 

Additional resources

Responsive tables - How to create

Create a responsive size chart page using flexbox

Size Charts: Example of custom size charts based on product type

If your theme is older then Pipeline 3.0 the above feature is not included. You can manually code a popup feature using this method:

How to use Shopify's Size Chart tutorial in Pipeline