Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

iTechGuides is reader-supported. When you buy through links on our site, we may earn an affiliate commission. As an Amazon Associate I earn from qualifying purchases. Learn more

Customize WordPress’s TinyMCE editor with PHP filters, per-editor settings, and (for new controls) a small JavaScript plugin. Use mce_buttons through mce_buttons_4 to change toolbar rows, tiny_mce_before_init for configuration such as block formats, and mce_external_plugins plus JavaScript to add a custom button. Always scope callbacks by editor ID so you do not unintentionally change every editor, including or excluding the Classic block.

What you can customize

TinyMCE is the Visual editor used by WordPress in several places: the classic post editor, the Classic block inside the block editor, and standalone editors rendered with wp_editor(). WordPress builds each instance from an initialization array, a list of enabled TinyMCE plugins, and one to four toolbar-row arrays. Filters let a plugin or theme alter those values before the editor is created.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.
  • Toolbar membership and order: mce_buttons, mce_buttons_2, mce_buttons_3, and mce_buttons_4.
  • Initialization options: tiny_mce_before_init, including the block-format menu and other TinyMCE settings.
  • Plugin loading: tiny_mce_plugins for the plugin list and mce_external_plugins for JavaScript files outside WordPress’s built-in set.
  • One rendered editor: wp_editor( $content, $editor_id, $settings ).

The callback receives the current editor ID. That argument is the key to safe customization: a rule intended for the main post editor should not automatically affect a custom metabox, a comment form, or the Classic block.

Choose the right method

Goal API Implementation Typical scope
Remove or add an existing toolbar control mce_buttons through mce_buttons_4 PHP filter Any matching editor ID; all instances if you omit the check
Change the order of controls The same four toolbar filters PHP filter that edits the array A selected toolbar row
Change a configuration value, such as block formats tiny_mce_before_init PHP filter A selected editor instance
Enable or disable a TinyMCE plugin tiny_mce_plugins PHP filter Instances matched by your condition
Load a plugin file that you wrote mce_external_plugins, normally with a toolbar filter PHP plus JavaScript A selected editor instance
Render a separately configured editor wp_editor() PHP at the output location That one editor

TinyMCE treats each toolbar row as an ordered list. Adding a button name appends it; removing and reinserting names lets you control placement. A filter that changes membership is not a substitute for loading the code behind a custom button: a button name without a registered plugin produces no working control.

#1 Best Overall
Sale
Compressed Air Duster,130000RPM Super Power Cordless Air Duster,Rechargeable Brushless Blower,3 Gear Adjustable Blower with LED Light,Dust Remover for Computer/House/Outdoor/Car
  • Powerful Turbo Fan:CAGIWIRU Electric Air Duster have reached speed up to 130000RPM,Can efficient remove dust and debris.With LED light and Three Adjustable Speed to meet with different cleaning tasks.
  • With Attached USB C Fasting Charging cable.Charing 3 hours,Enjoy up to 240 minutes of use on the lowest setting, For third speed can use for 25mins.with four charging options to meet with your needs.
  • Wide Application:Upgraded attached 5 different nozzles,making it suitable for a variety of scenes, such as car,pet, pc, keyboards, and other electronic devices. It also serves for office and home clean duster.
  • Handy Design & Portable:Cordless air duster electric nozzle is Light weight and small size, design and comfortable to hold and space saving, convenient to carry around. You can put it in your room or inside the car without taking up space.
  • Warranty & Support: Our Electric air duster comes with 5 years warranty and 24/7 customer service. During this period, if you have any questions,pls kindly feel free to contact us.

Prepare safely before editing

  1. Use staging or a recent backup. A malformed PHP callback can prevent the administration area from loading, and a JavaScript error can leave the editor unusable.
  2. Put code in a site plugin. A small custom plugin survives theme changes and keeps the customization separate from WordPress core. Never edit core files.
  3. Identify the editor ID. The normal post editor uses content; the Classic block uses classic-block. A custom wp_editor() call uses the ID you pass as its second argument.
  4. Confirm the button’s TinyMCE name. Toolbar arrays contain identifiers such as wp_more, fullscreen, and underline, not the text displayed in a tooltip.
  5. Test both editing modes. Visual mode and Text/Code mode can expose different problems, especially when a control inserts HTML.

