How can I get the image URL in a field?

Question

The image formatter has only one option: Image. I would like to get the URL, not the full markup, for a field output.

Do I need to make a custom formatter? Also, I don't see any way to rewrite the text using tokens to get the image URL.

Answer 1

When setting up your view, under the advanced section you can create a relationship for the image field.

After you added the relationship, you can then add a File URI field, select the created relationship and you are good to go.

Answer 2

This is the magic, without the "Image URL Formatter" module:

1. You have to add a relationship in your view to your image field (It's under Advanced)
2. Now you can add a 'File URI' field to your fields
3. In your views-view-fields.html.twig template (Or one of the appropriate alternatives for your specific view) add this:

{{ file_url(fields.uri.content|striptags|trim) }}

Answer 3

Is the module "Image URL Formatter" maybe helpful for you? https://www.drupal.org/node/1162614/release?api_version%5B%5D=7234

There is a second one: https://www.drupal.org/project/image_raw_formatter

I never did a feature comparison to find out which is the better one ...

Answer 4

1. Install the module twig_tweak
2. Create a relationship in a View
3. Add File URI field, exclude it from display

4. Overwrite result, with the next twig code:

   {{ uri | image_style('thumbnail') }}

Where uri is the token of the File URI field and thumbnail is the desired image style.

Answer 5

Here is my solution that doesn't require a relationship:

• Add your image field to your view
• Set these properties:
  • Formatter: Image
  • Image style: None (original image)
  • Link image to: File

This gives you an output like this: <a href="http://domain/path/to/file.jpg" ...

• Under Rewrite results, check "Override the output of this field with custom text"
• In the text box put this: {% if field_image|trim is not empty%} {{ field_image|split('"')[1] }} {% endif %}

This splits the string on the " character and the index of 1 is your url in the href. It is kinda hacky but this actually gave me what I wanted. Going the relationship route I could only ever get a link with public:/path/to/file.jpg not the absolute URL