In a few recent discussions the question has been asked how to add buttons to the post editor. One person asked about the <!–nextpage–> button that allows you to break long pages into smaller pages with pagination. The other person works on a church website and wanted to know if the Superscript button could be added because they type out Verses.
Granted, you could use one of several TinyMCE plugins to do this but what if you only need a few?
The post editor comprises of two rows – the primary row which is always open and second row which you can toggle open and closed.
In this demonstration, I will show you how to enable the TinyMCE buttons they requested, as well as a couple I’d like to use myself – Fonts, Fontsize and Underline. For a list of other buttons you can enable click here.
Select Your Location
There are four filter hooks for the placement of the TinyMCE buttons.
- mce_buttons – Primary toolbar (always visible)
- mce_buttons_2 – Advanced toolbar (can be toggled on/off by user)
- mce_buttons_3 – By default, WordPress does not use/display this toolbar (but toggles with mce_buttons_2)
- mce_buttons_4 – By default, WordPress does not use/display this toolbar (but toggles with mce_buttons_2)
Add Your Code
For this exercise I am going to create a third row (mce_buttons_3) just for my buttons.
You can install the My Custom Functions plugin and add your code there or open your functions.php file in your theme/child theme folder. Copy and paste the following code to the bottom and Save. Clear any caching if you do not see them appear in your editor.
*Tip: Adding to your theme will only be usable with your theme. Adding via My Custom Functions, you will still have access to them if you change your theme.
https://gist.github.com/cre8tivediva/6be63b85e494b7bf12c7df640e93cb10#file-functions-php
Want to enable them on Row 2?
Just change the filer to “mce_buttons_2“.
Can I enable these to the new Text Widget?
Unfortunately not. I was able to find a post here where the question was asked in Gutenberg. You can read and follow the links in that communication for updates on that.
