Can I disable WYSIWYG? (Not Rich Text Editor)

Jaxel

Well-known member
I don't like the WYSIWYG editor at all. Basically I dont like how the cut & paste mechanic works. If I cut some text from another page and paste it into the MCE, it will also paste in with the same formatting as that other page. I want to paste in without formatting. Since I don't think I'll be getting this, I would rather disable the WYSIWYG editor completely, while also retaining the helpful buttons.

If you turn off the Rich Text Editor, its just a blank text box... no helpful buttons. I want to keep those buttons.

Why is the cut & paste mechanic bad? Because my website has multiple skins, both light and dark. If someone is using the dark skin, and cut and pastes text from my website (which is white), it looks fine to them in the text editor; they won't even know that they also copied over the white text color tag. However, to someone who is using the light skin, the other user just pasted in white text that they can not read. The same happens vice versa.
 
I think it would be handy if the formatting buttons etc were still present when you switch from WYSIWYG to just text. Which is how it is on vBulletin. But I'm not sure if that's possible with the editor that's in use.
 
I know this is an old post, but I don't think anyone has documented a solution to this. You can completely disable how TinyMCE preserves the formatting in pasted text. If someone wants to re-write this or package it up in an easier to digest format, please feel free to do so. I wanted to type this out quickly so it can hopefully benefit others.

The functionality to strip formatting appears to have been there all along. I have no idea why this wasn't the default behaviour right from the first release of XenForo. Preserving font stylings, colours, etc is a huge usability problem (IMO).

Lets fix this crap:
- Open your editor_js_setup template.
- Find the tinyMCE.init section
- Change the xenhook section from this:
Code:
<xen:hook name="editor_tinymce_init" params="{xen:array 'editorId={$editorId}'}">
                mode: 'exact',
                elements: $editor.attr('id'),
                plugins: plugins,
                cleanup: false,
                theme: 'xenforo',
                theme_xenforo_dialog_url: "{xen:jsescape 'index.php?editor/dialog&style={$visitorStyle.style_id}'}",
                theme_xenforo_contents_css_url: "css.php?style={xen:urlencode $visitorStyle.style_id}&css=editor_contents&d={xen:urlencode $visitorStyle.last_modified_date}",
                language: '',
                directionality: '{$visitorLanguage.text_direction}',
                document_base_url: "{xen:jsescape $requestPaths.fullBasePath}",
                xenforo_smilies: {xen:helper json, $smilies},
                xenforo_bbcode_switch_text: ["{xen:jsescape {xen:phrase use_bb_code_editor}}", "{xen:jsescape {xen:phrase use_rich_text_editor}}"]
</xen:hook>

To this:
Code:
<xen:hook name="editor_tinymce_init" params="{xen:array 'editorId={$editorId}'}">
mode: 'exact',
elements: $editor.attr('id'),
plugins: plugins,
cleanup: false,
theme: 'xenforo',
theme_xenforo_dialog_url: "{xen:jsescape 'index.php?editor/dialog&style={$visitorStyle.style_id}'}",
theme_xenforo_contents_css_url: "css.php?style={xen:urlencode $visitorStyle.style_id}&css=editor_contents&d={xen:urlencode $visitorStyle.last_modified_date}",
language: '',
directionality: '{$visitorLanguage.text_direction}',
paste_auto_cleanup_on_paste : true,
paste_remove_styles: true,
paste_remove_styles_if_webkit: true,
remove_linebreaks : true,
paste_strip_class_attributes: true,
setup : function(ed) {
ed.onInit.add(function(ed) {
ed.pasteAsPlainText = true;
});
},
document_base_url: "{xen:jsescape $requestPaths.fullBasePath}",
xenforo_smilies: {xen:helper json, $smilies},
xenforo_bbcode_switch_text: ["{xen:jsescape {xen:phrase use_bb_code_editor}}", "{xen:jsescape {xen:phrase use_rich_text_editor}}"]
 
</xen:hook>


- Then, make the following changes under your "var plugins" section so the paste plugin is included. Swap from this:
Code:
var plugins = 'tabfocus,-xenforo_inline_popups,-xenforo_custom_bbcode,-xenforo_smilies,-xenforo_media,-xenforo_code,-xenforo_bbcode_switch,-xenforo_elastic';

To this:
Code:
var plugins = 'tabfocus,-xenforo_inline_popups,-xenforo_custom_bbcode,-xenforo_smilies,-xenforo_media,-xenforo_code,-xenforo_bbcode_switch,-xenforo_elastic,paste';
Note the word "paste" added before the ending.

Done*
*The above text was brought to you by Microsoft Word ^__^


Specifically, the options and function that seem to work their magic here are:

paste_auto_cleanup_on_paste : true,
paste_remove_styles: true,
paste_remove_styles_if_webkit: true,
remove_linebreaks : true,
paste_strip_class_attributes: true,
setup : function(ed) {ed.onInit.add(function(ed) {ed.pasteAsPlainText = true;});},

Then I've just added "paste" to the plugins that are initialized.

A few words of caution:
I've only tested this on web browsers that matter. Maaaybe it doesn't work on IE7, I don't know or care :)
I'm not an expert regarding TinyMCE (and hate it with a passion).
Your editor templates might be slightly different, so please be careful what you're editing and keep backups.
This mod is working perfectly on our install, but I can't provide support if it doesn't do the same for you.