Remove buttons from a toolbar

Use mce_buttons for the first row. The following example removes the More tag and fullscreen controls only from the main post editor:

<?php
add_filter( 'mce_buttons', function( $buttons, $editor_id ) {
    if ( 'content' !== $editor_id ) {
        return $buttons;
    }

    return array_values(
        array_diff( $buttons, array( 'wp_more', 'fullscreen' ) )
    );
}, 10, 2 );

array_diff() leaves the remaining names intact. array_values() reindexes the result so the toolbar receives a clean, consecutive array. If another plugin has already removed one of those controls, the code simply leaves the current list unchanged.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

To remove a control from another row, use its corresponding filter. For example, this removes the underline control from row two for the same editor:

<?php
add_filter( 'mce_buttons_2', function( $buttons, $editor_id ) {
    if ( 'content' !== $editor_id ) {
        return $buttons;
    }

    return array_values( array_diff( $buttons, array( 'underline' ) ) );
}, 10, 2 );

Do not assume a button is in row one: inspect the current toolbar or the generated configuration, then apply the filter for the row in which the control actually appears.

Add existing controls and control their order

If TinyMCE or WordPress already provides the control, append its identifier rather than writing a plugin. This example adds underline to the second row:

Rank #2
EVEO® Screen Cleaner Spray Kit (Streak-Free) TV Screen Cleaner for Smart TV, Lcd, LEd, Oled | Computer Screen Cleaner Spray and Wipe Microfiber Cloth - TV, Monitor, Laptop, iPad, Car - 6.7oz 1 Pack
  • Screen Cleaner is Your Screen’s New Bestfriend! - EVEO is proud to present a screen cleaner that’s perfectly suited for your TV. Meet your new screen cleaner, computer screen cleaner, laptop cleaner, iPad cleaner, Macbook,tv cleaner or any other electronic device. Our screen cleaner spray and wipe along with the included plush microfiber cloth, easily removes dust, fingerprints & other smudges on the screen’s surface. Clean effectively for a streak-free screen
  • Gentle on your Screens - Our screen cleaner spray and wipes is compatible to be used even for the most sensitive LCD, LED, CRT, and OLED screens in proper use. Be at ease knowing that this product is compatible with all the major brands: LG, SONY, Samsung, Sharp, iPad, iPhone, Android screens, Kindle, PC monitors - we’ve got you covered! Can be used as LCD screen cleaner, tv cleaner, smart tv screen cleaner, and more
  • Premium Super Soft Plush Microfiber Cloth - Included in this efficient screen cleaning kit. This screen cleaner spray and wipe has our signature plush microfiber cloth specially designed to comply with screens and monitors and leave them streak-free. Has been shown to effectively absorbs stubborn stains, zero streaks, and no fiber shedding. Always use this together with our screen cleaner for the best results
  • Easy-to-Use Screen Cleaner Kit + microfiber cleaning cloth - The EVEO Screen Cleaning Kit will easily be your new favorite tool when it comes to taking care of the things you love most, quick and easy solution for a streak-free screen. Simply screw on the sprayer gun on the screen cleaner bottle. Spray the cleaning liquid onto the microfiber cloth, then wipe the screen until desired cleanliness & shine is achieved.
  • Quality Screen Care Kit Worth Purchasing - Enjoy a convenient Screen Cleaner anytime, anywhere you need it. Your satisfaction is our top priority. We stand behind the quality of our products and that’s why, you shouldn’t be worrying at all. We manufacture the Best Screen Cleaner. and can be used for laptop cleaning kit, laptop screen cleaner, tv screen cleaner for smart tv. MacBook screen cleaner, monitor cleaner or screen cleaner spray for electronic devices with microfiber cleaning cloth
