Create custom [insert image] to work with lightbox?

(Ralph De groot) #1

Hi is there a way to create a custom insert button much like the insert Image functionality so i can wrap the necesary markup around the tag to make ligthbox.js work?
a normal [insert image] reults in <img src='xxx.gif'> and i want <a href='xxx.gif'><img src='pthumb:xxx.gif' rel='lightbox'></a>

is it possible?

(Mark Hamstra) #2

Yes, edit the template for the image field you want to use with a lightbox to match the markup you need. That’s done in extras > contentblocks > fields tab > right click the field and edit > properties tab.

After that, edit and save a resource that uses it, or use the rebuild content button to update the resource content with your updated template.

(Ralph De groot) #3

Mmmm i was hoping i could do this in Redactor.

(Mark Hamstra) #4

Ow, sorry. I totally misread where you posted this, I legit thought you asked about how to do that in ContentBlocks :see_no_evil:

In Redactor, you can add a link to an image (enable redactor.imageLink), and a class (enable redactor.advAttrib), but there’s no way out-of-the-box to simply insert an image, have that run it through pthumb for a thumbnail, and wrap it with an arbitrary link with a rel attribute. That needs the type of content/markup-separation that ContentBlocks was built to do.

It might be possible to build a custom plugin to do your bidding, but I wouldn’t bet on it being quite as intuitive to use as CB would be.