Shopify Question posted in
The Shopify help center can be found here.

How to include repeatable descriptions based on a product tag with Liquid? – Shopify

I have groups of same products, for example, t-shirts and longsleeve. I want to attach below product description three tabs with information that is model-dependent, so repeatable in every t-shirt. I wonder if there is better practice to do that, instead using “case”? In fact, I would have around 15 tags and prefer to avoid the mess in the code.

<!--Start tab labels-->
<ul class="tabs">
  <li><a class="active" href="#tab1">Info</a></li>
  <li><a href="#tab2">Care</a></li>
  <li><a href="#tab3">Details</a></li>
</ul>
<!--Start tab content-->
<ul class="tabs-content">
  <li class="active" id="tab1">
    {% case product_tag %}
    {% when 't-shirt' %}
        Our bestselling men's T shirt — in your pick of classic colors at a great price for stocking up.
    {% when 'longsleeve' %}
        Classic Long-Sleeve Cotton Tee features the same great fit with iconic Champion graphics. 
    {% endcase %}
  </li>
  <li id="tab2">
    {% case product_tag %}
    {% when 't-shirt' %}
        Wash up to 40 C.
    {% when 'longsleeve' %}
        Wash in cold water and do not iron!
    {% endcase %}
  </li>
  <li id="tab3">
    {% case product_tag %}
    {% when 't-shirt' %}
        100% cotton jersey feels great, won't weigh you down. (Grey and 
Heather are cotton-rich blends.)
Set-in mini-ribbed crewneck keeps its shape wash after wash.
Shoulder-to-shoulder taping helps prevent stretch-out and rip-out.
Durable double stitching reinforces cuffs and hem.
    {% when 'longsleeve' %}
        ll cotton comfort and breathability (Greys are a cotton-rich blend).
Ribbed cuffs and collar keep you covered.
Dyed-to-match back neck tape for no-itch comfort.
Bottom hem with clean-finish single needle stitching.
Iconic C logo on sleeve.
    {% endcase %}
  </li>
</ul>
Tags:

2

Answers


  1. 0

    You could use metafields for this. Metafields are custom fields that can be attached to Shopify objects and then referenced in Liquid. They can be uploaded using the Shopify API, an app from the App Store, or using the Shopify bulk editor.

    Using product metafields would look like this:

    <ul class="tabs-content">
  <li class="active" id="tab1">
     {{ product.metafields.private.extra_info }}
  </li>
  <li id="tab2">
    {{ product.metafields.private.washing_instructions }}
  </li>
  <li id="tab3">
    {{ product.metafields.private.further_info }}
  </li>
</ul>
    Login or Signup to reply.
  2. 0

    If you want to keep code clearer, you can store those information in pages, and then call the content of that page, depending on its tags, for example

    {{pages[product.tags.first].content}}
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search