How do you nest Jekyll loops when using multiple collections types

Question

So I have 3 lots of collections set up:

testimonials

services

case studies

I have a homepage and also 2 templates for both services and case studies to handle output of the testimonials.

I want to achieve 3 things:

On the case study template, using slick slider, display 1 'service related' testimonial from the testimonials collection. I'd want to achieve this through some front matter of the case study if possible, similar to categories. So that the user should only need to choose which service testimonial is appropriate for the case study e.g.

testimonial: Matthew Pope
On the services template, using slick slider, display multiple related testimonials for that service that the user can choose from, possibly as an array so:

testimonials: [ Matthew Pope, Jon Vining ]
On the homepage of the site using slick slider again, iterate through some case studies but only show the testimonial bit of the case study. The reason for this over just iterating over the testimonials collection is that I want to retain the case study link, so clicking on read more will take users to the case study that the testimonial features in.

Here is the code I have for the testimonial loop which is pretty much the same on each of the templates

{% assign testimonials = site.testimonials | where: 'title', page.testimonials | first %}
{% for testimonial in testimonials %}
<div class="testimonial-entry">
    <p class="lead font-italic padding-1">{{ testimonial.content }}</p>
    <div class="grid-x grid-margin-x align-middle testimonial-entry__meta">
        <img class="cell medium-shrink avatar--medium margin-top-1" src="{{ testimonial.avatar }}"/>
        <p class="cell medium-auto margin-bottom-0 margin-top-1"><strong>{{ testimonial.title }}</strong><br/><small>{{ testimonial.job }}</small></p>
    </div>
</div>
{% endfor %}

Here is the front matter for each item in the testimonials collection:

---
title: Name
job: Job Title
avatar: "/assets/images/uploads/client-avatars/firstname-secondname-150x150.jpg"
solution: Service Name
---

Content here

I'm struggling to output the testimonials defined in the front matter of both case studies and services, I'm not sure how best to define the front matter.

David Jacquel David Jacquel · Accepted Answer · 2018-03-22T17:15:30

{% assign testimonials = site.testimonials 
   | where: 'title', page.testimonials %}

Returns nothing because page.testimonials is an array, and you cannot compare a testimonial.title (string) and a page.testimonials (array).

But you can test if an array contains a string:

{% for testimonial in site.testimonials %}
    {% if page.testimonials contains testimonial.title %}
    <div class="testimonial-entry">
...
    </div>
    {% endif %}
{% endfor %}

How do you nest Jekyll loops when using multiple collections types

1 Answers