views:

1580

answers:

4

I have a site that uses the FCKEditor. I'd like to make an incredibly simple plugin: when a user selects text and then hits MyPluginIcon, the editor surrounds the text in a span tag with a specific class.

So it's just like the Bold or Italic button, but for:

<span class="blah">EtcEtc</span>

I am far from a JS expert, so I have been looking for a plugin to copy. I have looked in the FCK wiki but all the plugins I have found are really complex (file browsers and whatnot). Do you know of a super simple FCK plugin I can base my plugin off of?

Thanks!

+2  A: 

Answering my own question! Hopefully if someone finds this in the future it will help.

I used the basic file from here: http://www.iondev.lu/fckeditor/netnoi.txt

I found-and-replaced the "netnoi" with my own name, and uncommented the icon line to make an icon (16x16).

And the instructions on how to install it from here: http://docs.fckeditor.net/FCKeditor_2.x/Developers_Guide/Customization/Plug-ins

Be sure to check that the plugins directory is correct -- in drupal the plugins folder is different than a default FCK install.

EDIT: Apparently the netnoi.txt has gone missing. Here is what I used:

/***
 * Create blank command
 */
var FCKPixelCaps_command = function()
{

}

/***
 * Add Execute prototype
 */
FCKPixelCaps_command.prototype.Execute = function()
{
     // get whatever is selected in the FCKeditor window
     var selection = FCK.EditorDocument.getSelection();

     // if there is a selection, add tags around it
        if(selection.length > 0)
        {
                FCK.InsertHtml('<span class="caps">' + selection + '</span>');
        } else {
       // for debugging reasons, I added this alert so I see if nothing is selected
                alert('nothing selected');
        }
}

/***
 * Add GetState prototype
 * - This is one of the lines I can't explain
 */
FCKPixelCaps_command.prototype.GetState = function()
{
        return;
}

// register the command so it can be use by a button later
FCKCommands.RegisterCommand( 'PixelCaps_command' , new FCKPixelCaps_command() ) ;

/***
 * Create the  toolbar button.
 */

// create a button with the label "Netnoi" that calls the netnoi_command
var oPixelCaps = new FCKToolbarButton( 'PixelCaps_command', 'Pixels & Pulp Caps' ) ;
oPixelCaps.IconPath = FCKConfig.PluginsPath + 'PixelCaps/caps.gif' ;

// register the item so it can added to a toolbar
FCKToolbarItems.RegisterItem( 'PixelCaps', oPixelCaps ) ;
Eileen
Glad you solved it on your own!
Ascalonian
A: 

Many thanks for putting the contents of the deleted file here.

cerberos
A: 

Hi Eileen,

Firstly thank you for sharing the code.

I was just wondering did you go through and change PixelCaps, oPixelCaps, PixelCaps_command?

What does your code look like?

Cheers,

Chris

That is my code, actually. Original had "netnoi" in all those places. Yes, you basically take all the places where PixelCaps is mentioned and swap them out for your own name/code.
Eileen
Thank you Eileen, I will see how I go. It seems to be alot more difficult than I originally thought.
Did you create a custom config file? or did you just add to the original?
A: 

This is FckEditor. How to make this work in CkEditor?

slimetoner