I have a content type with a paragraph field. That paragraph field has two paragraph fields which I will refer to as subparagraphs.

I want to print one of the two subparagraphs depending on the flag set in the preprocess function.

Paragraph: field_banner_header

Subparagraphs: field_banner_header_single, field_banner_header_multi


<div class="callout-options">
    {% if callout_options == 'Single' %}
        {{ content.field_banner_header[0]['#node'].field_banner_header_single.value }}
    {% else %}
        {{ content.field_banner_header[0]['#node'].field_banner_header_multi.value }}
    {% endif %}

I have a preprocess hook that stores the value ('Single' or 'Multi') of a bool in callout_options:

function cse_preprocess_node(&$variables) {
  $node = $variables['elements']['#node'];

  if ($node->getType() == 'unit_landing_page') {
    $variables['callout_options'] = $node->get('field_active_callout_tab')->value;

On page render, I get the following error:

drupal.js?v=8.4.6:13 Uncaught Quick Edit could not associate the rendered entity field markup (with [data-quickedit-field-id="paragraph/426/field_banner/en/default"]) with the corresponding rendered entity markup: no parent DOM node found with [data-quickedit-entity-id="paragraph/426"]. This is typically caused by the theme's template for this entity type forgetting to print the attributes.

I could be wrong, but this seems to be telling me that I am referencing the subparagraph incorrectly.

What is the correct syntax for printing a subparagraph?


3 Answers 3


Seems your preprocess function is the key. To get the value of a field, do the following:

$callout_tab = $node->get('field_active_callout_tab')->first()->getValue();
$variables['callout_options'] = $callout_tab['value'];

Really, please install the Devel submodule Kint and then check first what you get:


Which will most likely get you NULL or an array. So {% if callout_options == 'Single' %} can never work.

And regarding the subparagraph, all I could get was the entity ID:

{{ kint(content.field_paragraphs.0['#paragraph'].get('field_subparagraph').value) }}

but maybe I'm doing something wrong (and you already solved that yourself). But if the entity ID really is the maximum you can get you are better off loading the subparagraph in the preprocess function as well and pass the render array over to Twig like you did pass the bool. In theory this should work :)

  • 1
    I confirmed the flag is working, so printing the subparagraph fields is still my problem. Had a chance to look at the kint output. I ran {{ kint(content.field_banner_header_single.0) }} to check the existence of that subparagraph and it tells me that there is an array (6) present. Inside the callout-options div I execute the conditional flag statement that I have now changed to print out {{ content.field_banner_header_single.0 }} Kint tells me a value exists for that field, but the subparagraph does not print. When I inspect the console, the callout-options div is a gap of white space == $0.
    – lane
    Commented May 16, 2018 at 16:06

Figured it out. The trouble was the Boolean values were being treated as markup so I added ['#markup'] to the conditional like so:

{% if content.field_active_callout_tab.0['#markup'] == 'Single' %}
    {{ content.field_banner_header_single.0 }}
{% else %}
    {{ content.field_banner_header_multi.0 }}
{% endif %}

I discovered this by passing the boolean field (field_active_callout_tab) to the kint module and inspecting its attributes.

  • 1
    Ah nice thing! So I was half wrong and half right ^^ Did you know about {{ kint() }} before? It really is my most loved dev tool so far :)
    – leymannx
    Commented May 16, 2018 at 20:47
  • Yes, I did know about Kint but had never used it. Your explanation provided the perfect opportunity :) thank you for your help!
    – lane
    Commented May 16, 2018 at 21:26
  • Try also content.field_active_callout_tab.value orby using twig_field_value module by adding |field_value as filter => content.field_active_callout_tab|field_value Commented May 27, 2018 at 16:28
  • For debug, a better way by using xdebug+phpstorm Commented May 27, 2018 at 16:30

With the help of Twig Tweak Module, you can print subparagraphs content in the right context :

 {{ drupal_field('field_paragraph', 'paragraph', paragraph_id) }}

Here is the example documentation.

Your Answer

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

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