<?php
add_filter( 'mce_buttons_2', function( $buttons, $editor_id ) {
    if ( 'content' === $editor_id ) {
        $buttons[] = 'underline';
    }

    return $buttons;
}, 10, 2 );

Appending can create a duplicate when another extension has already added the same name. To place a control once at a predictable position, remove existing copies and insert it at an index:

Free tools Windows power users keep installed

One-click scans. No signup required.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.
<?php
add_filter( 'mce_buttons_2', function( $buttons, $editor_id ) {
    if ( 'content' !== $editor_id ) {
        return $buttons;
    }

    $buttons = array_values( array_diff( $buttons, array( 'underline' ) ) );
    array_splice( $buttons, 2, 0, 'underline' );

    return $buttons;
}, 10, 2 );

Indexes are zero-based, so position 2 means the third slot. The final position can still change if another plugin runs later and edits the same filter. Use a deliberate filter priority only when you understand the interaction; changing priority is not a guarantee that every other extension will behave the same way.

Change the format menu and other initialization values

Use tiny_mce_before_init when you are changing a TinyMCE option rather than the membership of a toolbar row. This example limits the format menu for the main post editor to Paragraph, Heading 2, and Heading 3:

<?php
add_filter( 'tiny_mce_before_init', function( $init, $editor_id ) {
    if ( 'content' === $editor_id ) {
        $init['block_formats'] = 'Paragraph=p;Heading 2=h2;Heading 3=h3';
    }

    return $init;
}, 10, 2 );

The value is a semicolon-separated list. Each item has the label shown to authors, an equals sign, and the HTML element TinyMCE inserts. Keep the callback narrow and return the complete initialization array.

WordPress merges your values into its defaults. Preserve those defaults unless you have a specific reason to replace an option. In particular, do not casually disable the normal cleanup or allowed/disallowed-element rules: doing so can permit markup that WordPress would otherwise sanitize or normalize. Treat every initialization key as version-sensitive and test the saved result, not just the toolbar appearance.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.
Rank #3
BladeHawks RGB Gaming Mouse Pad Extra Large Extended 31.5x12 Inch-Black
  • 【Large size】:Measuring 800 x 300 mm/ 31. 5×12 inches, which is wider and taller than others. Large mouse pad can perfectly fit your keyboard and mouse of any size, and there is also ample space for peripherals such as phones, tablets, etc.
  • 【LED backlight mouse pad】:Blade Hawks RGB mouse pad provides 7 static modes and 7 dynamic modes will give you the options you are looking for. Power-off memory function remembers the last lighting mode you selected. The super glow fiber Chroma will give you a colorful gaming setup that you want.
  • 【Anti-slip rubber base】:Made from Natural rubber, this gaming mousepad will firmly grip your desktop, allowing you to enjoy the ultimate precision in the games you are most passionate about. It also comes with a texture that enhances this ability even further.
  • 【Smooth and waterproof surface】: Micro-textured cloth surface, for extremely precise mouse control and a smooth movement. When liquid splashes on the gaming mouse pad, it forms water droplets and slides down. Will not delay your work or gameplay.
  • 【Plug and play】: This mouse and keyboard pad is powered by USB, plug and play, no driver required. One button control light modes. Press one time to change the lighting mode, press twice to change the brightness, press and hold about 3 seconds turn ON/OFF.

Add a custom TinyMCE button

A new button has two parts. PHP tells WordPress where the JavaScript plugin is and places the button name in a toolbar row. JavaScript registers that name and defines what happens when an author clicks it.

1. Create the JavaScript plugin

Save a file such as mybutton.js in your site plugin directory. This example inserts a paragraph with a class when clicked:

(function() {
    tinymce.PluginManager.add('mybutton', function(editor) {
        editor.addButton('mybutton', {
            text: 'Insert note',
            icon: false,
            onclick: function() {
                editor.insertContent('<p class="note">Write your note here.</p>');
            }
        });
    });
})();

