WordPress: Creation de Shortcode avancé

13/04/2008
Wordpress Allez aux commentaires

Si vous lisez régulièrement ce blog, vous savez ce que sont les Shortcode (Genre de bbcode personnalisable pour Worpress). Grâce au générateur vous êtes désormais capable de créer vos propres shortcode très facilement, qu'il y ai 1 ou5 attributs, du contenu ou pas, etc ...

Mais ce n'est pas tout, les shortcode peuvent être utilisés de façon plus poussée très simplement !

En effet, en regardant comment le shortcode galerie fonctionne, on s'aperçoit que selon l'attribut X qu'on lui donne, le code html généré sera completement différent ! L'astuce est pourtant simple, il suffit de coder différent type de résultats possible pour un attribut donné de votre shortcode et de changer le texte retourné selon tel ou tel cas !

Exemple 1 - retour différent selon l'attribut

Pour vous montrez ce qu'il en ai, je vais prendre l'exemple d'un shortcode pouvant servir à retourner un message d'avertissement sous forme de texte ou sous forme d'alert javascript !

Notre Shortcode ressemblera à ça:
[alert type="texte"]contenu[/alert]

L'attribut type pourras prendre 2 valeurs, "texte" ou "javascript".

Si l'attribut est "texte", alors on retournera la chaine suivante:

<p class="attention" style="padding:10px; background-color:#EFD1D2; border: 1px solid red">%content</p>

(Affichera un boite html au bord rouge et fond rose contenant le message)

Et si l'attribut est "javascript", on retourne:

<script type="text/javascript">alert("%content");</script>

(Affichera le message dans une boite javascript à cliquer)

Et si le type ne correspond à aucune des 2 valeurs, on retournera la chaine par défaut qui est "texte"

Voici donc à quoi va ressembler le code d'intégration du shortcode à mettre dans votre fichier functions.php

function sc_alert($atts, $content = null) {
        //on extrait l'attribut "type" on lui assigne la valeur par défaut "texte"
        extract(shortcode_atts(array(
                "type" => 'texte'
        ), $atts));
        if($type == "javascript"){//si l'attribut vaut "javascript"
                return '<script type="text/javascript">alert("'.$content.'");</script>';
        }else{// si l'attribut vaut autre chose que "javascript" (donc texte ou autre)
                return '<p class="attention" style="padding:10px; background-color:#EFD1D2; border: 1px solid red">'.$content.'</p>';
        }
       
}
add_shortcode("alert", "sc_alert");

Voilà, rien de bien sorcier. On vérifie si l'attribut "type" vaut "javascript", si oui on retourne l'alerte javascript, si pas on retourne l'alerte texte. De cette façon si vous écrivez [alert type="texte"]contenu[/alert] ou [alert]contenu[/alert], on retourne la version html de l'avertissement.

Exemple 2 - récupération d'informations de la BDD

Voici un autre exemple qui va récupérer un liste de billets sous forme de liens directement dans la BDD du blog ! On va avoir 2 attributs, un pour choisir la catégorie des billets à recuperer et l'autre pour limiter le nombre de résultats.

Notre Shortcode ressemblera à ça:
[liste nombre="5" cat=""]

L'attribut nombre correspond au nombre de liens que la liste devra renvoyer. Et l'attribut cat, si il est rempli, permet de limiter les résultats à une (ou des) catégorie en précisant son ID !

Voici donc à quoi va ressembler le code d'intégration du shortcode à mettre dans votre fichier functions.php

function sc_liste($atts, $content = null) {
        extract(shortcode_atts(array(
                "nombre" => '5',
                "cat" => ''
        ), $atts));
        //requete sur la BDD pour recuperr la liste de billet
        global $post;
        $myposts = get_posts('numberposts='.$nombre.'&order=DESC&orderby=post_date&category='.$cat);
        $retour='<ul>';
        foreach($myposts as $post) :
                setup_postdata($post);
             $retour.='<li><a href="'.get_permalink().'">'.the_title("","",false).'</a></li>';
        endforeach;
        $retour.='</ul> ';
        //on renvoi la liste
        return $retour;
}
add_shortcode("liste", "sc_liste");

Et voilà, [liste nombre="3" cat="1"] renverra les 3 derniers liens de la 1ère catégorie !

Conclusions

Les shortcode sont très souple, on peut facilement sortir un plugin en moins de 10 minutes tellement c'est simple ! Maintenant vous n'avez plus d'excuses ! Et vous pourriez même tenter de faire votre 1er plugin et m'en faire part ici 😉

-----

Articles relatifs

  • bruno bichet

    Merci pour cet article qui va certainement en inspirer plus d’un 😉

  • k-ny

    Thanks Bruno 😉

  • Pingback: 掌握WordPress的Shortcodes | 鹏博客()

  • Pingback: Geek is a Lift-Style. »Archive » Mastering WordPress Shortcodes()

  • Pingback: High Coupon Demo Theme » Wordpress Shortcodes: Advanced Using()

  • Salut,

    Est-ce que ces codes marchent encre avec la version 3.0 et plus de WordPress? Merci.