Add custom button to editor

[infis]

I found this code in js/tinymce/themes/xenforo/editor_template.js:

                addButtons : function (theme, tb)
                {
                        var tags = theme.settings.[B]xenforo_custom_bbcode_tags[/B],
                                controlManager = theme.editor.controlManager;

                        //tb.add(controlManager.createControl('|'));

                        tb.add(controlManager.createButton('xenforo_quote',
                                { title: 'xenforo.quote', cmd: 'xenForoWrapBbCode', ui: false, value: 'QUOTE' }
                        ));

                        if (typeof tags === 'undefined' || tags.length === 0 || tags === {})
                        {
                                return;
                        }

                        tinymce.each(tags, function(tag, tagName) {
                                tb.add(controlManager.createButton('xenforo_custom_bbcode_' + tag,
                                        {title : tag[0], image : tag[1], cmd : 'xenForoWrapBbCode', ui : false, value : tagName}
                                ));
                        });
                },

Where and how I can create or change xenforo_custom_bbcode_tags array? I want use it in my add-on.

 

[ragtek]

http://xenforo.com/community/threads/adding-own-buttons-to-the-editor-toolbar.18917/#post-243880

 

[infis]

Yes, the given way of addition custom button is simple. But it is necessary not always. If it is necessary to insert only a BB-code, that is such way.
Create a template hook event listener, to add the necessary changes to the template:

case 'editor_tinymce_init':
  $bbcode_tags['BB-code'] = array('Button name', 'styles/default/xenforo/smilies/smile.png');
  $contents .= ', xenforo_custom_bbcode_tags: ' . json_encode($bbcode_tags);
break;

But it can be used only once.
As a variant it is possible to try to change a template editor_js_setup where by analogy to a array of smiles it is possible to insert own array of buttons.
After

                xenforo_smilies: {xen:helper json, $smilies},

insert

                xenforo_custom_bbcode_tags: {xen:helper json, $custom_bbcode_tags},

and in hook event listener create or modify array $custom_bbcode_tags. I didn't check, whether it will work, but is assured that will be.

 

[Andy.N]

Is it possible to add a custom button on the editor yet in XF 1.1?

 

[ragtek]

Is it possible to add a custom button on the editor yet in XF 1.1?

It's already possible with xf 1.0
http://xenforo.com/community/threads/adding-own-buttons-to-the-editor-toolbar.18917/
There's even a add-on for this: http://xenforo.com/community/threads/cel-editor-button-management.19991

 

[infis]

I am in searches of the simple and effective decision for adding of the user button for a BB-code in the panel of the editor.
While there is such variant, but, am afraid that it is not optimal, though provides operation of any amount add-on's.

1. Create a new template editor_js_setup_smilies and write to:

xenforo_custom_bbcode_tags: {<xen:hook name="editor_tinymce_init_smilies"></xen:hook>},

2. Include this template in template editor_js_setup:


Template editor_js_setup_smilies:


3. To use it in add-on (by hook):

class TestBB_Listener {
        public static function test_func($hookName, &$contents, array $hookParams, XenForo_Template_Abstract $template)
        {
                if ($hookName == 'editor_tinymce_init_smilies')
                {
                        $contents .= '"BB-код":["Мой смайл","styles/default/xenforo/smilies/smile.png"],';

                }
        }
}

4. Result:


There are other more simple ways of the decision? Whether developers can add any possibilities simplifying creation of such buttons? Besides direct editing of a template is not the satisfactory decision.

 

[James]

I am in searches of the simple and effective decision for adding of the user button for a BB-code in the panel of the editor.
While there is such variant, but, am afraid that it is not optimal, though provides operation of any amount add-on's.

1. Create a new template editor_js_setup_smilies and write to:

xenforo_custom_bbcode_tags: {<xen:hook name="editor_tinymce_init_smilies"></xen:hook>},

2. Include this template in template editor_js_setup:
View attachment 20323

Template editor_js_setup_smilies:
View attachment 20324

3. To use it in add-on (by hook):

class TestBB_Listener {
        public static function test_func($hookName, &$contents, array $hookParams, XenForo_Template_Abstract $template)
        {
                if ($hookName == 'editor_tinymce_init_smilies')
                {
                        $contents .= '"BB-код":["Мой смайл","styles/default/xenforo/smilies/smile.png"],';

                }
        }
}

4. Result:
View attachment 20325

There are other more simple ways of the decision? Whether developers can add any possibilities simplifying creation of such buttons? Besides direct editing of a template is not the satisfactory decision.

Did you consider requesting a new template hook http://xenforo.com/community/threads/template-hooks.7909/

 

[infis]

No. It not the correct way of the decision of the given problem.
After all this only partial decision. For example, there is no possibility to add the bb-code with parametres, and also it doesn't do possible to insert the button with the custom event.
The problem is deeper, than my decision.

 

[Alluidh]

Hi

Sorry to bring this thread back to life, but I have the same problem without any solution

I had used the BB Code Manager to create some more BB Codes (float left/right, sub, sup, spoiler, ...)
After that I've created some new Icons in 20x20 png and installed the Cel Editor Button Management for build an icon order like this


But this is only a dream screen, because I didn't find a way to get
1. combine the new BB Code with a function behind the new icons
2. combine the new icons with the editor for using them in the Cel Editor Button Management

I know there is an Adding own buttons to the Editor Toolbar from ragtek but I don't understand the way.

I only want the new icons and with creating something like [float_left] [/flaot_left] [float_right] [/flaot_right] and so on.
The BB Codes themself work great, but this is not the goal

Is someone able to help?

Thanks a lot