By Allan

2015-10-14 22:01:23 8 Comments

I am trying to create a custom slideshow using Views. Please not that I am not using the Views Slideshow Module

What I need to accomplish is to wrap the the relative URL for the images within a container. So, my field template should generate


The problem that I am having is gaining access to the URI so that I can write the raw value into some div tags. So, since that is the area that I am having difficulty with, I am focusing on only writing the URL not all the div containers; that will come later.

As for the image, I have a simple content type that has only two fields: title and the image itself. I have created the view that lists the images I am looking for. Now to customize the field template within the view. Here is my code:

    $node = node_load($row->nid);
    $field_name = "field_image";
    $delta = 0;

    $field = field_get_items('node', $node, $field_name);
    $output = field_view_value('node', $node, $field_name, $field[$delta]);

    print ($output['#item']['uri']);

/* Everything below is for Debugging Purposes */  
    print "<br><br>";
    print "Field:  ";
    print "<br><br>";
    print "Output:  ";
    print "<br><br>";

If you look at the output below, I get a URI that says:


This is correct. I will be running it through file_create_Url() later as soon as I figure out how to make it a relative link and not absolute.

However, I get the error message:

Notice: Undefined index: #item in include() (line 11 of 

Line 11 in my file references

print ($output['#item']['uri']);

This I don't understand. If I wasn't referencing it correctly, I wouldn't get the URI value I am looking for. So...this confuses me greatly. I am trying to following the example that I found here: Rendering Drupal 7 Fields The Right Way because from what I can tell, this will also work in D8 (I could be wrong). That, and I want to legimately learn how to do this the right way.

Any advice here would be greatly appreciated.



