• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.

TinyMCE

James

Well-known member
#1
Are we able to customise the TinyMCE editor as you would any standard TinyMCE editor?

I love the customised toolbars you can make and the fact you can change the skin and colour.. like so:
Code:
tinyMCE.init({
mode : "textareas",
theme : "advanced",
skin : "o2k7",
skin_variant : "black",
});
 

James

Well-known member
#3
I hope so.

I need to add a lot more BBCode to it, assuming that's something that can be done...
TinyMCE has plugin support which includes BBCodes. I do believe that the current BBCode manage written by Kier and Mike includes TinyMCE though.
 

James

Well-known member
#5
I was just checking (just in case you'd made customisations to adapt it to XF). Thanks for clearing it up Kier.
 

Brogan

XenForo moderator
Staff member
#7
Is anyone using their own Custom TinyMCE ?
Custom how?
I've changed the toolbar icons on mine, removed the smilie dropdown and I've also told a few people how to change the style/colours, etc.

I don't think anyone has managed to add a button though yet.
 

James

Well-known member
#9
I'll give TinyMCE a quick experiment shortly, but have a quick look at this code and try to insert it in your tinyMCE toolbar.

If someone fancies throwing the following code into a custom js file (or include it under the original tinymce include) it should create a custom button, assuming K&M didn't alter its core functionality:
Code:
<script type="text/javascript">
tinyMCE.init({
    mode : "textareas",
    theme : "advanced",
    theme_advanced_buttons1 : "mybutton,bold,italic,underline,separator,strikethrough,justifyleft,justifycenter,justifyright, justifyfull,bullist,numlist,undo,redo,link,unlink",
    theme_advanced_buttons2 : "",
    theme_advanced_buttons3 : "",
    theme_advanced_toolbar_location : "top",
    theme_advanced_toolbar_align : "left",
    theme_advanced_statusbar_location : "bottom",
    plugins : 'inlinepopups',
    setup : function(ed) {
        // Add a custom button
        ed.addButton('mybutton', {
            title : 'My button',
            image : 'img/example.gif',
            onclick : function() {
                                // Add you own code to execute something on click
                                ed.focus();
                ed.selection.setContent('Hello world!');
            }
        });
    }
});
</script>