Comment ajouter des boutons supplémentaires a l’éditeur HTML de WordPress

Dans se mini tuto nous allons voir comment ajouter des boutons supplémentaires dans l’éditeur texte (HTML)  de WordPress, cette astuce vous permettra  d’ajouter rapidement des balises html ou un shortcode par exemple.

Le quicktags API de WordPress est assez simple à utiliser. Ouvrez votre fichier funtion.php de votre thème puis ajoutez le code suivant :

 

// Ajouter des boutons à l'éditeur html
function html_add_quicktags() {
    if (wp_script_is('quicktags')){
?>
    <script type="text/javascript">
    QTags.addButton( 'eg_paragraph', 'p', '<p class="style">', '</p>', 'p', 'Paragraphe style 1', 1 );
    QTags.addButton( 'eg_hr', 'hr', '<hr />', '', 'h', 'Ligne horizontale', 201 );
    QTags.addButton( 'eg_pre', 'pre', '<pre lang="php">', '</pre>', 'q', 'Balise php', 111 );
    </script>
<?php
    }
}
add_action( 'admin_print_footer_scripts', 'html_add_quicktags' );

 

Un autre exemple pour un shortcode :

// Ajouter des boutons à l'éditeur html
function shortcode_add_quicktags() {
    if (wp_script_is('quicktags')){
?>
    <script type="text/javascript">
    QTags.addButton( 'eg_shortcode', 'shortcode', '[shortcode]', '[/shortcode]', 'shortcode', 'Mon Shortcode', 1 );
    </script>
<?php
    }
}
add_action( 'admin_print_footer_scripts', 'shortcode_add_quicktags' );
0 0 votes
Évaluation de l'article
S’abonner
Notifier de
guest
1 Commentaire
le plus ancien
le plus récent le plus populaire
Inline Feedbacks
View all comments
Jordan Z.
Jordan Z.
2 années il y a

Bonjour,
merci pour ce bout de code qui fonctionne bien.
par contre est-il possible que le ou les boutons supplémentaires s’affiche aussi dans l’éditeur texte dans le mode VISUEL ? (dans mon cas uniquement en texte pour l’instant)