Field: Array ( [0] => Array ( [fid] => 5 [uid] => 1 [filename] => sandy_beach_banner.jpg [uri] => public://sandy_beach_banner.jpg [filemime] => image/jpeg [filesize] => 30663 [status] => 1 [timestamp] => 1444690263 [alt] => Sandy Beach [title] => Sandy Beach [width] => 800 [height] => 200 ) ) 

Output: Array ( [#theme] => image_formatter [#item] => Array ( [fid] => 5 [uid] => 1 [filename] => sandy_beach_banner.jpg [uri] => public://sandy_beach_banner.jpg [filemime] => image/jpeg [filesize] => 30663 [status] => 1 [timestamp] => 1444690263 [alt] => Sandy Beach [title] => Sandy Beach [width] => 800 [height] => 200 ) [#image_style] => [#path] => [#access] => 1 ) 


Field: Array ( [0] => Array ( [fid] => 4 [uid] => 1 [filename] => nyc_banner.jpg [uri] => public://nyc_banner.jpg [filemime] => image/jpeg [filesize] => 480360 [status] => 1 [timestamp] => 1444690227 [alt] => NYC Banner [title] => NYC Banner [width] => 1200 [height] => 492 ) ) 

Output: Array ( [#theme] => image_formatter [#item] => Array ( [fid] => 4 [uid] => 1 [filename] => nyc_banner.jpg [uri] => public://nyc_banner.jpg [filemime] => image/jpeg [filesize] => 480360 [status] => 1 [timestamp] => 1444690227 [alt] => NYC Banner [title] => NYC Banner [width] => 1200 [height] => 492 ) [#image_style] => [#path] => [#access] => 1 ) 


Field: Array ( [0] => Array ( [fid] => 3 [uid] => 1 [filename] => hindu_banner.jpg [uri] => public://hindu_banner.jpg [filemime] => image/jpeg [filesize] => 508630 [status] => 1 [timestamp] => 1444690189 [alt] => Hindu Banner [title] => Hindu Banner [width] => 2000 [height] => 560 ) ) 

Output: Array ( [#theme] => image_formatter [#item] => Array ( [fid] => 3 [uid] => 1 [filename] => hindu_banner.jpg [uri] => public://hindu_banner.jpg [filemime] => image/jpeg [filesize] => 508630 [status] => 1 [timestamp] => 1444690189 [alt] => Hindu Banner [title] => Hindu Banner [width] => 2000 [height] => 560 ) [#image_style] => [#path] => [#access] => 1 ) 


@Allan 2015-10-15 15:15:20

Getting the URL from an Image (or Any File)

Let’s say, for whatever reason, you want to get the URL of a file, probably an image, and insert it into the markup of your document. Maybe, you want to use it in a slideshow and you need to rewrite the output so you can embed it within some div tags and assign it some classes for CSS.

You can do with Views without modifying a template file or writing a single line of code . And because this module is built into Drupal 8 (unlike D7), you will be able to do this out of the box.

Giving credit where credit is due, it was Jay from, the creator of the Drupal Relativity Data Model who showed me this simple solution. After reading this HOWTO, I encourage you to visit his site.


I wrote this tutorial because I spent days researching this and wanted to save the sanity of anyone in a similar situation. There are tons of posts throughout Stackexchange and on the Drupal API that show you how to accomplish this. I re-wrote my template file per these instructions and while it worked (my original question), it generated an error to which I never got an answer. There is another post that says to use the URL Formatter module.

Using a module is something I want to avoid as I am not a subscriber to the “there’s a module for that” methodology. Also note, that URL Formatter module is not D8 compatible and must be rewritten. This solution doesn't need to be.

How To

We are proceeding under the assumption that you have the Views module installed and that you have created a view to show your desired content. There are lots of tutorials on doing just this so I won’t cover it here.

Your fields can be any format, unformatted list, HTML list, grid, or whatever. For this example, I am going to use an unformatted list. If you are creating a View from scratch, you probably have the Title field already configured as a default. It should look similar to the picture below.

The very first and most important thing that you need to do is create a Relationship to the File Entity. In the Views Display and under the Advanced tab you should see Relationships. Let’s add one.


Select "File Usage: File"

enter image description here

You don’t need to require this relationship, so go ahead and leave this check block blank. The Identifier of “File” is fine, but you can change this to something else if it makes referencing it for you easier.

enter image description here

Let’s add another Field. I use the “File” filter in the selection dialog box to bring up all of my choices that are now available. Pick path.

enter image description here

The very next screen is where all the magic happens. Typically, you will get a URI that looks like


If you want, don’t select anything here and try it out and see what you get in your Views Preview pane. But, if you check the box next to “Display download path instead of file storage URI” you will get

enter image description here

You can now rewrite the output of the field and the link and style it as you like. There are lots of posts and tutorials on how to do that, so I won’t go into it here. Here’s what your Views Display should look like when you are done:

enter image description here

@user4026 2017-05-05 11:24:58

I tried this solution. But for me while adding the relationship field am getting Broken/missing handler error. Anybody please help me to solve this. Am using Drual 8.

@Jeff 2018-05-03 18:09:23

Would this work the same with a Media field or would there be any tweaks? I am trying this and I am getting Prajila's "Broken/missing handler" error.

@VVS 2019-01-22 11:40:36

This is not working with d8: have a "Broken/missing handler" error

@Óscar Gómez Alcañiz 2019-02-12 13:43:46

In D7 it works OK, but in case the nodes have versioning enabled, every file in the revisions will create a row on the view, resulting in duplicate nodes (and wrong, outdated files). Any idea on how to go around this? Thanks!

Related Questions

Sponsored Content

1 Answered Questions

Duplicate entry/Contraint violation 1062 in file_managed on browser crash

  • 2014-10-20 10:42:07
  • AgA
  • 1073 View
  • 0 Score
  • 1 Answer
  • Tags:   7 media

2 Answered Questions

Mapping existing file against a new content type

  • 2013-05-01 05:05:02
  • simple user
  • 362 View
  • 1 Score
  • 2 Answer
  • Tags:   7 files nodes

1 Answered Questions

[SOLVED] Getting a custom block image field URL in the block Twig template

  • 2016-01-22 16:03:53
  • cheesetriple
  • 4058 View
  • 3 Score
  • 1 Answer
  • Tags:   theming 8 media

1 Answered Questions

[SOLVED] How to change a file field value with entity_metadata_wrapper

  • 2016-07-19 13:22:14
  • No one
  • 676 View
  • 0 Score
  • 1 Answer
  • Tags:   7 nodes

2 Answered Questions

[SOLVED] How do I programmatically add an image while programmatically creating nodes?

  • 2012-09-19 11:11:20
  • 夏期劇場
  • 3709 View
  • 8 Score
  • 2 Answer
  • Tags:   nodes entities media

1 Answered Questions

[SOLVED] How to remove width and height from image field images in Views?

  • 2014-08-25 23:15:33
  • user568458
  • 1267 View
  • 3 Score
  • 1 Answer
  • Tags:   views entities

1 Answered Questions

1 Answered Questions

[SOLVED] Undefined property in a Views PHP field

  • 2011-08-15 08:41:02
  • Michał Pękała
  • 5445 View
  • 2 Score
  • 1 Answer
  • Tags:   7 views

2 Answered Questions

[SOLVED] How can I print a field from a referenced entity in my theme?

  • 2013-04-21 05:55:03
  • Peter Clemence
  • 3083 View
  • 4 Score
  • 2 Answer
  • Tags:   theming entities

0 Answered Questions

Html gets converted to plain text

  • 2013-01-23 01:07:03
  • anthony
  • 695 View
  • 0 Score
  • 0 Answer
  • Tags:   theming

Sponsored Content