The registration name, mybutton, must match the key used in PHP and the toolbar name. TinyMCE builds bundled with different WordPress versions can expose different UI APIs. The editor.addButton() form is used by older TinyMCE builds; if the active build does not expose it, adapt the registration to that build’s documented button API rather than silently loading a plugin that throws an error.

2. Register the file and toolbar control

<?php
add_filter( 'mce_external_plugins', function( $plugins, $editor_id ) {
    if ( 'content' === $editor_id ) {
        $plugins['mybutton'] = plugins_url( 'mybutton.js', __FILE__ );
    }

    return $plugins;
}, 10, 2 );

add_filter( 'mce_buttons', function( $buttons, $editor_id ) {
    if ( 'content' === $editor_id ) {
        $buttons[] = 'mybutton';
    }

    return $buttons;
}, 10, 2 );

mce_external_plugins maps the plugin name to its JavaScript URL. The corresponding toolbar filter is required: loading a plugin does not automatically add a visible button. If the file is in a subdirectory, include that relative path in plugins_url().

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

3. Test the complete path

  • Confirm the browser requests the JavaScript file with a successful response.
  • Open the browser console and fix syntax or API errors before testing saved content.
  • Click the control in Visual mode and confirm the expected HTML appears in Text/Code mode.
  • Save, reload, and edit the post again to ensure WordPress has not removed or rewritten the inserted markup.

A custom control that inserts arbitrary HTML should also account for user permissions, sanitization, and the content model your theme expects. The editor is not a bypass for WordPress’s normal content-safety rules.

Rank #4
Sale
Vaydeer Wrist Rest for Keyboard and Mouse, Computer Ergonomic Wrist Support Pad, Soft Memory Foam Arm Cushion for Desk, Palm Hand Office Laptop Typing
  • 【Softer and More Comfortable】Vaydeer wrist rest has unique diamond pattern, which is the combination of softness and aesthetics. The materials of wrist rest are improved into higher quality memory foam and covered with silky smooth lycra. The computer wrist rest makes you as comfortable and cushiony as like rest your wrists on clouds.
  • 【Ergonomic Wrist Saver】The wrist rests for keyboard and mouse comes with a 17.32×3.15×0.83 inch keyboard wrist pad and a 5.94×3.15×0.83 inch mouse wrist support. Based on ergonomic design, the unique concave shape is the perfect fit for your wrist joints. The wrist rest pad fits most computer keyboards and laptops, improve hand and wrist posture, release your wrist and arm stress.
  • 【Non-Slip Rubber Bottom】Featuring an anti-skid silicone base on the bottom, this wrist keyboard support stays firmly in place on your desk, preventing the padding from sliding around, ensuring stable and consistent wrist support during extended computer sessions.
  • 【Better Experience & Pain Relief】Our keyboard arm rest is beneficial to alleviate the soreness caused by direct contact and friction between your arm and a hard desk surface, reducing the risk of wrist fatigue or carpal tunnel. The soft texture of memory foam can evenly distribute the pressure around your wrists and provide good support with just enough give.
  • 【Helpful in Multiple Scenarios】Whether you're working, studying, writing, typing, gaming, this keyboard and mouse rest combo is an essential accessory to add comfort and support to your hands and wrists. It’s also a great gift for men, women, family, friend, coworker, gamer, teacher, etc.

Configure one standalone editor with wp_editor()

For a custom metabox or administration screen, configure the instance where it is rendered instead of changing every TinyMCE editor globally:

<?php
wp_editor(
    $content,
    'summary_editor',
    array(
        'textarea_name' => 'summary',
        'media_buttons' => false,
        'teeny'         => false,
        'textarea_rows' => 12,
    )
);

The first argument is the initial content, the second is the editor ID, and the third is the settings array. Give every instance a unique ID; do not use square brackets in that ID. Set a distinct textarea_name so the submitted value is not confused with the main post content.

