Code court de WordPress: Un outil puissant pour simplifier les fonctions du site
Cet article explorera WordPress Shortcodes, un moyen pratique et rapide de créer des fonctionnalités de site Web dynamiques et complexes. Le code court est comme pseudo-code, qui implémente les fonctions personnalisées via l'exécution de la fonction sans avoir besoin d'écrire du code PHP complexe.
Présentation du code court
WordPress Shortcode est un mécanisme efficace qui génère des éléments dynamiques et puissants avec juste une petite quantité d'entrée. Les développeurs créent généralement des fonctions de site Web via le code PHP, mais pour les utilisateurs non développeurs, il n'est pas convivial de faire fonctionner directement le code PHP. Le code court résout parfaitement ce problème, permettant aux utilisateurs de créer des fonctionnalités de site Web puissantes en utilisant un pseudo-code similaire aux macros. Une fois que le code court est appelé, il re?oit des paramètres (le cas échéant), puis exécute des fonctions personnalisées via des fonctions prédéfinies. Par exemple, vous pouvez créer un beau bouton en utilisant le shortcode [pretty_button]閱讀更多![/pretty_button]
.
Source du code court
Pour utiliser un code court, il doit d'abord être enregistré avec votre site Web. Les codes courts peuvent provenir des manières suivantes:
-
WordPress est livré avec un code court: WordPress lui-même contient des codes courts prédéfinis, principalement utilisés pour créer des éléments multimédias tels que des galeries, des titres, de l'audio et de la vidéo. Par exemple,
[video src="video-source.mp4"]
peut être intégré dans un lecteur vidéo. Pour plus d'informations, veuillez vous référer à la documentation officielle WordPress. -
Le thème est livré avec un code court: De nombreux développeurs de thèmes fourniront une série de codes courts pour améliorer la fonctionnalité du site Web. Ces codes courts peuvent créer des éléments interactifs, afficher le contenu de manière visuellement attrayante ou fournir des informations précieuses. Lors de l'achat d'un sujet, veuillez consulter la documentation fournie par le développeur pour en savoir plus sur les shortcodes inclus et comment les utiliser. Tous les sujets ne contiennent pas de codes short supplémentaires.
-
Le plugin est livré avec du code court: De nombreux plug-ins qui fournissent du contenu (tels que les formulaires, les curseurs, les éléments interactifs) sont livrés avec du code court. Ces codes courts sont généralement détaillés sur le site Web du développeur du plugin ou la bibliothèque de plugin WordPress. Par exemple, le shortcode
[woocommerce_cart]
du plugin WooCommerce peut afficher le panier.
Type de code court
Après avoir compris la source des codes courts, jetons un coup d'?il à deux types de codes courts:
-
Shortcode non fermé: Ce type de shortcode ne contient pas ou enveloppez un autre contenu, est une unité distincte similaire à la balise auto-cl?turée de HTML (par exemple
<br>
). Par exemple, le code court[gallery]
est utilisé pour afficher la galerie. -
Fermer le code court: Ces codes courts contiennent d'autres éléments ou contenus, avec des balises de démarrage et de fin. Par exemple, le shortcode
[big_and_bold]這是加粗加大的文本[/big_and_bold]
enveloppe le contenu dans la balise<span></span>
pour le style.
Créer un raccourci personnalisé
La création d'un raccourci personnalisé est relativement simple. Ajoutez le code au fichier add_shortcode($name, $callback_function)
du thème enfant (ne modifiez pas directement le fichier de thème parent!). functions.php
Définir la fonction de rappel La fonction de rappel
définit la fonction du code court et renvoie une valeur qui sera affichée à l'utilisateur final. La valeur peut être un texte simple ou une forme ou un curseur dynamique complexe. La fonction de rappel la plus simple est la suivante:
function my_shortcode_callback_function(){ return; }
Paramètres de fonction de rappel La fonction de rappel
peut recevoir trois paramètres:, $atts
et $content
. $tag
-
(Propriétés): un tableau associatif contenant des propriétés ou des paramètres pour les codes courts. Par exemple,
$atts
,[audio preload="auto" autoplay="true" loop="true"]
etpreload
dansautoplay
sont des attributs.loop
-
(Contenu): Pour les codes courts fermés,
$content
contient du contenu entre les balises de début et de fin.$content
-
(Nom de la balise): le nom du code court.
$tag
Utilisez la fonction shortcode_atts()
La fonction est utilisée pour fusionner les attributs par défaut et les attributs fournis par l'utilisateur pour simplifier le traitement des attributs: shortcode_atts()
function display_my_profession_callback($atts){ $values = shortcode_atts(array( 'profession_type' => 'other' ),$atts); // ... 處理 $values['profession_type'] ... }
Utilisez la fonction do_shortcode()
contenant d'autres shortcodes, utilisez la fonction $content
pour traiter les shortcodes imbriqués récursivement. do_shortcode($content)
Utilisez la fonction pour enregistrer un code court add_shortcode()
pour enregistrer un code court: add_shortcode($name, $callback_function)
add_shortcode('clear_content','clear_content_callback_function');
Résumé
La ma?trise des codes courts WordPress peut simplifier considérablement la création de fonctions de site Web, améliorer l'efficacité du développement et fournir aux utilisateurs non développeurs une expérience de personnalisation de site Web plus pratique.Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Outils d'IA chauds

Undress AI Tool
Images de déshabillage gratuites

Undresser.AI Undress
Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover
Outil d'IA en ligne pour supprimer les vêtements des photos.

Clothoff.io
Dissolvant de vêtements AI

Video Face Swap
échangez les visages dans n'importe quelle vidéo sans effort grace à notre outil d'échange de visage AI entièrement gratuit?!

Article chaud

Outils chauds

Bloc-notes++7.3.1
éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise
Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1
Puissant environnement de développement intégré PHP

Dreamweaver CS6
Outils de développement Web visuel

SublimeText3 version Mac
Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Sujets chauds

Lorsque vous gérez des projets WordPress avec GIT, vous ne devez inclure que des thèmes, des plugins personnalisés et des fichiers de configuration dans le contr?le de version; configurer des fichiers .gitignore pour ignorer les répertoires de téléchargement, les caches et les configurations sensibles; Utilisez des outils Webhooks ou CI pour réaliser un déploiement automatique et faire attention au traitement de la base de données; Utilisez des politiques à deux branches (principale / développement) pour le développement collaboratif. Cela peut éviter les conflits, assurer la sécurité et améliorer l'efficacité de la collaboration et du déploiement.

Utilisez les environnements de test WordPress pour assurer la sécurité et la compatibilité de nouvelles fonctionnalités, plug-ins ou thèmes avant d'être officiellement lancés et éviter d'affecter de vrais sites Web. Les étapes pour créer un environnement de test comprennent: le téléchargement et l'installation de logiciels de serveur local (tels que localwp, xAMPP), la création d'un site, la configuration d'une base de données et un compte administrateur, l'installation de thèmes et de plug-ins pour les tests; La méthode de copie d'un site Web formel dans un environnement de test consiste à exporter le site via le plug-in, à importer l'environnement de test et à remplacer le nom de domaine; Lorsque vous l'utilisez, vous devez faire attention à ne pas utiliser de données utilisateur réelles, à nettoyer régulièrement des données inutiles, à sauvegarder l'état du test, à réinitialiser l'environnement dans le temps et à unifier la configuration de l'équipe pour réduire les différences.

La clé pour créer un bloc Gutenberg est de comprendre sa structure de base et de connecter correctement les ressources avant et arrière. 1. Préparez l'environnement de développement: installez WordPress local, Node.js et @ wordpress / scripts; 2. Utilisez PHP pour enregistrer les blocs et définir la logique d'édition et d'affichage des blocs avec JavaScript; 3. Créer des fichiers JS via NPM pour que les modifications prennent effet; 4. Vérifiez si le chemin et les ic?nes sont corrects lors de la rencontre avec des problèmes ou utilisez une écoute en temps réel pour éviter la compilation manuelle répétée. Après ces étapes, un simple bloc Gutenberg peut être implémenté étape par étape.

Dans WordPress, lors de l'ajout d'un type d'article personnalisé ou de la modification de la structure de liaison fixe, vous devez rafra?chir manuellement les règles de réécriture. à l'heure actuelle, vous pouvez appeler la fonction flush_rewrite_rules () via le code pour l'implémenter. 1. Cette fonction peut être ajoutée au thème ou au crochet d'activation du thème ou du plug-in pour actualiser automatiquement; 2. Exécuter une seule fois lorsque cela est nécessaire, comme l'ajout de CPT, la taxonomie ou la modification de la structure de liaison; 3. évitez les appels fréquents pour éviter d'affecter les performances; 4. Dans un environnement multi-sites, actualisez chaque site séparément le cas échéant; 5. Certains environnements d'hébergement peuvent restreindre le stockage des règles. De plus, cliquer sur Enregistrer pour accéder à la page "Paramètres> Links épinglés" peut également déclencher une actualisation, adaptée aux scénarios non automatiques.

TosetupredirectSinwordPressusingthe.htaccessfile, locatethefileinyoursite’srootDirectoryandAdlecrectulesabovethe # BeginwordPressSection.

Pour implémenter la conception de thème WordPress réactive, utilisez d'abord des balises META HTML5 et Mobile-First, ajoutez des paramètres de la fenêtre dans Enditer.php pour vous assurer que le terminal mobile est affiché correctement et organiser la mise en page avec des balises de structure HTML5; Deuxièmement, utilisez la requête multimédia CSS pour réaliser l'adaptation de style sous différentes largeurs d'écran, les styles d'écriture en fonction du principe mobile d'abord, et les points d'arrêt couramment utilisés incluent 480px, 768px et 1024px; Troisièmement, traitez élastiquement les images et les dispositions, définissez la largeur maximale: 100% pour l'image et utilisez la disposition Flexbox ou Grid au lieu de la largeur fixe; Enfin, testez complètement les outils de développeur de navigateur et les appareils réels, optimiser les performances de chargement et assurer la réponse

UsingsmtpforwordPressEmailSimproveSDeliverability andreliabilitycompatedTotheDefaultPhpmail () function.1.smtpauthenticateswithyouremailServer, réducingspamplacement.2

TOINTEGRATETHIRD-PARTYAPISINTOWORDPRESS, SuivreSestesteps: 1.SelectasuitableAPiANDObtainCredentialSlikePikeySoroAuthTokensByregisterring et greepingthemSecure.2.choosebetweenpluginsforsimplicity orfistomcodeusingfunctionslise wp_reMote_get () pour le flexibilité.
