puis-je ajouter un format personnalisé à l'option de formatage dans le panneau de texte?

13

Dans l’éditeur de texte, où vous pouvez définir des en-têtes et d’autres paramètres, est-il possible d’ajouter vos propres styles aux clients? et même supprimer les inutiles?

    
posée Mild Fuzz 10.11.2010 - 15:42

2 réponses

17

L'éditeur "classique" de TinyMCE comporte deux listes déroulantes: formatselect pour styles de paragraphe et styleselect pour styles de caractère - qui peuvent également contenir des styles de paragraphe, pour créer c'est plus déroutant. La configuration dans WordPress par défaut n’affiche que la liste déroulante format . Si vous appliquez une feuille de style personnalisée à l'éditeur, TinyMCE peut l'utiliser pour choisir les noms de classe et les ajouter à la liste déroulante style - mais cela n'a pas fonctionné à chaque fois pour moi.

Depuis la version 3.0, vous pouvez appeler add_editor_style() dans votre functions.php pour ajouter une feuille de style à l'éditeur. Par défaut, il s'agit de editor-style.css dans votre répertoire de thèmes. Avant la version 3.0, vous devez vous accrocher au filtre mce_css pour ajouter l’URL à la feuille de style de votre éditeur. Cela se retrouvera dans la valeur de configuration content_css TinyMCE .

Pour ajouter la liste déroulante style , l'option styleselect doit apparaître dans l'un des tableaux de configuration de la barre de boutons ( theme_advanced_buttons[1-4] dans TinyMCE, filtré par mce_buttons_[1-4] dans WordPress). La liste des formats de bloc est contrôlée par l'option theme_advanced_blockformats de TinyMCE , que vous pouvez ajouter. dans le tableau de contrôle du filtre tiny_mce_before_init . Si vous souhaitez personnaliser les noms du menu déroulant style (pas uniquement vos noms de classe CSS), consultez l'option theme_advanced_styles . Vous pouvez également utiliser l'option style_formats plus avancée, qui vous permet de définir plus facilement les styles. .

Le code PHP approprié avec tous les points d'ancrage et la configuration par défaut est wp-admin/includes/post.php , dans la fonction wp_tiny_mce() . Dans l’ensemble, votre configuration pourrait ressembler à ceci:

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,h1,h2,h3,h4';

    // From http://tinymce.moxiecode.com/examples/example_24.php
    $style_formats = array(
        array('title' => 'Bold text', 'inline' => 'b'),
        array('title' => 'Red text', 'inline' => 'span', 'styles' => array('color' => '#ff0000')),
        array('title' => 'Red header', 'block' => 'h1', 'styles' => array('color' => '#ff0000')),
        array('title' => 'Example 1', 'inline' => 'span', 'classes' => 'example1'),
        array('title' => 'Example 2', 'inline' => 'span', 'classes' => 'example2'),
        array('title' => 'Table styles'),
        array('title' => 'Table row 1', 'selector' => 'tr', 'classes' => 'tablerow1'),
    );
    // 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;
}
    
réponse donnée Jan Fabry 10.11.2010 - 15:59
0

Selon ce qui est mentionné ici menu déroulant au format TinyMCE non afficher des aperçus de style plus longs

Kara avait raison, vous devez supprimer les styles par défaut pour voir les nouveaux styles ...

unset($init['preview_styles']);

return $settings;
    
réponse donnée user2136473 25.02.2016 - 22:36

Lire d'autres questions sur les étiquettes