Setting Effect When to use it
wpautop Controls WordPress’s automatic paragraph and line-break handling Set deliberately when the field’s markup must differ from normal post content
media_buttons Shows or hides the media-upload controls above the editor Disable for short fields that should contain text only
default_editor Selects the initial Visual or Text mode Choose the mode that matches the field’s expected content
drag_drop_upload Controls drag-and-drop uploads Enable only when the screen and permissions support uploads
textarea_name Sets the submitted form field name Always set a unique, intentional name for custom fields
textarea_rows Sets the initial textarea height Use a value appropriate to the amount of content expected

Because the generated editor still has an ID, your toolbar and initialization filters can target summary_editor just as they target content. Keep rendering settings in the wp_editor() call and behavior changes in the relevant filters so the boundary remains clear.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.
Independent reader supportYour contribution helps us test, update, and keep practical guides available for everyone.Support on Ko-Fi

Handle the Classic block deliberately

The Classic block initializes TinyMCE with the editor ID classic-block. A callback that checks only for content will therefore affect the traditional post editor but not Classic blocks. If both contexts should have the same toolbar, branch explicitly:

<?php
add_filter( 'mce_buttons', function( $buttons, $editor_id ) {
    $supported_ids = array( 'content', 'classic-block' );

    if ( ! in_array( $editor_id, $supported_ids, true ) ) {
        return $buttons;
    }

    return array_values( array_diff( $buttons, array( 'fullscreen' ) ) );
}, 10, 2 );

Use the same ID test for mce_buttons_2, tiny_mce_before_init, and plugin registration when the feature genuinely belongs in both contexts. Conversely, leave classic-block out when the customization is intended only for the legacy editor. Test a newly inserted Classic block, an existing post containing one, and the main post editor separately.

Best Value
Sale
Under Desk Cable Management Tray No Drill, Metal Mesh Cable Management Under Desk with Clamp Mount, 2 Hole Cable Tray with Wire Management and Cord Organizer for Home Office Standing Desk
  • 【No Drill Mounted】Cable management tray can be assembled in as little as 3 minutes or less-simply. Side clips easily clampe the edge of desk, pass through the holes on the sides, and secure excess cables with baskets. Desk cable management supports inward or outward installation to meet your needs in different scenarios, and provides you with great convenience when collecting and organizing wires.
  • 【Rubber Pad Protects Desk】Wire organizer under desk built-in soft rubber pads on the clamp protect your desk from scratches, so you will not damage your furniture or office.
  • 【Sturdy and Beautiful】Cord management under desk is made of high-quality carbon steel and holds about 15 lbs. The wire basket has 2 holes on each side of the tray to enable your cables to pass freely. Cable baskets are suitable for desk thickness use from 0.4" to 2.4".
  • 【Space Saving & Keep Organized】Desk cable management tray holds all your power cords, outlet strips, USB hubs and computer transformers hidden from your feet, and the data cables will not enter the vacuum cleaner to keep your desk clean and tidy. Desk wire organizer is also suitable for use in the kitchen and outdoors.
  • 【Reduce Safety Risks】Cable tray under desk keeps all plugs away from your kids, no more worry about tripping. Using 2 holes wire tray saves extra space, helps you easily cabling and wire protection. The mesh design is not easy to accumulate dust, but avoids safety accidents caused by messy wires.

Understand plugin-list filters

mce_external_plugins loads JavaScript files you provide. tiny_mce_plugins filters the list of TinyMCE plugins WordPress is already preparing. They solve different problems:

  • Use tiny_mce_plugins when you need to add or remove a plugin identifier in the existing TinyMCE build.
  • Use mce_external_plugins when the implementation lives in your own JavaScript file and needs a URL.
  • Use a toolbar filter as well when the plugin exposes a button. A loaded plugin can provide commands, formats, or events without showing a control, but a button name alone cannot provide the implementation.

Do not register an external file under one name and place a different name in the toolbar. TinyMCE must see the same identifier in the plugin registration, external-plugin map, and toolbar array.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

