moxdev
3/24/2017 - 5:33 PM

Create custom MCE wysiwyg functions. Below example gives user the ability to create custom buttons and text color in wysiwyg.

Create custom MCE wysiwyg functions. Below example gives user the ability to create custom buttons and text color in wysiwyg.

/**
 * ADD STYLES TO WYSIWYG
 */
// Insert 'styleselect' into the $buttons array
function my_mce_buttons_2( $buttons ) {
    array_unshift( $buttons, 'styleselect' );
    return $buttons;
}
// Use 'mce_buttons' for button row #1, mce_buttons_3' for button row #3
add_filter('mce_buttons_2', 'my_mce_buttons_2');

function my_mce_before_init_insert_formats( $init_array ) {
    $style_formats = array(
		array(
            'title' => 'Button', // Title to show in dropdown
            'inline' => 'a', // Element to add class to
            'classes' => 'wysiwyg-btn' // CSS class to add
        ),
        array(
            'title' => 'Trajan', // Title to show in dropdown
            'inline' => 'span', // Element to add class to
            'classes' => 'cinzel' // CSS class to add
        )
    );
    $init_array['style_formats'] = json_encode( $style_formats );
    return $init_array;
}
add_filter( 'tiny_mce_before_init', 'my_mce_before_init_insert_formats' );


// EDITOR STYLES

function mm4_you_add_editor_styles() {
    add_editor_style( 'custom-editor-style.css' ); // add css to root
}
add_action( 'admin_init', 'mm4_you_add_editor_styles' );