Created a custom views block to use unformatted view showing fields set under 'Format'.
Also, created an override template as views-view-fields--bookstheme--block.html.twig and then created the HTML structure within this custom template and then I am simply printing the field like for example Eg:- {{ fields.booktitle.content}}

Below is attempt within to get the image field URL.

Solution Attempt #1 worked for me and Solution Attempt #2 didnt. Request help on what I missed out.

Solution Attempt #1: [ Works ]

{# Below image field from view o/p #}  
{{ fields.field_books_theme_pic.content }}  
{# Creating a Field URI post setting up relationship to image field fields.uri.content gives uri format eg:- public://image.jpg #}  
{{ fields.uri.content|striptags|trim }}  
{# and this gives the image uri for src ref #}  
{{ file_url(fields.uri.content|striptags|trim) }} 

Solution Attempt #2 [ Something missing, no output ]

{% set url = fields.field_books_theme_pic.content|render|striptags %}  
{{ url }}  

2 Answers 2

{% set url = file_url(content.field_books_theme_pic['#items'].entity.uri.value) %}

"file_url" needs a URI to convert.

Another options is to go to that fields display settings and change the display option from image to "URL to image". Then you can just render the field value:

{{ content.field_books_theme_pic }}

If you are working in twig template files, the only thing that changes is context. content.something, fields.something, paragraph.something...

If this is a field of type image, what you are looking for is the array key "URI".

I always use {{ dump(whatever | keys) }}. For your case try pasting this into your twig file:

{{ dump(fields.field_books_theme_pic | keys) }}

and see if you can trace down to the uri key (you must have devel enabled and the usual config in local files). If you cant find the uri key in your current setup via the twig template file, then you know you probably need to do some preprocessing to make it available to your template.

Personally, if I feel I need granular markup I would go after the field template itself: "field--field-name.html.twig" for example, and control my markup there. That way, whether I use that field in a view, or a content type, or anywhere, it will always render the same. Plus all I have to do then is print that field in other template files to get the same results.

  • For View format as 'Content', above helps. Request what it would be if view show format is 'Fields'.
    – H Bala
    Mar 21, 2018 at 20:23
  • I might not fully interpret your initial question... if you set a view to display fields instead on rendered content, the view will not use any template file rendering. Can you clarify? I might be able to update my answer Mar 21, 2018 at 20:35
  • I have tried to update my initial post to be more descriptive of my initial query.
    – H Bala
    Mar 22, 2018 at 1:51
  • I added to my answer. If that doesn't hit the mark, let me know. I am happy to try to help, or at least maybe someone else will be able to add Mar 22, 2018 at 3:39
  • Thanks! Your answer not only helped the query but also few of my other doubts!
    – H Bala
    Mar 22, 2018 at 3:45

In the view you created, select URL to image as image formatter.


Then, in the view template file, you will be able to access the image URL with code similar to the following one.

<img class="img-fluid" src="{{ fields.field_cover_photo.content }}" alt="test">

field_cover_photo is the field machine name, in my case.

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.