Customize TinyMCE buttons

From KickApps Documentation

Jump to: navigation, search

Description

The KickApps platform comes preloaded with a default set of buttons in your rich-text editor but you can customize your own set of buttons with a few lines of JavaScript - either for all rich-text areas or per page.

The example #1 here changes the rich-text editor buttons for just the add-blog page to have other options such as font-selection. (Wrap it in script tags and place in your AC header.)

A full list of button options can be found here (first column only): http://wiki.moxiecode.com/index.php/TinyMCE:Control_reference

For the advanced users wanting to access plugins in the second and third column of the above link, you need to append the plugin name to the following variable:

Ka.Settings.tinyMCE.plugins

You can also specify up to three rows of buttons by editing the variables:

Ka.Settings.tinyMCE.theme_advanced_buttons2

and

Ka.Settings.tinyMCE.theme_advanced_buttons3

Code

Default values of all variables are:

Ka.Settings.tinyMCE.theme_advanced_buttons1 = "bold,italic,link,unlink,forecolor,backcolor,bullist,numlist,hr,blockquote,charmap,code,emotions,kickmedia";
Ka.Settings.tinyMCE.theme_advanced_buttons2 = '';
Ka.Settings.tinyMCE.theme_advanced_buttons3 = '';

Ka.Settings.tinyMCE.plugins = "kickmedia,emotions,media";

Other editable values:

Ka.Settings.tinyMCE.defaultHeight
Ka.Settings.tinyMCE.resizingMinHeight
Ka.Settings.tinyMCE.resizingMaxHeight

If you want to completely disable the rich text features of the text editor, simply paste this code into the <head> section of your Global Page Template:

<script type="text/javascript">
Ka.Settings.tinyMCE.theme_advanced_buttons1 = "";
</script>

Example

To add Paste As Plain-Text, Paste From Word, and Select All buttons, paste the following code into the header section of the GPT:

<script type="text/javascript">
Ka.Settings.tinyMCE.theme_advanced_buttons1 += ',pastetext,pasteword,selectall';
Ka.Settings.tinyMCE.plugins += ',paste';
</script>

You must be sure to include the plugin and the button.

**BE SURE TO INCLUDE ANY OF THESE SCRIPTS IN THE HEADER SECTION OF YOUR GLOBAL PAGE TEMPLATE**