Render the first item of a paragraph field in twig- Super easy without a loop.

Submitted by melinda on Tue, 02/06/2024 - 22:58

Editors needed to tag different items to a piece of content. However because the content's header render the logo for the other tagged content, if you tagged more than two, the header would render for each tagged content.

Sooooo I thought I put a loop but because the header was based on a paragraph field, it was cooperating.

Easy solution Side by Side comparison.  (Basically, you just need to add a " .0 " to you twig field. Easy peasy!

Original Code  Render first item of field code 

<div class="container {%if '1' in content.field_show_meeting_materials.0%}has-mtg-materials{%endif%}">
    <div class="row">
        <div class="col-md-6">
        {% if content.field_meeting_logo.0 %}
            <a href="/site/{{short}}/meeting/{{mtg_short}}">{{content.field_meeting_logo}}</a>
        {% elseif mtg_name %}
            <a href="/site/{{short}}/meeting/{{mtg_short}}"><h1>{{mtg_name}}</h1></a>
        {% else %}
            <a href="/site/{{short}}/meeting/{{mtg_short}}"><h1>{{pagetitle}}</h1></a>
        {%endif %}
        </div>
     

<div class="container {%if '1' in content.field_show_meeting_materials.0%}has-mtg-materials{%endif%}">
    <div class="row">
        <div class="col-md-6">
        {% if content.field_meeting_logo.0 %}
            <a href="/site/{{short}}/meeting/{{mtg_short}}">{{content.field_meeting_logo.0}}</a>
        {% elseif mtg_name %}
            <a href="/site/{{short}}/meeting/{{mtg_short}}"><h1>{{mtg_name.0}}</h1></a>
        {% else %}
            <a href="/site/{{short}}/meeting/{{mtg_short}}"><h1>{{pagetitle}}</h1></a>
        {%endif %}
        </div>
      
      

 

Blog Type: