Taming Tiny MCE 4.0

As of WordPress 3.9 the version of the WYSIWYG (or “visual”) editor is Tiny MCE 4.0
this change caused the following functions.php insertion to stop working:

Pre WP 3.9 the code above would insert an extra drop-down called styles that would allow styles to be associated with selected text


But after upgrading the “styles” dropdown went missing!

After digging around, and especially reading this post I was able to reconstruct the function.

First insert the function drop-down

Then associate the styles with the drop-down

Now the interface will look like this:


There are a number of additional “buttons” that can be added beyond the formats drop-down …as described in these posts:
some of the buttons mentioned seem not to work any more such as ‘sub’, ‘sup’ & ‘anchor’
some have now been absorbed into the default Tiny MCE display such as ‘hr’& ‘cleanup’

Here is a sample insertion … note: the sequence of the elements will dictate the sequence of the display

Which will look like this to the user: