By boomboom3000 on

Here's my general issue:

I am trying to figure out a way to make images link to a external url in a Drupal 7 deployment. It seems like it would be easy and straight forward and I could add a link destination like I would add a title= or alt=, but alas there is no setting for specifying a link destination for an image that I can see.

My specific case is as follows:

I have a content type that is set-up to include an image field that I'd like to act as a link to a LinkedIn profile page. I have the node set up to be displayed with a node template using Page Manager and Panels to override to create a display for nodes of a certain type. I've set up the template to display all the fields exactly how I want them, but I can't figure out any way to make the dang image link to an external url.

This seems to me like something that would likely be a very common usage case for an image to link to an external url, but I have to admit after hours of reading through possible modules and forum posts, I haven't solved it. I'm relatively new to Drupal, though, so it's possible the answer has been staring me in the face and I just haven't realized it. Any help unraveling this mystery would be super appreciated!

⋅ Categories: Drupal 7.x

Comments

drupaledmonk’s picture

drupaledmonk commented

Have tried this out? http://drupal.org/project/link http://drupal.org/project/link_image

jeni_dc’s picture

jeni_dc commented

I'd just create a view to display that image on my node type. Add another field to store the link in your node, then create a view with two fields, your link and your image. Arrange the fields in your view so the link is first, then the image.

Exclude the link field from display. When setting up your image field in the view you'll need to rewrite the results. Select "output this field as a link", and in the link path enter the token for your link field, that will be in the replacement patterns below.

Then to make sure your view is only showing the image and link associated with the particular node you are viewing, you'll need to add a contextual filter. Just add a filter for "Content: Nid" and select "Hide view" for when the filter is not available.

Then in your panel for your node display, remove the field that was displaying your image and add the view in it's place.

Jeni

criscom’s picture

criscom
Location Graz, Austria
commented

Hi Jeni,
Thanks for this great tutorial. Really easy and works like a charm.
Chris

TWD’s picture

TWD commented

I agree.

Excellent tutorial and much better than adding (yet another) module.

Thanks.

pspardeep’s picture

pspardeep commented

In my case everything is ok but which i link image to url token(eg field_extlink), it connects it with the title not url.
e.g my external url is "www.abc.com" and tilte of that link is "social site"..
so when i rewrite my results, instead of linking image to "www.abc.com", its links with "mysite/social site".. i am using Link module for customize my content type..

Thanks

njogz’s picture

njogz commented

In your view click on the link field to edit it. Change the Formatter to "URL, as link". That solved it for me.

pspardeep’s picture

pspardeep commented

Thanks, that solved my problem.

rcaldeiradev’s picture

rcaldeiradev commented

Thanks for your help, Jeni!
It's easy and simple.

Bruno Vincent’s picture

Bruno Vincent commented

I need this to work on content , not views, is there a way to use that technique with Drupal core?

ojchris’s picture

ojchris commented

Thanks for this direction. Note: the "rewrite results" section @jeni_dc is referring to is in the specific field set up (in this case the image field), just below the "No result behaviour" section. There you will find the "Output this field as a link" checkbox which will present you with a link path. Not realizing where this section is located made this a bit difficult to understand.

Regards,
Ojchris