0

I have a field field_sidebar_gallery which outputs multiple images. These images are rendered using image style gallery_thumb and the display format on them is using the lightbox2 module which wraps the rendered image in an <a> tag.

What I need to do is add a class to the <a> tag which wraps around the image. I could easily do this in the template file for field--field-sidebar_gallery.tpl.php and just look at the uri for the image and build the link and image html myself using the relevant functions (theme(), l() etc). However, taking this approach I then lose all of the configuration abilities of lightbox2 (and I suppose any other modules which may end up manipulating the links in the future)

The output currently is as follows

<a title="" rel="lightbox[field_sidebar_gallery][]" href="http://localhost/sites/default/files/styles/large/public/Koala.jpg" class="lightbox-processed">
    <img width="95" height="95" alt="" src="http://localhost/sites/default/files/styles/gallery_thumb/public/Koala.jpg">
</a>

I've looked at

With little to no success. I suspect the display formatter kicks in and that's what I should be looking at but I don't really know where to start.

All I need to do is for this particular field (field_sidebar_gallery), is to add a class to the <a> so that the final output is as follows (note the class="thumbnail[...] compared to the above)

<a title="" rel="lightbox[field_sidebar_gallery][]" href="http://localhost/sites/default/files/styles/large/public/Koala.jpg" class="thumbnail lightbox-processed">
    <img width="95" height="95" alt="" src="http://localhost/sites/default/files/styles/gallery_thumb/public/Koala.jpg">
</a>

If anyone can point me in the right direction, that'd be much appreciated.

  • If its lightbox module, i believe you can add custom class via config page. Administer >> Site Configuration >> Lightbox2 – niksmac Dec 5 '12 at 1:34
  • There doesn't appear to be an option to add classes unfortunately. – Ben Swinburne Dec 5 '12 at 10:09
  • Hmm. Why dont you try jQuery ? – niksmac Dec 5 '12 at 10:35
1

From the way lightbox does it (line 145), i would think there is not much you can do to alter the link, since it is "hardwired" there.
What you could do (and is surprisingly easy :) is to implement your own handler that would extend the lightbox one and allow you to specify the css class (or submit a patch that would do it in their code).

You might as well specify the class on the parent div (in views "Styles settings" for the field, "Customize field HTML" and "Create a CSS class". And then just sligthly change your selector.

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.