How to Remove TinyMCE Buttons from WordPress Editor?

Categories WordPress TutorialsTags , , Start discussion

TinyMCE editor makes it easy for you to create content without typing HTML tags manually. It comes with lots of buttons by default to make it handy for you. Some WordPress plugins add extra buttons in TinyMCE editor also. Sometimes you might need to remove some TinyMCE buttons, one or more.

Why Need to Remove TinyMCE Buttons?

First, look at the buttons in TinyMCE editor, there are 26 buttons in all, organized in two row. Among them, 24 buttons comes with the WordPress installation and other two (in the right) buttons implemented by plugins. You might have more buttons, it depends on which plugins you are using.

TinyMCE editor | Remove TinyMCE buttons

In most cases, you don’t need all those buttons. Depending on the level of customization and user satisfaction, you may want to remove some of these buttons you don’t need. Sometimes removing buttons can strengthen security of your WordPress site by hiding vulnerable plugins buttons from other users.

Remove TinyMCE Buttons from Editor

To remove tinymce buttons, you need to know the buttons name first. Here are all default buttons name –

bold, italic, bullist, numlist, blockquote, underline, alignjustify, alignleft, aligncenter, alignright, link, unlink, strikethrough, wp_more, spellchecker, wp_adv, dfw, formatselect, hr, forecolor, pastetext, removeformat, charmap, outdent, indent, undo, redo, wp_help

Here wp_more is for read-more button, wp_adv for toggle-row, dfw for distraction-free-writing-mode, formatselect for dropdown-menu, hr for horizontal-line, forecolor for text-color, removeformat for clear-formatting, charmap for special-characters and wp_help for keyboard-shortcuts button.

To find the name of the plugin implemented buttons, open page source of the editor page (right-click of your mouse and select “View Page Source”) from your browser. Now find the term tinymce.PluginManager.load in the page source. You will find something like this if you have any plugin implemented button –

tinymce.PluginManager.load("AtD", "https://bydik.com/wp-content/plugins/jetpack/");

In the finding above, AtD is the button name which is implemented by Jetpack plugin. You might find more results if you have more buttons. After collecting all the buttons name, you can remove any button you desire.

To remove TinyMCE buttons from the first row you need to use mce_buttons filter –

// Remove unwanted WordPress TinyMCE buttons from first row
function bydik_remove_tinymce_buttons_first_row( $buttons ) {
    $remove = array( 'spellchecker', 'AtD', 'wp_more' );
    return array_diff( $buttons, $remove );
}
add_filter( 'mce_buttons', 'bydik_remove_tinymce_buttons_first_row', 2000 );

This function will delete spellcheker, AtD and wp_more buttons from the first row. You can customize the name of the buttons inside array if you want, you can also remove just one!

To remove TinyMCE buttons from the second row you need to use mce_buttons_2 filter –

// Remove unwanted WordPress TinyMCE buttons from second row
function bydik_remove_tinymce_buttons_second_row( $buttons ) {
    $remove = array( 'charmap', 'removeformat', 'wp_help' );
    return array_diff( $buttons, $remove );
}
add_filter( 'mce_buttons_2', 'bydik_remove_tinymce_buttons_second_row', 2020 );

This function will delete charmap, removeformat and wp_help buttons from the second row.

You can add these functions in your theme’s functions.php, your own plugin or Functionality plugin.

That’s all. If you need further help, please comment.

Leave a Reply

Your email address will not be published.