12

I have a content type, basic, where i have added a Paragraph field field_pr that has two fields: field_text, field_color. I have a twig template node--basic--full.html.twig where I want to print the value of the paragraph field node.field_pr.

node.field_pr can have between one and ten paragraph values.

When I print the array for content.field_pr, I get a huge array. However, I only want the values from the field_pr.field_text and field_pr.field_color. How would I be able to do this from the node twig template?

I have tried the following but cannot seem to access the values. What am I missing?

{% for field in content.field_pr %}
   {{ field[loop.index0].entity.field_text.value }}
   {{ field[loop.index0].entity.field_color.value }}
{% endfor %}

{% for field in content.field_pr %}
   {{ field[loop.index0]['#paragraph'].field_text.value }}
   {{ field[loop.index0]['#paragraph'].field_color.value }}
{% endfor %}

Here is an image of the array that is printed for the node.field_pr field. array that is printed for the node.field_pr field

Improve this question

5 Answers 5

Reset to default
8

Not sure if it's possible with your current approach. Here is how I would approach this.

In your node template file just do a {{ content.field_pr }}

Create a template file for your paragraph.

paragraph__[view_mode] (e.g. paragraph--default.html.twig)

paragraph__[type] (e.g. paragraph--image.html.twig)

paragraph__[type]__[view_mode] (e.g. paragraph--image--default.html.twig)

source: Theming in Paragraphs for Drupal 8

In paragraph--[type].html.twig you do {{ content.field_text }} and {{ content.field_color }}

Improve this answer
20
  • 1
    Apologies for my ignorance but how do I render paragraph.html.twig on my template file (page.html.twig)?
    – clestcruz
    Jun 8, 2018 at 7:24
  • 1
    @clestcruz why not in node.html.twig?
    – No Sssweat
    Jun 8, 2018 at 7:26
  • @NoSssweat node.html.twig? Sorry I was trying to figure out how I can just print the values from my paragraph to my templates file. So far I've managed to create a paragraph.html.twig. I'm still new to Drupal apologies
    – clestcruz
    Jun 8, 2018 at 7:30
  • @clestcruz, yes you'll need to create node--[content-type-name].html.twig. Ex: node--articles.html.twig and follow my answer.
    – No Sssweat
    Jun 8, 2018 at 7:32
  • 1
    @clestcruz i recommend using what NoSssweat said. Use node.html.twig and display the field using {{content.field_machine_name_paragraph}}. Then enable Twig debugging and you can create a new twig template from there.
    – usernameabc
    Nov 6, 2018 at 23:29
8

To print paragraph fields in a loop (for sliders, etc.) in page--content-type.html.twig use below snippet:

{% for item in node.field_paragraph_mac_name %}
  {{ item.entity.field_title.value }}
  <img src="{{ file_url(item.entity.field_image.entity.fileuri) }}" />
{% endfor %}
Improve this answer
2
  • To print alt tag, use alt="{{item.entity.field_image.alt}}".
    – Hashmat
    Nov 9, 2018 at 10:31
  • 1
    Why we can't use {{ item.entity.field_title }} directly? The problem is for field such as "body" that need specific rendering. Using {{ item.entity.field_body.value }} will requiere to use an usafe {{ item.entity.field_body.value|raw }}.
    – gagarine
    Jun 13, 2020 at 21:16
4

I figured this one out. With Twig Tweak enabled you can print paragraphs from the node object without using content:

{% for item in node.field_my_paragraph_field %}
     {{ drupal_entity('paragraph', item.target_id) }}
{% endfor %}
Improve this answer
1
  • 1
    Just use {{ content.field_my_paragraph }} instead, does exactly the same, is cache safe, is more performant, and does not require an extra module.
    – Hudri
    Nov 7, 2018 at 11:11
2

Building on the answer by user33560. If you have have nested paragraphs and you want to print or get the 2nd-level paragraph fields from within the 1st-level paragraph.html.twig:

{% set paragraph_name = content.field_paragraph_name %}

{% for item in paragraph_name['#items'] %}
    {{ drupal_entity('paragraph', item.target_id) }}
{% endfor %}

You can also use {{ content.field_paragraph_name }} to print all paragraph items, or print a subset such as {{ content.field_paragraph_name.field_example }}. Use {{ content.field_paragraph_name|without('field_example') }} to temporarily suppress the printing of a given child element.

Improve this answer
0

You can use {{ node.ref_field_name.entity.field_name.value }}

Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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