web-dev-qa-db-fra.com

Comment ajouter une classe aux balises ul créées par l'éditeur WordPress Tinymce?

Je souhaite définir un style spécial pour les balises ul créées par Tinymce uniquement, ce qui signifie uniquement pour les publications et les pages. Je n'ai trouvé que ce filtre tiny_mce_before_init avec un exemple sur la façon d'ajouter des options de style personnalisées à une liste déroulante de styles existante.

alors est-il possible d'ajouter une classe aux balises ul créées par l'éditeur WordPress?

csstinymceeditor
4
Pierre

C'est toujours une bonne idée de regarder Wordpress Codex avant de demander. Styles personnalisés TinyMCE

<?php
// 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' => 'Custom UL class', // Title to show in dropdown
            'selector' => 'ul', // Element to add class to
            'classes' => 'custom-ul-class' // 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' );

Dans l'éditeur: créez d'abord une liste non numérotée, puis appliquez le style.

Mise à jour après acceptation .

Si vous souhaitez ajouter une classe à tous les éléments <ul> ajoutés via TinyMCE, vous pouvez le faire avant d'insérer ou de mettre à jour la base de données:

<?php
add_filter('wp_insert_post_data', 'my_add_ul_class_on_insert');
function my_add_ul_class_on_insert( $postarr ) {
    $postarr['post_content'] = str_replace('<ul>', '<ul class="my-custom-class">', $postarr['post_content'] );
    return $postarr;
}

Réglez str_replace() fonction needle si les éléments <ul> ont déjà des attributs. Ou utilisez preg_replace() ici.

13
Max Yudin

Est-ce vraiment nécessaire? Essayez de modifier les pages.php et single.php de votre thème de manière à envelopper le the_content (); balise de gabarit avec un div de la classe ou de l'id spécifiée. Par ici:

...
<div id="post_content_from_tinymce">
<?php the_content(); ?>
</div>
...

Et utilisez cet identifiant dans votre feuille de style:

#post_content_from_tinymces ul{ ... }

Cela pourrait être envisagé dans la plupart des cas. Ajouter la possibilité d’ajouter une classe personnalisée à UL exigerait l’écriture d’un plugin tinyMCE et il faudrait tout de même cliquer sur un bouton supplémentaire pour définir le style à chaque fois que vous créez un article/une page.

3
david.binda