Cheers


Edit:
Here's our entire editor template for reference purposes. Please do not copy and use this directly, since we've stripped out items that you might still need.
Code:
<xen:require js="js/tinymce/tiny_mce.js" />
 
<script>
 
<xen:hook name="editor_js_setup" params="{xen:array 'editorId={$editorId}'}">
 
!function($, window, document, _undefined)
{
    var $editor = $("#{xen:jsescape $editorId}_html").hide();
    console.info('XenForo editor %s, %o', '{xen:jsescape {$editorId}}', $editor);
 
    window.tinyMCE && tinyMCE.addI18n(
    {
        xenforo:
        {
            common:
            {
                apply: "{xen:jsescape {xen:phrase apply}}",
                insert: "{xen:jsescape {xen:phrase insert}}",
                update: "{xen:jsescape {xen:phrase update}}",
                cancel: "{xen:jsescape {xen:phrase cancel}}",
                close: "{xen:jsescape {xen:phrase close}}",
                browse: "{xen:jsescape {xen:phrase browse}}",
                class_name: "{xen:jsescape {xen:phrase class}}",
                not_set: "-- {xen:jsescape {xen:phrase not_set}} --"
            },
 
            xenforo:
            {
 
                bold_desc: "{xen:jsescape {xen:phrase bold_ctrl_b}}",
                italic_desc: "{xen:jsescape {xen:phrase italic_ctrl_i}}",
                bullist_desc: "{xen:jsescape {xen:phrase unordered_list}}",
                image_desc: "{xen:jsescape {xen:phrase insert_edit_image}}",
                removeformat_desc: "{xen:jsescape {xen:phrase remove_formatting}}",
                smilies_desc: "{xen:jsescape {xen:phrase smilies}}",
                media_desc: "{xen:jsescape {xen:phrase media}}",
                quote: "{xen:jsescape {xen:phrase quote}}"
 
            }
        }
    });
 
    $(function()
    {
        $editor.css('visibility', '').show();
        if (window.tinyMCE)
        {
            var plugins = 'tabfocus,-xenforo_inline_popups,-xenforo_custom_bbcode,-xenforo_smilies,-xenforo_media,-xenforo_bbcode_switch,-xenforo_elastic,paste';
            // tinyMCE.dom.Event._pageInit(window); // for ajax loads. Removed for TinyMCE Fix
 
            $.fn.controlsToggle();
            tinyMCE.init(
            {
            <xen:hook name="editor_tinymce_init" params="{xen:array 'editorId={$editorId}'}">
                mode: 'exact',
                elements: $editor.attr('id'),
                plugins: plugins,
                cleanup: false,
                theme: 'xenforo',
                theme_xenforo_dialog_url: "{xen:jsescape 'index.php?editor/dialog&style={$visitorStyle.style_id}'}",
                theme_xenforo_contents_css_url: "css.php?style={xen:urlencode $visitorStyle.style_id}&css=editor_contents&d={xen:urlencode $visitorStyle.last_modified_date}",
                language: '',
                directionality: '{$visitorLanguage.text_direction}',
                paste_auto_cleanup_on_paste : true,
                paste_remove_styles: true,
                paste_remove_styles_if_webkit: true,
                remove_linebreaks : true,
                paste_strip_class_attributes: true,
                setup : function(ed) {
                    ed.onInit.add(function(ed) {
                        ed.pasteAsPlainText = true;
                    });
                },
             
                document_base_url: "{xen:jsescape $requestPaths.fullBasePath}",
                xenforo_smilies: {xen:helper json, $smilies},
                xenforo_bbcode_switch_text: ["{xen:jsescape {xen:phrase use_bb_code_editor}}", "{xen:jsescape {xen:phrase use_rich_text_editor}}"]
            </xen:hook>
            });
        }
        else
        {
            <xen:if is="!{$message}">$editor.after($('<input type="hidden" name="_xfRteFailed" value="1" />'));</xen:if>
        }
 
        $editor.data('editorActivated', true);
 
    });
}
(jQuery, this, document);
</xen:hook>
</script>
 
Thanks Cédric. Nice work. I wasn't aware that you'd added paste plugin functionality. However, we'd still prefer a template edit instead of another add-on for our setup. Seems easier. :)
 
I don't like the WYSIWYG editor at all. Basically I dont like how the cut & paste mechanic works. If I cut some text from another page and paste it into the MCE, it will also paste in with the same formatting as that other page. I want to paste in without formatting. Since I don't think I'll be getting this, I would rather disable the WYSIWYG editor completely, while also retaining the helpful buttons.

If you turn off the Rich Text Editor, its just a blank text box... no helpful buttons. I want to keep those buttons.

Why is the cut & paste mechanic bad? Because my website has multiple skins, both light and dark. If someone is using the dark skin, and cut and pastes text from my website (which is white), it looks fine to them in the text editor; they won't even know that they also copied over the white text color tag. However, to someone who is using the light skin, the other user just pasted in white text that they can not read. The same happens vice versa.


use can do it with follow this post => Disable WYSIWYG editor in Xenforo
;)
 
Top Bottom