From KickApps API Reference
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 variable Ka.Settings.tinyMCE.plugins.
You can also specify up to three rows of buttons by editing the variables
Ka.Settings.tinyMCE.theme<i>advanced</i>buttons2
and
Ka.Settings.tinyMCE.theme<i>advanced</i>buttons3
.
Default values of all variables are:
Ka.Settings.tinyMCE.theme<i>advanced</i>buttons1 = "bold,italic,link,unlink,forecolor,backcolor,bullist,numlist,hr,blockquote,charmap,code,emotions,kickmedia";
Ka.Settings.tinyMCE.theme<i>advanced</i>buttons2 = '';
Ka.Settings.tinyMCE.theme<i>advanced</i>buttons3 = '';
Ka.Settings.tinyMCE.plugins = "kickmedia,emotions,media";
Other editable values:
Ka.Settings.tinyMCE.defaultHeight
Ka.Settings.tinyMCE.resizingMinHeight
Ka.Settings.tinyMCE.resizingMaxHeight
Note: For security reasons, most but not all plugins from the full plugin list will work on the KickApps platform.
<link rel="stylesheet" href="
http://snipplr.com/css/embed.css" type="text/css">
KickApps: Cutomize TinyMCE buttons and more!
<ol><li class="li1"><div class="de1"><span class="co1">// #1 Page sepcific</span></div></li><li class="li1"><div class="de1"><span class="kw1">if</span> <span class="br0">(</span>Ka.<span class="me1">Info</span>.<span class="me1">PAGE</span> <span class="sy0">==</span> <span class="st0">"pages/addBlog.jsp"</span><span class="br0">)</span><span class="br0">{</span></div></li><li class="li1"><div class="de1"> Ka.<span class="me1">Settings</span>.<span class="me1">tinyMCE</span>.<span class="me1">theme_advanced_buttons1</span> <span class="sy0">=</span> <span class="st0">'fontselect,fontsizeselect,backcolorpicker,forecolorpicker,emotions'</span>;</div></li><li class="li1"><div class="de1"><span class="br0">}</span></div></li><li class="li1"><div class="de1"> </div></li><li class="li1"><div class="de1"><span class="co1">// #2 If you want to just replace one item from your current list of buttons:</span></div></li><li class="li1"><div class="de1">Ka.<span class="me1">Settings</span>.<span class="me1">tinyMCE</span>.<span class="me1">theme_advanced_buttons1</span> <span class="sy0">=</span> Ka.<span class="me1">Settings</span>.<span class="me1">tinyMCE</span>.<span class="me1">theme_advanced_buttons1</span>.<span class="me1">replace</span><span class="br0">(</span><span class="st0">'bullet'</span><span class="sy0">,</span> <span class="st0">'fontsizeselect'</span><span class="br0">)</span>;</div></li><li class="li1"><div class="de1"> </div></li><li class="li1"><div class="de1"><span class="co1">// #3 If you want to just want to add an extra button to the end of the list:</span></div></li><li class="li1"><div class="de1">Ka.<span class="me1">Settings</span>.<span class="me1">tinyMCE</span>.<span class="me1">theme_advanced_buttons1</span> <span class="sy0">=</span> Ka.<span class="me1">Settings</span>.<span class="me1">tinyMCE</span>.<span class="me1">theme_advanced_buttons1</span> <span class="sy0">+</span> <span class="st0">',fontsizeselect'</span>;</div></li></ol></pre><p>View this snippet <a href="http://snipplr.com/view/14812/kickapps-cutomize-tinymce-buttons-and-more/">on Snipplr</a></p></div><script type="text/javascript" src="http://snipplr.com/js/embed.js"></script><script type="text/javascript" src="http://snipplr.com/json/14812"></script>
[[category:Page Customization]]