Patternlab Technical Tips

comp.html.twig

{% set comp = node.field_competition.entity %}

{% set data = {
  location: node.field_location.value,
  has_audio: node.field_has_audio.value,
  comment: node.field_comment.value,
  score_opponent: node.field_score_opponent.value,
  highlights: node.field_match_highlights.value,
  competition: comp.field_name.value,
  competition_logo: comp.field_logo.entity.getFileUri() | image_style('small'),
} %}

{# Great for debugging; comment it when not needed #}
<ol>
  {% for key,value in data %}
    <li>{{ key }} - {{ value }}</li>
  {% endfor %}
</ol>

entities.twig

{% set venue = paragraph.field_venue.entity %}

{% set venueCity = venue.field_city.value %}
{% set venueState = venue.field_state.vanue %}

images.twig

{% set img = node.field_image.entity.getFileUri() %}
{# result: public://images/ocean.jpg #}

{% set imgUrl = file_url(img) %}
{# result: /sites/default/files/ocean.jpg #}

{# requires `twig_tweak` Drupal module #}
{% set smallImgUrl = img | image_style('small') %}
{# result: /sites/default/files/styles/small/ocean.jpg #}

top-level-template-variables.twig

{{ content.field_subtitle }}
<div class="field field--name-field-subtitle field--type-string field__item">
  I'm a subtitle
</div>

{{ paragraph.field_subtitle.value }}
I'm a subtitle