The Holy Java

Building the right thing, building it right, fast

CKEditor: Hide some toolbar buttons on a per page basis

Posted by Jakub Holý on April 4, 2011

In my project we had CKEditor with a common toolbar used on many pages and we needed to be able to hide some of the buttons on some pages (e.g. email editor didn’t support some functionality/content). It took me a long time to figure a way to do it for CKEditor has no methods for simply removing/hiding buttons from a toolbar. My solution uses the fact that the configuration file can see variables defined in the including page and that it can contain functions – namely there is a function which takes the default toolbar definition and removes from it all the buttons mentioned in a variable, which is expected to be defined in the page.

The page:

<script type="text/javascript">
   // This must be defined before including ckeditor.js:
   var removeButtons = "Link,Preview";
<script type="text/javascript" src="/mywebapproot/myckeditor/editor/ckeditor.js"></script>

My custom CKEditor configuration .js:

function removeUnwantedTools( toolbar )
    if (typeof(removeButtons) == "undefined") { return toolbar; }

    var filteredTools = new Array();
    for(var i = 0, len = toolbar.length; i < len; i++)
        var element = toolbar[i];
        if (element instanceof Array)
                removeUnwantedTools(element)); //perhaps don't add if empty
        else if (removeButtons.indexOf(element) == -1)
        // else just ignore the element present on the removeButtons list
    return filteredTools;

CKEDITOR.editorConfig = function( config ) {
    config.toolbar_Default = removeUnwantedTools([
        ['Preview', 'Source','Link'],['MyPlugin', 'AnotherCustomPlugin']

The result will be that this plugin will only have the buttons [[‘Source’],[‘MyPlugin’, ‘AnotherCustomPlugin’]].

It is not completely fool-proof but worked well for me.

One Response to “CKEditor: Hide some toolbar buttons on a per page basis”

  1. wizardist said

    Thank you for this piece very much!🙂

Sorry, the comment form is closed at this time.

%d bloggers like this: