webworthydesign
11/20/2014 - 9:13 PM

TinyMCE Styles Dropdown for Content Editor

TinyMCE Styles Dropdown for Content Editor

// https://codex.wordpress.org/TinyMCE_Custom_Styles

// Callback function to insert 'styleselect' into the $buttons array
function my_mce_buttons_2( $buttons ) {
	array_unshift( $buttons, 'styleselect' );
	return $buttons;
}
// Register our callback to the appropriate filter
add_filter('mce_buttons_2', 'my_mce_buttons_2');

// Callback function to filter the MCE settings
function my_mce_before_init_insert_formats( $init_array ) {  
	// Define the style_formats array
	$style_formats = array(  
		// Each array child is a format with it's own settings
		array(  
			'title' => 'Orange Button',  
			'inline' => 'span',  
			'classes' => 'button small',
			'wrapper' => false,
		),
		array(  
			'title' => 'Disclaimer Text',  
			'block' => 'div',  
			'classes' => 'disclaimer',
			'wrapper' => true,
		),  
		array(  
			'title' => '⇠ Float Left',  
			'block' => 'div',  
			'classes' => 'left',
			'wrapper' => true,
		),
		array(  
			'title' => 'Float Right ⇢',  
			'block' => 'div',  
			'classes' => 'right',
			'wrapper' => true,
		),
	);  
	// Insert the array, JSON ENCODED, into 'style_formats'
	$init_array['style_formats'] = json_encode( $style_formats );  
	
	return $init_array;  
  
} 
// Attach callback to 'tiny_mce_before_init' 
add_filter( 'tiny_mce_before_init', 'my_mce_before_init_insert_formats' );