Render one Paragraphs Module field value inside another Paragraph field's .html.twig template

Question

This question is for the Paragraphs module for Drupal 8.

I've created a Paragraph Type with 4 fields: Title, URL, Image, and Description.

I want to take the value from the URL field, and use it with the Title and Image fields, so that my title and image have a link wrapped around it with the href getting the value from the URL field.

My idea was to use Twig template suggestions for the Title and Image fields, but I can't figure out how to render the value of the URL field in those .html.twig files....

For example, I have a twig suggestion template for the title, called:

field--paragraph--field-list-item-title.html.twig

My idea was to render the value of the URL paragraph field with this:

{{ paragraph.field_list_item_link_url }}

so that the code inside my field--paragraph--field-list-item-title.html.twig file looks like this:

  {% else %}
{% for item in items %}
  <div{{ attributes }}><h3><a href="{{ paragraph.field_list_item_link_url }}">{{ item.content }}</a></h3></div>
{% endfor %}{% endif %}

But its not rendering anything.

Is there a way to accomplish this? Is there another way instead?

Answer 1

You could try a template for the paragraph itself, rather than the individual fields. If you look in the modules/paragraphs/templates you'll see the default template used to render paragraphs. Copy this into your theme and rename it to paragraph--XXXXXX--default.html.twig replacing XXXXXX with the machine name of the paragraph.

You can then access the values of your fields using {{ content.XXXX }} where XXXX is the machine name of the field, e.g. {{ content.field_list_item_link_url }}