Events Module: Image for Events Group Layout

CMS > Content Modules Events
1

Hello everyone, maybe someone can give me a tip. I have created a property “Bilder” and “Coverbild_Eventgruppe” (Boolean) in the event module. Now I want the image to be rendered with the matching ParentID and the value true in a slider on the start page. I loaded the two collections and tried to filter them, but unfortunately it doesn’t work the way I’m trying. The text of the event group is displayed but the image from the other collection is not loaded.

{% component source: "Event group", layout: "", object: "collection", collectionVariable: "eventGroup", type: "module" %}
{% component source: "Event", layout: "", object: "collection", collectionVariable: "ColKurse", type: "module" %}

<div class="swiper-container-items">
    <div class="swiper-wrapper">
        {% for item1 in eventGroup.items %}
        <div class="swiper-slide">
            <a href="{{ item1.url}}">
                {% assign filteredItems = ColKurse | where: "ParentId" | where: "Coverbild_Eventgruppe", true %}
                {% for item2 in filteredItems %}
                <img src="{{ item2.Bilder }}" alt="{{ item2.title }}" />
                {% endfor %}
                <h2>{{ item1.name }}</h2>
            </a>
        </div>
        {% endfor %}
    </div>
    <div class="swiper-button-prev"></div>
    <div class="swiper-button-next"></div>
</div>
2

Hi @Roland

I think the | where filter is a newer addition to Liquid and not yet supported in Treepl.

You could achieve the same with an IF condition within your second forloop that loops the collection in full, like this perhaps:

{% for item2 in ColKurse.items %}
{% if item2.parentId == item1.id and item2.Coverbild_Eventgruppe == true %}
<img src="{{ item2.Bilder }}" alt="{{ item2.title }}" />
{% endif %}
{% endfor %}

Hope that helps.

3

that gets the job done. thank you adam! :+1: