Adding class to links created inside a WYSIWYG field

There's no automatic way to do that. The link popup is part of tinymce (the wysiwyg editor).

A few things you could try:

1) You could configure the wysiwyg to allow the user to select classes instead of font face & size and let them style the link after they create it.

2) You could add CSS code for anchor (a) tags to automatically style all of them

3) You could configure tinymce to use the 'advlink' plugin which includes a class pulldown and many other features) Here's a demo and some links on that:
http://tinymce.moxiecode.com/example_full.php
http://wiki.moxiecode.com/index.php/TinyMCE:Plugins/advlink
And you can edit the wysiwyg config options in /lib/wysiwyg.php

Hope that helps!

Hi Dave!

Thanks for your help on this!

3) You could configure tinymce to use the 'advlink' plugin

I am trying to do option 3, but I need some more help to get it right.

I am following these instructions you pointed me to at the Moxiecode Wiki:

Plugin: advlink
This is a more advanced link dialog mostly based on code contributed by Michael Keck. This link plugin supports popup windows and targets.

Installation Instructions
1. Copy the advlink directory to the plugins directory of TinyMCE (/jscripts/tiny_mce/plugins).
2. Add plugin to TinyMCE plugin option list example: plugins : "advlink".
3. Add this "a[name|href|target|title|onclick|rel]" to extended_valid_elements option.

Advlink plugin options
advlink_styles
This option should contain a semicolon separated list of class titles and class names separated by =. The titles are the ones that get presented to the user in the styles drop down list and and the class names is the classes that gets inserted.

But I am stuck at Installation Instructions #3, I don't know where to put the "extended_valid_elements" options. I am also a bit unsure how to enable the advlink plugin option "advlink_styles" to create a dropdown menu of styles.

I have attached my "wysiwyg_custom.php" file, search for "advlink" 3 times to see my changes.

-aev-

Looks good, does it work now?

You can skip that 3rd step. We don't do any extra filtering of tags and it isn't required.

We've set verify_html to false as recommended in the TinyMCE Performance tuning docs:
http://wiki.moxiecode.com/index.php/TinyMCE:Performance_tuning_TinyMCE

Hope that helps, let me know if you need anything else.

No, it doesn't work. The link button is still the same, and there is no new link button either.

Jake has all the login details if you care to take a look[:)]
[RRT #JSW-862797]

-aev-

Note that we don't provide support for tinyMCE modifications.

I had a look anyway and the problem was tinyMce was missing the advlink plugin dir here:
/cmsb/tinymce3/plugins/advlink

I uploaded that from the source tinymce zip and deleted the old cache file: data//tiny_mce_7fde4892b674370bd5c181d18583c11c.gz

And it seems to be working now. Give it a try and let me know. You may need to clear your browser cache.

Hope that helps!