I want to create a condition for TABs at the Product Page that changes depending on the product type

Highlighted

Hello! 

 

I would like to change one of the tabs showing (they contain Shipping info, product info etc) at my product's page, depending on the product type. for example, for product type 'T-Shirts' I want the tab with 'Product Specifications' showing. For a different type of products (posters for example), I would like another tab showing.

 

Is it possible to put this condition at the settings_data.json?

 

I have this part:

 

"1559349431332": {
"type": "text",
"settings": {
"tab_content": "product-specifications"

 

which directs tab content 'product-specifications' to the tab block '1559349431332'.

 

I would like to change it, let say, to a different page like 'poster-specifications' if the product type selected is different from 'T-Shirts'

 

The whole product-template code is below:

 

"product-template": {
"type": "product-template",
"blocks": {
"1559315507384": {
"type": "text",
"settings": {
"tab_content": "size-and-fit-information"
}
},
"1559349431332": {
"type": "text",
"settings": {
"tab_content": "product-specifications"
}
},
"1559589787199": {
"type": "text",
"settings": {
"tab_content": "shipping-info"
}
}
},
"block_order": [
"1559315507384",
"1559349431332",
"1559589787199"
],
"settings": {
"enable_zoom": true,
"layout": "classic",
"bg_color": "#f5f5f5",
"text_color": "default",
"bg_height": "full",
"image_size": "large",
"show_breadcrumbs": true,
"show_vendor": false,
"show_quantity_selector": true,
"enable_payment_button": false,
"show_share_buttons": true,
"show_related_products": true,
"related_title": "Related products",
"related_mobile_layout": "carousel",
"related_grid_num": 4,
"related_grid_row": 1
}
},

0 Likes
Shopify Partner
1658 48 168

No, there is no dynamic|conditional form controls in the theme editor system currently.

 

You should set these up as 2 distinct pieces of content if you are using the editor for control.

Otherwise simply do a check on the settings tab_content object in liquid and show the relevant view.

 

Problem Solved? ✔️Accept the solution so you can help others.
Confused? Busy? ? Get me to solve it paull.newton+shopifyforum@gmail.com.
Buy me a coffee? ☕ paypal.me/paulnewton or donate to eff.org
0 Likes

ere a way tu put a condition at the product-template.liquid then? 

 

That's the part for the tabs blocks:

 

{% for block in section.blocks %}
{%- assign tab = pages[block.settings.tab_content] -%}
{% unless tab.title == blank %}
<a href="#acc-{{ forloop.index }}" class="product-single__accordion__title js-accordion-trigger">
<h4 class="product-single__accordion__title-text">{{ tab.title }}</h4>
<span class="product-single__accordion__title-icon icon-fallback">
<i class="icon icon--plus" aria-hidden="true"></i>
<span class="icon-fallback__text">{{ 'products.layout.tab_label' | t }}</span>
</span>
</a>
<div id="acc-{{ forloop.index }}" class="product-single__accordion__item js-accordion-info">
<div class="product-single__accordion__item-wrap rte">
{{ tab.content }}
</div>
</div>

 

 

0 Likes

If anyone is interested, I managed to solve this putting a condition by product, like this one:

 

{% if product.type == 'T-Shirt' %}

{% for block in section.blocks %}
{%- assign tab = pages[block.settings.tab_content] -%}
{% unless tab.title == 'Product Information | Posters' or tab.title == 'Size and Fit Information | Tank Tops' %}

0 Likes