WordPress : shortcode

Définition

Le shortcode (code court en français) est un code entre crochets à intégrer dans le contenu d’un site WordPress. Un code court fait appel à une fonction définie en PHP, appelée par WordPress au moment de la génération de la page.

générera par exemple une galerie photo. Beaucoup d’extensions les utilisent pour s’interfacer facilement avec le CMS.

Historique des shortcodes

Les shortcodes ont eu leur grande époque dans les années 2010, et ce n’était pas vraiment l’époque la plus sympa pour faire des sites WordPress. L’expérience utilisateur proposée n’était pas très compatible avec le grand public.

À cette époque tout le monde utilisait les codes courts : extensions mais aussi les thèmes premium. C’était l’époque avant la révolution Javascript et l’arrivée des constructeurs de pages.

Les shortcodes sont-ils encore utiles ?

Alors sont-ils toujours utiles ? Eh bien de moins en moins. L’objectif secret de WordPress est de s’en passer à terme, mais sans pour autant les rendre inutilisables : on pourra toujours les intégrer dans un contenu car WordPress se veut rétrocompatible avec les anciennes versions.

Mais pour un créateur d’extension, ça peut demander pas mal de travail supplémentaire, alors parfois, le shortcode reste encore l’approche la plus simple.

Pour déclarer un code court dans votre thème, mettez simplement le code qui va suivre dans functions.php. Dans une extension, il peut être placé dans n’importe quel fichier.

La création d’un shortcode est très simple puisqu’il suffit de le déclarer via la fonction add_shortcode :

<?php
function capitaine_shortcode_first_name( $atts ) {

if( ! is_user_logged_in() ) {
    return 'invité'; 
}

$current_user = wp_get_current_user();

return $current_user->user_firstname;

}
add_shortcode( 'prenom', 'capitaine_shortcode_first_name' );

// « Bonjour [prenom] » deviendra « Bonjour Maxime »

Dans le premier paramètre, on indique l’identifiant que l’on veut donner à son shortcode, dans mon cas [prenom]. Le deuxième paramètre est le nom de la fonction qui sera exécutée lorsque ce code court sera trouvé dans un contenu.

Dans cet exemple, on va simplement afficher le prénom de l’utilisateur connecté, ou « invité » le cas échéant.

Notez qu’on utilise pas echo, mais à la place on va retourner la valeur à afficher via return. C’est dû au fait que WordPress va injecter la valeur dans le contenu, qui ne sera affiché que plus tard, lors de la génération du template.

Exemple :

Pour afficher les dernières pages WordPress par date, tu peux utiliser une requête personnalisée avec WP_Query. Par défaut, WordPress trie les articles par date, mais pour les pages, il faut préciser quelques paramètres.

Voici un exemple de code à insérer dans un fichier de thème (ex: page.php, front-page.php, ou via un shortcode) :

<?php
$args = array(
'post_type' => 'page', // On cible les pages, pas les articles
'post_status' => 'publish',
'orderby' => 'date', // Tri par date
'order' => 'DESC', // Les plus récentes d'abord
'posts_per_page' => 5 // Nombre de pages à afficher (modifiable)
);

$query = new WP_Query($args);

if ($query->have_posts()) :
echo '<ul>';
while ($query->have_posts()) : $query->the_post();
echo '<li><a href="' . get_permalink() . '">' . get_the_title() . '</a> (' . get_the_date() . ')</li>';
endwhile;
echo '</ul>';
wp_reset_postdata();
else :
echo '<p>Aucune page trouvée.</p>';
endif;
?>

📎 À savoir :

  • post_type => 'page' cible uniquement les pages, et pas les articles de blog.
  • orderby => 'date' trie selon la date de publication.
  • posts_per_page => 5 peut être ajusté selon tes besoins.

Voici comment appeler cette routine dans WordPress, selon où tu veux afficher la liste des dernières pages :


1. Dans un fichier de thème PHP

Si tu veux l’afficher directement dans une page PHP de ton thème (comme page.php, front-page.php, sidebar.php, etc.), alors tu appelles simplement la fonction comme ça :

<?php 
            echo afficher_pages_par_date(); 

?>

2. Dans l’éditeur WordPress avec un shortcode

Si tu préfères l’utiliser dans une page WordPress, un article, ou un bloc Gutenberg, tu peux faire :

[pages_par_date]

3. Dans un widget (ex: barre latérale)

Tu veux l’afficher dans un widget Texte ? Aucun souci :

  1. Va dans Apparence > Widgets (ou via le personnalisateur).
  2. Ajoute un widget « Texte » ou « HTML personnalisé ».
  3. Colle ton shortcode :
[pages_par_date]

Assure-toi que les shortcodes sont bien activés dans les widgets. Si ce n’est pas le cas, ajoute ceci dans ton functions.php :

add_filter('widget_text', 'do_shortcode');

Src : https://capitainewp.io/formations/developper-theme-wordpress/shortcode/