Scope choices and maintenance trade-offs

Approach Best for Main risk Maintenance work
Toolbar filter only Simple removal, addition, or ordering of built-in controls Another extension may edit the same row Check button names and filter priority after WordPress updates
Initialization filter Format menus and other configuration values Replacing defaults can alter cleanup behavior Compare generated settings after version changes
External plugin plus JavaScript Commands or controls that do not already exist JavaScript API or escaping errors Maintain PHP and JavaScript together and test the active TinyMCE build
wp_editor() settings A metabox or a purpose-built admin field Duplicate IDs or conflicting field names Keep IDs unique and verify form submission

Compatibility depends on the active WordPress version, its bundled TinyMCE build, the theme, and other plugins that modify the same hooks. The documented APIs do not provide a universal compatibility matrix, so test the exact versions running on your site.

Troubleshoot a missing or broken customization

The button does not appear

  • Check that the filter matches the correct row: mce_buttons is row one, while mce_buttons_2, mce_buttons_3, and mce_buttons_4 target rows two through four.
  • Verify the TinyMCE identifier, not the visible label. A spelling difference means WordPress will ignore the entry.
  • Confirm the editor ID. For a Classic block, use classic-block; for a custom instance, use the ID passed to wp_editor().
  • If it is a custom control, make sure both external-plugin registration and the toolbar entry are present.

The editor shows a blank area or JavaScript error

  • Open the browser console and identify the first error, not just the final cascade of failures.
  • Check the JavaScript URL and file syntax. A 404 response means the PHP path is wrong; a syntax error prevents the plugin from registering.
  • Verify that the button API used by your JavaScript exists in the TinyMCE build bundled with the active WordPress version.

The change affects the wrong editors

  • Inspect every callback for an editor-ID condition and return the original array when the ID is not supported.
  • Remember that a filter without an ID check is global for the TinyMCE instances that pass through it.
  • Test the post editor, Classic block, and each custom wp_editor() instance independently.

Markup changes after saving

  • Compare Visual and Text/Code modes to see whether the editor itself rewrote the markup.
  • Check the initialization and content-cleanup settings before changing them. WordPress’s defaults are intentional security and consistency boundaries.
  • Confirm that the user’s role and the site’s normal sanitization rules permit the elements and attributes your button inserts.

A repeatable verification checklist

  1. Back up the site or deploy the change to staging.
  2. Place PHP in a site plugin, activate it, and confirm the administration area still loads.
  3. Record each target editor ID and test only those IDs first.
  4. Check every affected toolbar row and the order of its controls.
  5. Open the browser console and network panel when testing an external plugin.
  6. Switch between Visual and Text/Code modes and inspect the resulting HTML.
  7. Save, reload, and edit the content again to verify persistence.
  8. Repeat the test after WordPress, the active theme, or an editor-related plugin is updated.

Practical decision guide

  • Need to hide an existing control? Start with the appropriate mce_buttons* filter.
  • Need to add an existing control or move it? Edit the relevant row array, removing duplicates before inserting at the desired position.
  • Need to change the format dropdown or another option? Use tiny_mce_before_init and preserve the rest of the initialization array.
  • Need a new command or insertion workflow? Build a JavaScript plugin, register it through mce_external_plugins, and add its name to a toolbar row.
  • Need a special editor in one metabox? Configure that instance with wp_editor() and a unique ID and field name.
  • Need the same behavior in the Classic block? Include classic-block explicitly and test it separately from content.

Conclusion

WordPress gives you precise control over TinyMCE without modifying core files. Toolbar filters handle membership and order, tiny_mce_before_init handles configuration, external-plugin hooks connect PHP to custom JavaScript, and wp_editor() keeps a standalone field self-contained. The safest implementations identify the exact editor ID, change only the required setting, preserve WordPress defaults, and verify both the browser behavior and the saved HTML on the WordPress and TinyMCE versions your site actually runs.

Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.