# Size Chart

<figure><img src="https://1003004518-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FO9T0eVpfbnvoysXhw8Kp%2Fuploads%2FqnI6AayEnjOsVNwh3OBu%2FScreenshot_144.png?alt=media&#x26;token=48a98bcd-7eab-4d5c-86fd-a91e8c603563" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
Spark offers 4 ways to show the Size Chart:

* [All Product](#by-all-product)
* [Product Vendor](#by-product-vendor)
* [Product Type](#by-product-type)
* [Different for each product](#by-different-for-each-product)
{% endhint %}

<figure><img src="https://1003004518-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FO9T0eVpfbnvoysXhw8Kp%2Fuploads%2F0x4JPISGiVXmIwAePaxG%2Fimage.png?alt=media&#x26;token=917f2222-5621-4092-984f-329720954dae" alt=""><figcaption></figcaption></figure>

## By All Product

1. From your Shopify admin, go to **Online Store** -> **Themes**.
2. Find the theme that you want to edit, and then click **Customize**.
3. Choose **Products** from the dropdown window.
4. Click **Product Top Layout.**
5. Scroll down to **Size Chart** and choose Using different size charts for products by following as **All Product.**
6. Upload the size chart image for all products.

<figure><img src="https://1003004518-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FO9T0eVpfbnvoysXhw8Kp%2Fuploads%2F3NcJsIfCE1b4NJNr76Od%2Fimage.png?alt=media&#x26;token=a227a069-0f29-4abe-9fc6-d697656a5822" alt=""><figcaption></figcaption></figure>

## By Product Vendor

1. From your Shopify admin, go to **Online Store** -> **Themes**.
2. Find the theme that you want to edit, and then click **Customize**.
3. Choose **Products** from the dropdown window.
4. Click **Product Top Layout.**
5. Scroll down to **Size Chart** and choose Using different size charts for products by following as **Product Vendor.**

<figure><img src="https://1003004518-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FO9T0eVpfbnvoysXhw8Kp%2Fuploads%2Fm4vtaoVVEYdDyNAIzPPL%2FScreenshot_147.png?alt=media&#x26;token=4abff8b5-b20b-4012-bf89-a3840d68f4f9" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
Upload image with the same name as the product-vendor-sizechart.

To get the image URL, please upload the image in **Settings** **->** **Files**. Then copy the link. You can refer to [this link](https://help.shopify.com/en/manual/shopify-admin/productivity-tools/file-uploads).

Naming convention: lower cap and use "-" to replace white space. For example: with the product vendor "Loremous Comodous" the image name will be loremous-comodous-sizechart.jpg or loremous-comodous-sizechart.png
{% endhint %}

## By Product Type

1. From your Shopify admin, go to **Online Store** -> **Themes**.
2. Find the theme that you want to edit, and then click **Customize**.
3. Choose **Products** from the dropdown window.
4. Click **Product Top Layout.**
5. Scroll down to **Size Chart** and choose Using different size charts for products by following as **Product Type.**

<figure><img src="https://1003004518-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FO9T0eVpfbnvoysXhw8Kp%2Fuploads%2FDqAXaHRRQANqVZ7Lsh6Q%2FScreenshot_148.png?alt=media&#x26;token=4fb06203-79ce-47b4-a350-6c5d8ff3533d" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
Upload image with the same name as the product-type-sizechart. You need to go to Settings --> Files upload images here.

Naming convention: lower cap and use "-" to replace white space. For example: with the product type "Loremous Comodous" the image name will be loremous-comodous-sizechart.jpg or loremous-comodous-sizechart.png
{% endhint %}

## By Different for each product

1. From your Shopify admin, go to **Online Store** -> **Themes**.
2. Find the theme that you want to edit, and then click **Customize**.
3. Choose **Products** from the dropdown window.
4. Click **Product Top Layout.**
5. Scroll down to **Size Chart** and choose Using different size charts for products by following as **Each of size chart for each of product.**

<figure><img src="https://1003004518-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FO9T0eVpfbnvoysXhw8Kp%2Fuploads%2FTCDUwgLYLv52NPKy32Wy%2FScreenshot_149.png?alt=media&#x26;token=5ab2877c-b9fa-45ca-b415-65319b856231" alt=""><figcaption></figcaption></figure>

**How to add new Metafields?**

1. From your Shopify admin, go to **Settings** -> **Custom Data**.
2. Click **Products → Add Definition.**
3. Please enter correct **Namespace and Key** as we noted below.

{% hint style="info" %}
```
Name: Size Chart
Namespace and key: c_f.size_chart
Select content type: Text
```
{% endhint %}

<figure><img src="https://1003004518-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FO9T0eVpfbnvoysXhw8Kp%2Fuploads%2FC7qcpYbHlXOyfsJZ8tBP%2Fsize_chart.jpg?alt=media&#x26;token=2c47a746-dcc6-4073-aa1e-4f2d3c166293" alt=""><figcaption></figcaption></figure>

4. In the Size Chart Metafield of each product, you can add the size chart image link you want.

<figure><img src="https://1003004518-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FO9T0eVpfbnvoysXhw8Kp%2Fuploads%2FX2p2ff1RwB07YfIhB5rf%2FScreenshot_150.png?alt=media&#x26;token=e03ab53d-33df-49a0-9274-09bad5fe266f" alt=""><figcaption></figcaption></figure>
