TinyMCE Anchor Button not showing

by

I’m using this filter and function to display a custom, stripped-down version of the TinyMCE editor. Everything works as it should…except the ‘Anchor’ button will not show (‘anchor’)? According to the TinyMCE website (http://www.tinymce.com/wiki.php/Controls), that is the control to use.

Does anyone know why the anchor button will not show?

enter image description here

EDIT: the code example comes from here (this shows the full code I am using, not just the snippet below): https://gist.github.com/mrwweb/9937127

add_filter( 'mce_buttons', 'wpse_mce_buttons_1' );
function wpse_mce_buttons_1( $buttons ) {
    $buttons = array( 'styleselect', 'bold', 'italic', 'link', 'unlink', 'bullist', 'numlist', 'table', 'anchor');

    return $buttons;
}
add_filter( 'mce_buttons_2', 'wpse_mce_buttons_2' );
function wpse_mce_buttons_2( $buttons ) {
    $buttons = array();
    return $buttons;
}

2 Answers
2

I had the exact same problem and found the solution to this.

The problem is that the anchor plugin for TinyMCE is not being included as part of the default WordPress install. So while WordPress says to include:

$buttons[] = 'anchor';

…that’s not going to work because the TinyMCE plugin for anchors isn’t there.

If you go to TinyMCE’s website, you can download the full package directly. Once you have it, you’ll want to move /js/tinymce/plugins/anchor/ into your WordPress install at /wp-includes/js/tinymce/plugins/.

Basically, you want to have /wp-includes/js/tinymce/plugins/anchor/ in your install.

Once that’s available, you need to add a function that tells TinyMCE to look for that plugin (either in your theme’s functions.php or added to a plugin):

function my_mce_external_plugins($plugins) {

    $plugins['anchor'] = '/wp-includes/js/tinymce/plugins/anchor/plugin.min.js';
    return $plugins;
}
add_filter('mce_external_plugins', 'my_mce_external_plugins');

And now it will be available for the button to be added to the visual editor:

function extra_editor_buttons($buttons) {
    $buttons[] = 'anchor';
    $buttons[] = 'superscript';
    $buttons[] = 'subscript';
    return $buttons;
}
add_filter("mce_buttons_2", "extra_editor_buttons");

Et voilà:

Wordpress Visual Editor, Now With Anchor Button

This solution was inspired by this related question which was about the code button in TinyMCE, but had the exact same solution (the plugin was missing). Both anchor and code plugins are missing and there is an open bug to add the files, so maybe this won’t be an issue in future versions.

Hopefully this can help someone else as well!

Leave a Comment