Delivery, Ask, Size chart

From Product page > Product Main > Click Add block > add Delivery, Ask, Size chart. You can drag it to any position that you wanna show it.

This option will not show on the Product page if you do not choose a page for the Size Chart, Delivery, Ask option.

Click on the Delivery, Ask, Size chart block, the settings sidebar will open and you guys can configure some options:

1. Delivery & Return

Use Delivery & return: Tick to this checkbox to enable Delivery & Return button
Add page Delivery & Return: Choose a page that you wanna show in the Delivery & Return option here. The page you should create in Shopify backend > Pages.

2. Ask A Question

Show Ask a question? checkbox: You can enable/ disable the Ask a question form here.

Show input phone: enable the Phone number field on Ask a question form.

When the customers submit on "Ask a question" form, you will receive an email via "Store contact email" like this:

3. Size Chart

Use size chart: There are three options for you: None, All Products and only products that have the variants name “Size”.
Position show size chart: You can choose between Default and Show on swatch variants name “Size”. If you choose Show on swatch variants name “Size”, the Size Chart will show next to the Size variant.

Size Chart Type: There are two types for you to choose: Image or HTML.

HTML Size Chart: This option allows you to choose a page that you created in Shopify backend > Pages for the size chart.

From Shopify Admin > Online Store > Pages > Add page > create the Size Guide page. You should create this page in HTML to make it flexible. You can go here to get the HTML codes as an example, then adjust them to fit your products.

Image Size Chart: This option allows you to upload an image for the size chart option.
Enter variant name you want has a size guide: Enter the variant name here. Example: 'Size' or another word in your language.

4. How to configure Product Metafield Size Guides?

If you wanna add a Size Guide for a specific product, you can follow the steps below.

4.1. Configure Metafield in Shopify Dashboard

In Shopify backend, go to Settings > Custom data > Products > Add definition

4.1.1. Add Metafield Size Guide – Image

Please create this metafield if you choose Size Chart Type is Image.

You need to configure some options below:

Name: You can add any name here. Ex: Size Guides
Namespace and key: You can add any keyword here. Example: theme.size_guide
Description: You can add any text for the description.
Select Content Type: This is a required option, you have to choose File.

Then click Save button to save all changes, we will get the metafield definition as image below:

4.1.2. Add Metafield Size Guide – Page

Please create this metafield if you choose Size Chart Type is Page.

You need to configure some options below:

Name: You can add any name here. Example: Size Guides Page.
Namespace and key: You can add any keyword here. Example: theme.size_guide2 or any words you want.
Description: You can add any text for the description.
Select Content Type: This is a required option, you have to choose Reference > Page.

Then click Save button to save all changes, we will get the metafield definition as image below:

4.2. Configure Metafield in Shopify Dashboard > Products

In Shopify backend > Products > All Products > open the product that you wanna add the Size Guide.

In the product, please scroll down to the bottom of the page, you will see the Size Guide metafield option. Kindly follow the video below:

4.3. Configure Metafield Size Guide in Theme Customize

In Themes > Customize > Product page > Choose the product that you wanna configure the Size Guide here:

In Product main > Delivery, Ask, Size-chart block, on the right side, scroll to bottom of Setting sidebar, you will see the option to choose Metafield.

Please follow the video below to configure the metafield Size Guide:

[Private Offer] EComposer Partner Plan

Exclusively for Belyn users, you can get EComposer - Theme Partner Plan for ZERO and start making beautiful, high-converting store pages today:

FREE 100% EComposer Standard plan for 6 months (save you $114)
Build ANY Shopify pages: Landing page, Sales Funnel page, Lead pages, & other custom pages tailored for your marketing campaigns.
Create advanced sections & add to Belyn with ease
Save up to 50 pages/sections
100+ professional, stunning pre-designed templates
Anyone can build pages with live drag-drop editor

How to claim offer: Install EComposer HERE. Then open chatbox icon in EComposer dashboard and leave a message with subject “Belyn+EComposer” to upgrade for free

Cheers,

The4.