Liquid, JavaScript, themes, sales channels
I am currently having an issue checking and displaying product variant metafield with the below syntax. Any help would be great!
{% if variant.metafields.variant.shade != blank %}
<p>Hex: {{ variant.metafields.variant.shade }}</p>
{% endif %}
Hi @markatia,
Please change the code:
{% for variant in product.variants %}
{% if variant.metafields.variant.shade != blank %}
<p>Hex: {{ variant.metafields.variant.shade }}</p>
{% endif %}
{% endfor %}
You need to display product variant metafields.
Hope it is clear to you.
If you find my answer can help you solve your issue, please mark it as a solution. Thank you and good luck.
You can also check with variant.title. Ex:
{% for variant in product.variants %}
{% if variant.metafields.variant.shade != blank and variant.title == 'Red' %}
<p>Hex: {{ variant.metafields.variant.shade }}</p>
{% endif %}
{% endfor %}
With this you can filter out all metafields of variant.
If my answer can help you solve your issue, please mark it as a solution. Thank you.
Hi @LitExtension
For the Expanse theme, I've added variant metafield for each variant and want it to be displayed when the variant is selected, but it's not happening on selection, it's happening on refreshing the page.
Please can you provide suitable script of JS or jQuery or any other solution which can make the metafield updated on variant selection.
Here's what i'm trying:
{% for variant in product.variants %}
{% if product.selected_or_first_available_variant.id == variant.id %}
<strong> Grid ({{variant.title}}) Comes with {{ variant.metafields.custom.quantiry_per_box }} Units</strong>
{% endif %}
{% endfor %}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script type="text/javascript">
jQuery(document).ready(function($){
$(".no-js-hidden").on("click", function(){
var refreshint = setInterval(function(){
location.reload();
}, 1000); }); });
</script>
I'm using the same theme, and here is my code
{% for variant in product.variants %}
<div class="variant__description" data-variant-id="{{variant.id}}" {% if product.selected_or_first_available_variant.id == variant.id %} style="display: block;" {% endif %}>
{% if variant.metafields.custom.variant_size %}
<p><span class="font-body-bold">Dimension:</span>{{ variant.metafields.custom.variant_size }}</p>
{% endif %}
{% if variant.metafields.custom.variant_cubage %}
<p><span class="font-body-bold">Cubage:</span>{{ variant.metafields.custom.variant_cubage }}</p>
{% endif %}
</div>
{%- endfor -%}
the code is ok, but it's not updating on Expanse theme, it need to refresh the page. trying to configure theme.js but don't know the right code
User | RANK |
---|---|
37 | |
28 | |
13 | |
13 | |
9 |
On our Shopify Expert Marketplace, you can find many trusted third party developers and fr...
By Arno Nov 27, 2023You've downloaded the Search & Discovery app from the Shopify App store, and as you're ...
By Skye Nov 8, 2023The year-end shopping season is just around the corner. Is a flash sale on your radar? Are...
By Jasonh Nov 6, 2023