Custom Tiny MCE Buttons

screen-shot-2016-10-07-at-4-19-25-pm
screen-shot-2016-10-07-at-4-19-31-pm
screen-shot-2016-10-07-at-4-20-38-pm
screen-shot-2016-10-07-at-4-20-45-pm
add_action( 'after_setup_theme', 'wpse3882_after_setup_theme' );
function wpse3882_after_setup_theme()
{
    add_editor_style();
}

add_filter('mce_buttons_2', 'wpse3882_mce_buttons_2');
function wpse3882_mce_buttons_2($buttons)
{
    array_unshift($buttons, 'styleselect');
    return $buttons;
}

add_filter('tiny_mce_before_init', 'wpse3882_tiny_mce_before_init');
function wpse3882_tiny_mce_before_init($settings)
{
    $settings['theme_advanced_blockformats'] = 'p,h2,h3,h4';

    // From http://tinymce.moxiecode.com/examples/example_24.php
    $style_formats = array(
        array('title' => 'Link With Icon', 'selector' => 'a', 'classes' => 'cta-link')
    );
    // Before 3.1 you needed a special trick to send this array to the configuration.
    // See this post history for previous versions.
    $settings['style_formats'] = json_encode( $style_formats );

    return $settings;
}

Leave a Reply

Your email address will not be published.