321
Views
4
Comments
Configuring CKEditor
Question

I've installed the CKEditor and I have no idea how to configure it's toolbar. When I start looking at the documentation, it tells me to look at a config file in the location where CKEditor was installed.  The thing is, is that I installed it through OutSystems Forge and I don't specify where it gets installed.  OutSystems does all that and I have no idea where the config file is.

Please help me know how to configure the toolbar.

Thanks, Paul

Rank: #50

Hi Paul,


You will get the most accurate and best help if you post your question on the CKEditor component itself. that way the author of the forum will be able to help you. I have used it a few times, and I know its a JSON confi for the property of the component, but not sure of the specifics.

mvp_badge
MVP
Rank: #15

Hi Paul,

Check this post.

Regards,

Marcelo

Rank: #896

I have tried to configure the CKEditor as below but not works.

Please advise how to configure the autoParagraph and enterMode


"height:'140px', 

toolbar:[

    ['Font','FontSize'],

    ['Bold','Italic','Underline'],

    ['NumberedList','BulletedList','-','Outdent','Indent'],

    ['Scayt'],

    ['TextColor','BGColor'],

    ['Image'],

    ['Source']

],

enterMode : CKEDITOR.ENTER_BR,

shiftEnterMode: CKEDITOR.ENTER_P,

autoParagraph: 'false'"

Champion
Rank: #154

Hi Jessica,

Have a look at the CKEditorDemo, it has some examples, here is one of them:

toolbarGroups: [
        { name: 'document', groups: [ 'mode', 'document', 'doctools' ] },
        { name: 'clipboard', groups: [ 'clipboard', 'undo' ] },
        { name: 'editing', groups: [ 'find', 'selection', 'spellchecker', 'editing' ] },
        { name: 'forms', groups: [ 'forms' ] },
        { name: 'basicstyles', groups: [ 'basicstyles', 'cleanup' ] },
        { name: 'paragraph', groups: [ 'list', 'indent', 'blocks', 'align', 'bidi', 'paragraph' ] },
        { name: 'links', groups: [ 'links' ] },
        { name: 'insert', groups: [ 'insert' ] },
        '/',
        { name: 'styles', groups: [ 'styles' ] },
        { name: 'colors', groups: [ 'colors' ] },
        { name: 'tools', groups: [ 'tools' ] },
        { name: 'others', groups: [ 'others' ] },
        { name: 'about', groups: [ 'about' ] }
    ],

removeButtons: 'Form,Checkbox,Radio,TextField,Textarea,Select,Button,ImageButton,HiddenField,Anchor,Language,BidiRtl,BidiLtr,CreateDiv,Find,Replace,Cut,Copy,Paste,PasteText,PasteFromWord,Templates,Save,NewPage,Preview,Print,Source,SelectAll,Scayt,Subscript,Superscript,RemoveFormat,Flash,Table,HorizontalRule,Smiley,SpecialChar,PageBreak,Iframe,ShowBlocks',


extraPlugins: 'wordcount,notification',


wordcount: {
    // Whether or not you want to show the Paragraphs Count
    showParagraphs: true,

    // Whether or not you want to show the Word Count
    showWordCount: true,

    // Whether or not you want to show the Char Count
    showCharCount: true,

    // Whether or not you want to count Spaces as Chars
    countSpacesAsChars: true,

    // Whether or not to include Html chars in the Char Count
    countHTML: false,
    
    // Maximum allowed Word Count, -1 is default for unlimited
    maxWordCount: -1,

    // Maximum allowed Char Count, -1 is default for unlimited
    maxCharCount: -1,
}
	

I hope this helps!

Kind regards,

Stuart