I'm trying to integrate Lightbox2 by following this post :- http://drupal.org/node/252153

The problem is it is written for TinyMCE so I fall down when I get to this step:

On CSS settings, CSS classes: add the newly created class Lightbox2, using the = format. (i.e, trigger=triggerclass)

How do I add CSS classes with Tint TinyMCE? I can get this to work using TinyMCE but I gave up on this module as I can't get the style settings to stick for inserted images and the Tiny TinyMCE module just worked out of the box :)

Despite all my searches I just can't figure out how to do this.

Any help appreciated as I can follow instructions but can't read/write code. :(

Regards,

Brent

Comments

Steve Lockwood’s picture

Steve Lockwood commented
Status: Active » Fixed

Hi snug - sorry for the delay in responding.

The answer will lie in tweaking the tinymce init script (admin/settings/tinytinymce), which contains settings for all the permitted html and css attributes. This is documented at http://wiki.moxiecode.com/index.php/TinyMCE:Index.

The most likely place in the init script is the extended_valid_elements line - by default this allows the class attribute to be attached to an image.

The only way I could see to assign a class to the image in the editor is by manually editing it (come out of rich text mode and edit the raw html). However, if you then edit the image using the tinymce image control it will strip the class out.

To get round this you need another line in the init script:

theme_advanced_styles : "Header 1=header1;Header 2=header2;Header 3=header3;Table Row=tableRow1"

If you adapt the above line to the classes you want for Lightbox, they will appear in a drop down when you invoke the image control - this will be on the "appearance" tab.

I hope this helps.

Anonymous’s picture

Anonymous (not verified) commented
Status: Fixed » Closed (fixed)

Automatically closed -- issue fixed for two weeks with no activity.