La puissante API Shortcode nous permet de créer des "extraits" et d'inclure un contenu spécial (tel que des fonctions PHP ou du code HTML complexe) dans nos messages. Il est extrêmement courant de créer des fonctions distinctes pour chaque shortcode, mais est-ce vraiment nécessaire? Dans cet article, nous allons voir comment utiliser plus d'un shortcode en construisant une seule fonction.
Les API font de WordPress l’un des systèmes de gestion de contenu les plus flexibles de tous. C’est la raison pour laquelle il existe des dizaines de milliers de plugins et de thèmes: La vaste communauté de WordPress est capable de faire en sorte que WordPress réalise des backflips et des cartwheels, grâce aux API de WordPress..
Parmi ces API, mon préféré est l'API Shortcode. Sa logique et sa validité sont remises en question, mais je crois fermement que l'utilisation de codes courts dans WordPress nécessite une courbe d'apprentissage facile. Une fois qu'ils ont appris ces quelques règles simples sur les paramètres et les balises d'ouverture / fermeture, même les utilisateurs novices peuvent utiliser des codes courts. Bien, ce n'est pas WYSIWYG, mais un débutant de WordPress aura peut-être plus de mal à nettoyer les dégâts s'il fait quelque chose de mal avec un éditeur WYSIWYG et détruit le code HTML. Plus facile de voir que le shortcode ne fonctionne pas, supprimez-le et tapez-le à nouveau.
Mais bien sûr, ce n'est qu'un avis de ma part. Revenons au sujet: nous construisons plusieurs codes courts avec une seule fonction!
Inutile de discuter des avantages de cette méthode - considérons cet exemple ridiculement long:
", 'last' =>"), $ atts)); if ($ class! = ") $ class =". $ classe; if ($ last = 'yes') $ last_class = 'last'; revenir ''. do_shortcode ($ content). ''; add_shortcode ('one_half', 'one_half_sc'); function one_third_sc ($ atts, $ content = null, $ tag) extract (shortcode_atts (tableau (// classes supplémentaires 'classe' => ", 'dernier' =>"), $ atts)); if ($ class! = ") $ class =". $ classe; if ($ last = 'yes') $ last_class = 'last'; revenir ''. do_shortcode ($ content). ''; add_shortcode ('one_third', 'one_third_sc'); function one_quarter_sc ($ atts, $ content = null, $ tag) extract (shortcode_atts (tableau (// classes supplémentaires 'class' => ", 'last' =>"), $ atts)); if ($ class! = ") $ class =". $ classe; if ($ last = 'yes') $ last_class = 'last'; revenir ''. do_shortcode ($ content). ''; add_shortcode ('one_quarter', 'one_quarter_sc'); function two_thirds_sc ($ atts, $ content = null, $ tag) extract (shortcode_atts (tableau (// classes supplémentaires 'classe' => ", 'dernier' =>"), $ atts)); if ($ class! = ") $ class =". $ classe; if ($ last = 'yes') $ last_class = 'last'; revenir ''. do_shortcode ($ content). ''; add_shortcode ('deux_thirds', 'deux_thirds_sc'); function three_quarters_sc ($ atts, $ content = null, $ tag) extract (shortcode_atts (tableau (// classes supplémentaires 'classe' => ", 'dernier' =>"), $ atts)); if ($ class! = ") $ class =". $ classe; if ($ last = 'yes') $ last_class = 'last'; revenir ''. do_shortcode ($ content). ''; add_shortcode ('three_quarters', 'three_quarters_sc'); ?>
Le même code (PHP et HTML) est utilisé maintes et maintes fois dans toutes les fonctions, à l'exception des différentes classes CSS. De plus, les attributs de chaque fonction sont les mêmes que ceux des autres fonctions. C'est juste difficile à lire. Venez y penser, si jamais nous devions changer une caractéristique de ces colonnes div
s, il faudrait changer les mêmes parties dans toutes les fonctions.
Et s'il y avait une variable pour récupérer le "tag" du shortcode? Pas si surprenant, la variable s'appelle tag $
et pourrait être utilisé dans nos fonctions. Il permet à nos fonctions de vérifier la balise du shortcode et de se comporter en fonction de la balise..
Pensez à l'exemple ci-dessus: s'il y a plus d'une fonction qui sert presque même fonctionnalité, il serait logique (et plutôt cool) d’avoir une fonction pour nos codes courts à utiliser.
J'ai proposé trois bons exemples d'utilisation de cette technique. Si vous pouvez en savoir plus en lisant le message, n'hésitez pas à partager vos impressions avec les autres utilisateurs dans la section commentaires ci-dessous.!
Dans l'un de mes premiers articles sur Wptuts +, j'ai expliqué comment utiliser un shortcode pour intégrer des vidéos de différents hébergeurs tels que YouTube, Vimeo et Dailymotion. Le code ressemblait à ceci:
'youtube', 'id' => ", 'w' => '600', 'h' => '370'), $ atts)); if ($ site ==" youtube ") $ src = ' http://www.youtube-nocookie.com/embed/ '. $ id; else if ($ site == "vimeo") $ src =' http://player.vimeo.com/video/ '. $ id; else if ($ site == "dailymotion") $ src = 'http://www.dailymotion.com/embed/video/'. $ id; else if ($ site == "yahoo" ) $ src = 'http://d.yimg.com/nl/vyc/site/player.html#vid='. $ id; else if ($ site == "bliptv") $ src = ' http://a.blip.tv/scripts/shoggplayer.html#file=http://blip.tv/rss/flash/ '. $ id; else if ($ site == "veoh") $ src = 'http://www.veoh.com/static/swf/veoh/SPL.swf?videoAutoPlay=0&permalinkId='. $ id; else if ($ site == "viddler") $ src = 'http: //www.viddler.com/simple/ '. $ id; if ($ id! = ") return''; add_shortcode ('vid', 'vid_sc'); ?>
Bien que ce soit encore une pratique pas si mauvaise (sauf le 6 sinon si
déclarations), nous pouvons maintenant utiliser un attribut de moins ('site
') et créez des codes courts séparés, comme ceci:
", 'w' => '600', 'h' => '370'), $ atts)); switch ($ tag) case" youtube ": $ src = 'http: //www.youtube-nocookie .com / embed / '; break; case "vimeo": $ src =' http://player.vimeo.com/video/ '; break; case "viddler": $ src =' http: //www.viddler .com / simple / '; break; case "dailymotion": $ src =' http://www.dailymotion.com/embed/video/ '; break; if ($ id! = ") return''; revenir; add_shortcode ('youtube', 'wptuts_embed_sc'); add_shortcode ('vimeo', 'wptuts_embed_sc'); add_shortcode ('viddler', 'wptuts_embed_sc'); add_shortcode ('dailymotion', 'wptuts_embed_sc'); ?>
Tu vois ce qu'on a fait? Nous avons fourni un tag $
paramètre pour notre fonction dans la première ligne (pour remplacer le "site
"attribut) et utilisé un commutateur
instruction conditionnelle (pour un code plus propre et de meilleure qualité). Le résultat pour les deux fonctions sera le même, sauf que vous pouvez utiliser [Youtube]
au lieu de [vid site = "youtube"]
à présent.
(Je n'ai pas utilisé certains des hôtes vidéo dans la deuxième fonction. Si vous devez ajouter d'autres hôtes, vous pouvez en ajouter autant "Cas
"comme tu veux.)
div
sAh, les colonnes… elles constituent la partie la plus importante d'une grille CSS et facilitent grandement l'adaptation de votre site Web, si elles prennent en charge des techniques de conception réactives. Vous pouvez les voir dans presque tous les thèmes WordPress sur ThemeForest et ils utilisent des codes abrégés… avec une pratique comme notre «exemple ridiculement long» au début de ce didacticiel..
Comme vous vous en souvenez, le code était presque identique dans les 5 fonctions de cet exemple. Ainsi, il serait incroyablement facile de les fusionner en une seule fonction et de laisser le tag $
travail variable sa magie:
"), $ atts)); if ($ class! =") $ class = ". $ class; $ last ="; // vérifie la balise shortcode pour ajouter une "dernière" classe if (strpos ($ tag, '_last')! == false) $ tag = str_replace ('_last', 'last', $ tag); $ output = ''. do_shortcode ($ content). ''; return $ output; add_shortcode ('one_half', 'wptuts_columns_sc'); add_shortcode ('one_half_last', 'wptuts_columns_sc'); add_shortcode ('one_third', 'wptuts_columns_sc'); add_shortcode ('one_third_last', 'wptuts_columns_sc'); add_shortcode ('one_quarter', 'wptuts_columns_sc'); add_shortcode ('one_quarter_last', 'wptuts_columns_sc'); add_shortcode ('deux_thirds', 'wptuts_columns_sc'); add_shortcode ('two_thirds_last', 'wptuts_columns_sc'); add_shortcode ('three_quarters', 'wptuts_columns_sc'); add_shortcode ('three_quarters_last', 'wptuts_columns_sc'); ?>
Plutôt chouette, non? Nous n'avons même pas eu besoin d'utiliser un commutateur
!
Nous dupliquons toujours les lignes tout en ajoutant les codes abrégés. Osez faire un pas de plus? Retirer le add_shortcode ()
lignes à remplacer par ceci:
Nous avons maintenant encore plus de code maintenable. Par exemple; si nous devions changer le nom de la fonction, nous ne changerions plus chaque ligne.
Avez-vous déjà eu besoin de répertorier des articles précédents (ou futurs) dans vos publications? Je fais certainement. Il existe de nombreux plug-ins qui fournissent des codes abrégés, mais la plupart d'entre eux nécessitent l'utilisation de tonnes d'attributs, ce qui peut donner lieu à des balises laides et complexes comme [posts cat = "5,6" author = "barisunver" status = "privé" postsperpage = "4" et = "ainsi de suite"]
.
Que diriez-vous que nous utilisons notre bien-aimé tag $
au lieu? Donnons un coup de feu:
ID $ post_author = $ post-> post_author; extraire (shortcode_atts (array ('number' => 5, 'exclude_current' => 'yes', 'orderby' => 'date'), $ atts)); $ args = "; switch ($ tag) case" latest_posts ": // nous n'avons pas besoin d'arguments pour récupérer les dernières publications :) break; case" category_posts ": $ categories = get_the_category ($ post_ID); $ first_category = $ categories [0] -> term_id; $ args = 'cat ='. $ première_catégorie; break; case "author_posts": $ args = 'author ='. $ post_author; break; cas "future_posts": $ args = 'post_status = future '; break; $ not_in =' & post__not_in [] = '. $ post_ID; if ($ exclude_current ==' no ') $ not_in = "; $ get_posts = get_posts ($ args. $ not_in. '& posts_per_page ='. $ number. '& orderby ='. $ orderby); $ output = '
Comme vous pouvez le constater, nous pouvons nous débarrasser de 3 attributs de shortcode possibles: "chat
","auteur
" et "post_status
". Vous pouvez toujours prolonger le Cas
s et ajouter de nouveaux codes courts avec cette fonction unique et relativement petite.
En tant que fan des codes courts WordPress, cette découverte du tag $
variable est un peu excitant pour moi. Il semble y avoir un énorme potentiel pour utiliser cette méthode.
Que penses-tu de cette technique? Postez vos commentaires ci-dessous et partagez vos impressions avec nous!