1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.
  2. 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

Discussion in 'Development Tutorials [Archive]' started by ragtek, Aug 16, 2011.

  1. ragtek

    ragtek Guest

    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);
    $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

    Attached Files:

  2. Panupat

    Panupat 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
    cclaerhout likes this.
  3. cellarius

    cellarius Active Member

  4. Hoffi

    Hoffi 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 (
    $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.
  5. MarcosPreviato

    MarcosPreviato Active Member

    Work for me!

Share This Page