Eine Möglichkeit besteht darin, dem Styleselect-Menü in MCE eine Klasse hinzuzufügen. Angepasst an die Codex-Seite "TinyMCE Custom Styles" müssen Sie zuerst die Stilauswahl zum Editor hinzufügen:
// 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');
Dadurch wird das neue Dropdown-Menü zum Editor hinzugefügt. Dann erstellen Sie Ihre benutzerdefinierten Stile:
// 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' => 'My Link Custom Class',
'selector' => 'a',
'classes' => 'my-custom-link-class'
)
);
// 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' );
Ab WordPress 3.9, das ein Upgrade auf TinyMCE 4.0 enthielt, ist die Stilauswahl wesentlich robuster und enthält diese selector
Regel, mit der Sie Stile definieren können, die nur auf Links angewendet werden können. Es ist ziemlich schön.
Mit dieser Lösung können Sie die benötigten Klassen vordefinieren und sicherstellen, dass keine Tippfehler oder andere Probleme auftreten.
Wie der Codex feststellt, lässt sich dies am besten mit einer guten editor-style.css
Datei kombinieren , die Ihre Stile direkt im Editor anwendet.