Community guidelines

Please keep discussions civil and on-topic. Repeated violations may lead to a temporary ban.

Themes & Styling

For loop in another for loop

Started by mikael 9 years ago · 2 replies · 691 views

9 years ago

<div class="card-group transp">
{% for mainsubject in page.header.mainsubjects %}
<div class="card transp">
<div class="card-block">
<h4 class="card-title">{{ mainsubject.title }}</h4>
<p class="card-text">{{ mainsubject.text }}</p>
<ul class="list-group list-group-flush">
{% for link in page.header.mainsubjects.links %}
<li class="list-group-item transp"><a href="{{ link.title }}" class="card-link">{{ link.title }}</a></li>
{% endfor %}
</ul>
</div>
</div>
{% endfor %}
</div>

Frontmatter:

YAML

mainsubjects:
    -
         title: title
         text: test
         links:
            -
                title: test
                link: http://www.test.com
            -
                title: test
                link: http://www.test.com
    -
         title: title
         text: test
         links:
            -
                title: test
                link: http://www.test.com
            -
                title: test
                link: http://www.test.com

Hi! Cannot get the link to list within each mainsubject. The first for loop works good, just not the for loop inside...

Appriciate all help!

Thanks!

last edited 07/25/17 by mikael

9 years ago Solution

Hi
I've done something similar but can't seem to find my example so kinda just thinking out loud here but I think you can use the first loop for the second loop- something like
{% for link in mainsubject.links %}
because I think as it is you'll get all 4 links coming through at once - no?

9 years ago

Wow! Thank you very much! I did think of the option it would read directly through the first loop :) haha so happy! This is much simpler then i expected!
This works great! So you are right, if you create a loop of any data set then the loop of datasets inside that would not need where to go other then the second loop.

TWIG

   <div class="card-group transp">
  {% for mainsubject in page.header.mainsubjects %}
  <div class="card transp">
    <div class="card-block">
      <h4 class="card-title">{{ mainsubject.title }}</h4>
      <p class="card-text">{{ mainsubject.text }}</p>
      <ul class="list-group list-group-flush">
        {% for link in mainsubject.links %}
        <li class="list-group-item transp"><a href="{{ link.title }}" class="card-link">{{ link.title }}</a></li>
        {% endfor %}
      </ul>
    </div>
  </div>
  {% endfor %}
</div>

Thank you again!

Topic	Replies	Views	Activity
Grav 2 + Admin2: custom page blueprint fields not showing in Admin Themes & Styling · by Pedro M, 2 months ago	4	197	2 months ago
Change page background colour Themes & Styling · by Ian, 2 months ago	3	92	2 months ago
Customizing Blog Post Layout Using "Summary Size and Separator" Themes & Styling · by Norbert, 2 years ago	11	454	3 months ago
Fork of the Knowledge Base theme Themes & Styling · by Lukáš Findeis, 3 months ago	0	47	3 months ago
Oxygen theme not working right Themes & Styling · by Sebadamus, 4 months ago	5	127	3 months ago

Suggested topics