I have received a design where they want to have the latest three articles links put on the top of the front page (over their respective images) so that the first is taking left half of the page and second and third to split (vertically) the right half top.

I thought that view-view--latest-articles.html.twig would solve the problem elegantly like this:

<div class="row">
{% for row in rows %}       
    {% if loop.index == 1 %}
      <div class="col-6">
          {{ row }}
    {% elseif loop.index==2 %}
    ...   // dull and inelegant code dismissed
    {% endif %}
{% endfor %}

But if I put debugging code for loop.index into the code it only shows the index once and splurts out all the rows after it, never minding my if. It still shows the index once, so I know it IS using the template.

Am I missing something or trying just to it in a wrong way?

  • In my experience something like this always is a missing </div> or </a> or similar somewhere. Check the page source (the !! real !! page source, not the postprocessed source code in the browser dev tools), or run your page through the W3C html validator
    – Hudri
    May 26 at 10:04

And as it so often happens: Just after fighting a pair of hours with this and then finally asking the question here, I found out the solution myself. I had to make the code in views-view-unformatted--latest-articles.html.twig (i.e. had to add the -unformatted to my question part).

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.