Using ExpressionEngine Grid (multiple images) with CE Image

StackOverflow https://stackoverflow.com/questions/21698673

  •  09-10-2022
  •  | 
  •  

Question

Ok I have a bit of an annoying problem. I am implementing a "more pictures" section at the bottom of a article view using expression engines grid system (version 2.7.3)here's my code

{story_images}
   <a class="blok-img" href="{story_images:image}" data-lightbox="{story_images:desc}">
   {exp:ce_img:single src="{story_image}" width="86" height="86" crop="yes" max="86" attributes='alt="{story_images:desc}" title="{story_images:desc}"'}
   </a>
{/story_images}

This is cropping all my images as expected and the light box is working as expected, however the images that are being cropped are always the same image.

So, the cropped images (for arguement sake are called ONE, TWO, THREE)

ONE - looks as expected cropped at 86px, loads main image on click

TWO - the cropped image is the same as image ONE but loads it's original image on click

THREE - the cropped image is the same as image ONE but loads it's original image on click

I can only assume that CE Image is over riding the original variable but to be honest I'm at a bit of a loss, any help would be appreciated.

Was it helpful?

Solution

You have a small error with your syntax for the grid field, it's just missing the prefixed variable in CE Image's tag, it should be:

{story_images}
     <a class="blok-img" href="{story_images:image}" data-lightbox="{story_images:desc}">
     {exp:ce_img:single src="{story_images:image}" width="86" height="86" crop="yes" max="86" attributes='alt="{story_images:desc}" title="{story_images:desc}"'}
     </a>
{/story_images}

User manual: http://ellislab.com/expressionengine/user-guide/modules/channel/grid.html

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top