• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.
  • This forum has been archived. New threads and replies may not be made. All add-ons/resources that are active should be migrated to the Resource Manager. See this thread for more information.

Adding own buttons to the Editor Toolbar



In this tutorial you'll see how you can extend/customize the xenforo editor.

In my plugin, i've added a button, which is opening a div container under the editor
(Demo Video: http://ragtek.org/videos/editortemplates.htm )

As first, you need to create a folder with your tinyMCE plugin and place it in /js/tinymce/plugins/

In my case it's

More infos can be found here => http://www.tinymce.com
2. create a template hook event listener, to add the necessary changes to the template.

                case 'editor_js_setup':
                    $search = "var plugins = '";
                    $replace = "var plugins = 'editortemplate,";
                    $contents = str_replace($search, $replace, $contents);
                    case 'editor_tinymce_init':
                        $addToTemplate = ",\ntheme_xenforo_buttons2 : 'bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,|,bullist,numlist,outdent,indent,|,link,unlink,image,xenforo_media,xenforo_custom_bbcode,|,xenforo_code,|,|,editortemplate'";
                        $contents = $contents . $addToTemplate;
In line 3 i'm adding my "editortemplate" to the xenforo default plugins.
In line 7 i'm replacing the toolbar buttons with my own version => i've added 2 seperators | and my editortemplate button

That's it:)
If you now load the editor, you'll see your new button.
(Attention: with this way, ONLY 1 PLUGIN will be able to add own buttons)

I wish there was a easier way for this:( in vBulletin it's much easier:(

(Will be continued)

Demo: www.ragtek.org/xenforo



Well-known member
That's very interesting. Thanks for sharing Ragtek.

I do hope Kier or Mike would come up with an official bbcode manager that can add buttons by itself soon


Well-known member
this in the hook listener should add some code if another addon changes the Icons.

                case 'editor_tinymce_init':
                    if (strpos($content,'theme_xenforo_buttons2') !== false)
                        $lines = explode("\n",$content);
                        foreach ($lines as $k => $line)
                            if (strpos($line,'theme_xenforo_buttons2')!==false)
                                $line[$k] .= ",|,editortemplate";
                        $content .= ",\ntheme_xenforo_buttons2 : 'bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,|,bullist,numlist,outdent,indent,|,link,unlink,image,xenforo_media,xenforo_custom_bbcode,|,xenforo_code,|,|,editortemplate'";
untestet. I am still at development for my AddOn. It should also work with preg_replace instead of explode and foreach.