
Creating size charts in Shopify is one thing, but displaying them is completely the other. Your size chart could be stunning, but it's no use if people can't find it. That's why you need to choose the right display settings offered by the
app.So, before you get to the creative step, fill out the display settings for your size charts. There are a few options for that.
First, navigate to Sale channels > Online Store > Themes and click Customize.
Move to the App embeds tab and enable the Magefan size chart. You'll see the size chart link added to the page.
Now it's time to get to work. Start by adding the Label of your size chart and move on to the display settings.
Size Chart Type
There are two types of size chart labels available — link and button, which would be inline or hovering. Let's explore those in more detail.
Inline link
Choose Link as a Type and Inline for Placement to get the size chart link inserted into the page.
Inline button
Keep the same option for Placement, but change the Type to Button to get the following result:
Hovering button
Finally, you can also display a hovering size chart button. Just change the Placement to Fixed and choose the Button Position — left or right.
Size Chart Display Style
Popup is one of the most common options for the size chart display. But we also offer to display it in the flyout drawer, regardless of the size chart type you've just configured.
Popup
To get your size chart displayed in a popup, all you need to do is choose the corresponding option as the Display Style.
Here's what you'll get on the frontend:
Drawer
If you want to go with the drawer option, you also have to choose where it should fly out from (Drawer Position) — left or right.
The drawer style should look like this on the fronted:
Inline Size Chart Label Position
The default size chart position for the inline button or link is in the product content. However, you can change it to whatever position you need.
For that, move to the Sections tab and choose a place where to add the size chart link/button. Hit Add block and switch to Apps to add the Magefan size chart button.
Then, drag and drop it where you want to add it.
Don't forget to Save the settings once you finish and go create your size charts. Then define the size chart conditions to customize their display based on product types, collections, tags, etc.