Shopify tutorial on size chart doesn't work (using a free theme)

Solved
abener
Excursionist
22 0 11

Hi. 

This is my website: aysebener.com 

I'm using a free Shopify theme - Brooklyn. 

I followed the steps in the following link to add size chart to my product pages: https://shopify.dev/tutorials/customize-theme-add-size-chart

I'm sure my page for the chart is visible: https://aysebener.com/pages/size-chart

I added the button to my product pages. 

Somehow, it doesn't work. 

How can I fix it?

Accepted Solution (1)

Accepted Solutions
Bo
Shopify Staff (Retired)
1751 195 450

This is an accepted solution.

Hey there, @abener 

 

Thank you so much for providing all of the links, it was very helpful! I took a look at your page using the Google Inspect tool and found that the code in the product-template.liquid was incorrect. To rectify this, please do the following: 

Steps:

1. Go to Online Store > Actions > Edit Code. 

2. In the Sections directory, click to open your product-template.liquid file or product.liquid file if you do not have a product-template.liquid file.

3. Find this code:

{% if product.options contains 'Size' %}
    <a class="size-chart-button trigger-pop-up btn btn--secondary-accent">See Size Chart</a>  
{% endif %}

4. Replace it with this: 

{% if product.options contains 'Size' %}
    <a class="trigger-pop-up btn">See Size Chart</a>  
{% endif %}

5. Click Save.

 

Let me know how this goes and if there is anything else I can assist you with, I'm happy to help!

 

All the Best,

Bo

 

Bo | Retired Staff Member

View solution in original post

Replies 5 (5)
Bo
Shopify Staff (Retired)
1751 195 450

This is an accepted solution.

Hey there, @abener 

 

Thank you so much for providing all of the links, it was very helpful! I took a look at your page using the Google Inspect tool and found that the code in the product-template.liquid was incorrect. To rectify this, please do the following: 

Steps:

1. Go to Online Store > Actions > Edit Code. 

2. In the Sections directory, click to open your product-template.liquid file or product.liquid file if you do not have a product-template.liquid file.

3. Find this code:

{% if product.options contains 'Size' %}
    <a class="size-chart-button trigger-pop-up btn btn--secondary-accent">See Size Chart</a>  
{% endif %}

4. Replace it with this: 

{% if product.options contains 'Size' %}
    <a class="trigger-pop-up btn">See Size Chart</a>  
{% endif %}

5. Click Save.

 

Let me know how this goes and if there is anything else I can assist you with, I'm happy to help!

 

All the Best,

Bo

 

Bo | Retired Staff Member

View solution in original post

abener
Excursionist
22 0 11

Hi. My code actually modifies the style of the button, nothing else. And when I perform the change you suggested, nothing changes. Please a see a recording of my screen: https://streamable.com/60f1wt

 

Bo
Shopify Staff (Retired)
1751 195 450

Hey again, @abener ! Apologies for that. I checked with our theme team and they would like to take a closer look at this so that they can help resolve it. It looks like we’ll need to access your account in order to resolve this issue. While we’re not able to provide account-specific support via the Shopify Community at this time, we’d be happy to continue assisting you through live chat, email, or callback. Please visit https://bit.ly/3cJkx8V and log in to your account to create a support request.

All the Best,

Bo

Bo | Retired Staff Member

abener
Excursionist
22 0 11

Hi, okay. I have created a request.

forkidsandplane
New Member
1 0 0

Hi There,

 

Trying to work out how to make the size chart work on my website...

I have added Size chart pages for each brand.

I am trying to add the size chart to the code as explained in the video here -  https://ecomexperts.io/blogs/liquid-tutorial-shopify/how-to-add-a-size-chart-to-shopify-product-page... and I have also tried the modification on the chat feed here. Each time I try to save it says I have an error  - 

This file contains the following errors:

  • Error: Invalid JSON in tag 'schema'

I currently have the size chart showing in the size drop-down menu for each product but when I click on the size chart it opens a blank page.

I would prefer the size chart to sit separately and for the page to open obviously. 

Thank you for any help at all.

 

Petra

www.forkidsandplanet.com