On my default product page, I want to display a dynamic influencer section, in which influencers connected to a specific product would be shown. In order to do this, I created a metaobject called influencer (type: influencer) and a metafield with the same name (key: custom.influencer). To display the entries, I wrote the piece of code below. The influencer object accepts product entries in influencer.products (list of products).
I connected my entries both via metafield influencer in products as well as in the metaobject under influencer.products. I have been experiencing difficulties with my if statement {% if influencer.products contains product %} (see code below). My intention was to only display the influencers who are connected to this specific product. Without the if statement all the entries are displayed, with it - none.
I do not really want to use the customizer for it - not only because of a specific design I want to achieve, but also because of not all products having influencer entries (when the customized section is empty, it displays an error message on the product page).
Does anyone know what the issue with my if statement logic might be?
{% if product.metafields.custom.influencer != blank %}
<div class="influencers-title">
<h2 class="spc_section_heading span-12 auto">Influencers</h2>
<p class="spc_section_sub_heading span-12 auto">Experience our products in action.</p>
</div>
<div class="carousel-container">
<button class="scroll-btn prev-btn">❮</button>
<div class="carousel">
<div class="influencer-cards">
{% for influencer in shop.metaobjects.influencer.values %}
{% if influencer.products contains product %}
<div class="influencer-container">
<div class="img">
<img src="{{ influencer.photo | img_url: '500x' }}" alt="Influencer">
</div>
<div class="influencer-body">
<div class="influencer-name caption">
<h2 class="h1">{{ influencer.name }}</h2>
</div>
<div>
<h3 class="short-description">{{ influencer.influencer_short_description }}</h3>
</div>
<div class="btn_influ gallery__btn-wrapper">
<a href="#" class="open-popup"">
More Info
</a>
</div>
</div>
</div>
{% endif %}
{% endfor %}
</div>
</div>
</div>
{% endif %}
