id	summary	reporter	owner	description	type	status	priority	milestone	component	version	resolution	keywords	cc
9838	Need help to create custom toolbar button, which executes CKEditor format options	vijendra		"HI,

I want to create custom toolbar buttons, which mimic some of the functionality CKEditor provide. For example, if i need to create custom button for ""<B>,<I>,<PRE>,<H1>,<H2>"" etc. tags, then how can i achive this?

I tried creating custom button for <PRE> tag, (the CKEditor ""formatted"" option), but it doesnt worked really well with EnterMode=BR

here is the plugin,

(function () {
    /*http://blog.lystor.org.ua/2010/11/ckeditor-plugin-and-toolbar-button-for.html*/
    var a = {
        exec: function (editor) {
            var format = {
                element: ""pre""
            };
            var style = new CKEDITOR.style(format);
            style.apply(editor.document);    
        }
    },

 b = ""button-pre"";
    CKEDITOR.plugins.add(b, {
        init: function (editor) {
            editor.addCommand(b, a);
            editor.ui.addButton(""button-pre"", {
                label: ""PRE tag"",
                icon: this.path + ""pre_btn.gif"",
                command: b
            });
        }
    });
})();

the problem is that, it applies the <PRE> to not just selected but to the entire text, when used with EnterMode=BR.

The CKEditor ""formatted"" option works well, it applies <PRE> tag to the selected text only and not to entire text.


Can anyone help me."	Task	closed	Normal		General	4.0	invalid