3

I'm using Views to generate some HTML, and this includes a field from a Views field.

My problem is, the layout needs the images to be reponsive (height and width based on the parent element), but this is being broken by Views writing in the width and height as HTML attributes which override all the CSS.


I've tried the answer to this question which uses hook_field_attach_view_alter() to remove the width and height from the output array - but it doesn't work, the width and height are still written into the HTML.

Checking the width and height values at the time hook_field_attach_view_alter() is called, it seems it's a timing problem: it looks like this is called before the image preset is applied. E.g. my image preset is 190px x 190px scale and crop: at the time hook_field_attach_view_alter() is called, the width and height are the original width and height of the image, then the 190 gets written over whatever changes the hook makes.

Is there another hook I can use for the same effect?


I also tried using Rewrite results in Views to re-create the image from its component parts. The problem is, it has access to everything except the actual image URL or URI:

enter image description here

Is there a way to access the image URL or URI in the replacement patterns for Views rewrite for an image field?

  • Have you tried using a Views template? – beth Aug 25 '14 at 23:23
  • I thought they were for whole views, not for specific field types? – user568458 Aug 25 '14 at 23:35
  • There are different levels of specificity of views templates. Click the "Theme: Information" link under the advanced settings of your view for more info. There are field-level templates for views. – beth Aug 26 '14 at 18:35
3

It feels clumsier than I'd hoped and requires a module, but I found a solution:

  1. Install image_url_formatter module, which creates an image field display that is just the url but still allows you to choose from available image styles
  2. Change the image field in the view to use the new "Image URL" display.
  3. Use the Views rewrite feature to rebuild the image (<img src="[field_image]" alt=... />).

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.