Customize the Ckeditor taskbar (Java Version)

Asked

Viewed 834 times

1

I am using the lib Ckeditor integration with JSF (ck-jsf-editor-0.9.4.jar) and is working properly, but the Toolbar that is appearing is the default and I would like to set this up. Would anyone know how to do?

I even tried to change the file config.js, but when I made the changes, Taglib stopped working.

This is my code.

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:f="http://java.sun.com/jsf/core"      
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:ck="http://code.google.com/ck-jsf-editor">

    <h:head>
        <title>My Page</title>

    </h:head>
    <h:body>

        <h:form>

            <ck:editor value="#{helloBean.report.content}" height="300" width="1100" uiColor="#aed0ea"  />
            <h:commandButton value="Submit" action="#{helloBean.save}" />

        </h:form>
    </h:body>
</html>

And this is my config.js altered:

CKEDITOR.editorConfig = function( config )
{
    config.toolbar = 'MyToolbar';

    config.toolbar_MyToolbar =
    [
        { name: 'document', items : [ 'Source','-','NewPage','DocProps','Preview','Print' ] },
        { name: 'clipboard', items : [ 'Cut','Copy','Paste','PasteText','PasteFromWord','-','Undo','Redo' ] },
        { name: 'editing', items : [ 'Find','Replace','-','SelectAll','-','SpellChecker', 'Scayt' ] },
        { name: 'basicstyles', items : [ 'Bold','Italic','Underline','Strike','Subscript','Superscript','-','RemoveFormat' ] },
        { name: 'paragraph', items : [ 'NumberedList','BulletedList','-','Outdent','Indent','-','Blockquote','CreateDiv',
        '-','JustifyLeft','JustifyCenter','JustifyRight','JustifyBlock','-','BidiLtr','BidiRtl' ] },
        { name: 'links', items : [ 'Link','Unlink','Anchor' ] },
        { name: 'insert', items : [ 'Image','Flash','Table','HorizontalRule','Smiley','SpecialChar','PageBreak','Iframe' ] },
        { name: 'styles', items : [ 'Styles','Format','Font','FontSize' ] },
        { name: 'colors', items : [ 'TextColor','BGColor' ] },
        { name: 'tools', items : [ 'Maximize', 'ShowBlocks' ] }
    ];

    config.toolbar_Basic =
    [
        ['Bold', 'Italic', '-', 'NumberedList', 'BulletedList', '-', 'Link', 'Unlink','-','About']
    ];

};
  • 1

    Have you tried the Ckeditor from Primefaces Extensions? http://www.primefaces.org/showcase-ext/sections/ckEditor/customToolbar.jsf. Setup is simpler.

  • I never tried. Quarrel for the hint. I’ll do a search.

No answers

Browser other questions tagged

You are not signed in. Login or sign up in order to post.