Conception de la page WordPress: Modèles de pages Shortcodes V
Personnalisation du thème WordPress: comparaison du modèle de page et du code court
WordPress a une position dominante dans la conception Web avec ses fonctionnalités puissantes et sa flexibilité. De nombreuses conceptions de pages étonnantes sont dérivées des capacités de personnalisation du thème de WordPress, et les modèles de pages et les shortcodes jouent un rôle clé. Cet article explorera ces deux technologies en profondeur pour vous aider à choisir celui qui convient le mieux à vos besoins.
Points de base
- WordPress implémente principalement la conception de la page personnalisée via des modèles de page et des codes courts. Les modèles de page sont utilisés pour afficher les catégories, les articles et les pages dans le sujet par défaut; les codes courts sont des extraits de code réutilisables qui fournissent des fonctionnalités complexes et des options d'affichage.
- Lorsque vous devez personnaliser la page entière, vous devez donner la priorité au modèle de page;
- Les codes courts sont plus efficaces lorsque plusieurs pages nécessitent le même modèle de conception. L'ajout de shortcodes au plugin rend les modèles compatibles avec plusieurs thèmes.
- Choisissez un code court ou un modèle de page dépend de facteurs tels que la réutilisabilité, la dépendance, la portabilité et la facilité d'utilisation. Les codes courts conviennent à plusieurs fins, indépendamment des sujets;
Comment travailler dans la conception personnalisée
Chaque thème a son propre mécanisme pour implémenter la conception de page personnalisée. Il existe deux technologies principales:
Modèle de page
La rubrique par défaut contient des types de pages spécifiques utilisés pour afficher les catégories, les articles et les pages. Nous pouvons ajouter notre propre conception de pages à l'aide de modèles de page WordPress. Définissez simplement le nom du modèle en haut de la page. Le code suivant contient un modèle de page de base:
<?php /* Template Name: 我的自定义模板 */ get_header(); ?> <!-- 内容 --> <?php get_sidebar(); ?> <?php get_footer(); ?>
Code court
Les codes courts sont des extraits de code réutilisables qui agissent comme des raccourcis qui fournissent des fonctionnalités complexes et des options d'affichage. En règle générale, les modèles de conception de code court sont placés dans l'éditeur de page, et vous pouvez ajouter ou modifier les données nécessaires pour générer une conception personnalisée. L'image suivante montre un code court pour créer une conception d'onglet:
Comment intégrer la conception personnalisée dans la page?
Une page WordPress normale contient plusieurs sous-tempates telles que l'en-tête, la barre latérale, le contenu et le pied de page. Tout d'abord, jetons un coup d'œil à la structure de la page Web en utilisant l'écran suivant:
La page doit contenir l'en-tête, le pied de page et le contenu. La barre latérale est facultative et nous pouvons l'aligner à droite ou à gauche en fonction de nos préférences. Maintenant, voyons comment les conceptions personnalisées créées avec des codes et des modèles de page s'insèrent dans les pages ci-dessus.
Les codes courts peuvent être insérés dans l'éditeur de contenu dans la zone de création de la page du panneau d'administration. Par conséquent, toute conception générée à partir du code court ne s'applique qu'au contenu de la page. À moins que nous ne personnalisons le fichier de modèle, nous ne pouvons pas utiliser de code court pour créer des conceptions personnalisées pour l'en-tête, le pied de page et la barre latérale. Les modèles de page sont placés dans le sujet en tant que fichiers séparés. Par conséquent, nous pouvons personnaliser le fichier de modèle de page et ajouter un type de conception différent à chacun des quatre composants affichés dans l'écran ci-dessus.
Conclusion
Si vous avez besoin de personnaliser la page entière, vous devez hiérarchiser le modèle de page. Les codes courts conviennent pour ajouter des conceptions personnalisées à la zone de contenu principale.
Remplissez les données dans la conception personnalisée
Les développeurs de thème ne peuvent pas simplement créer des modèles avec des exemples de données, puis demander aux utilisateurs de gérer leurs propres données en modifiant le fichier source. WordPress est un système de gestion de contenu où les utilisateurs devraient pouvoir utiliser la zone de gestion pour remplir des données dans des conceptions personnalisées. WordPress offre la possibilité d'ajouter des données dynamiques à une page à l'aide de champs personnalisés. Cependant, les utilisateurs non techniques ne connaissent pas l'ajout de clés et de valeurs nécessaires aux champs personnalisés. Par conséquent, la plupart des concepteurs de thème utilisent le panneau Options du thème pour remplir des données dans des modèles de page prédéfinis. L'inconvénient de cette méthode est que chaque modèle de page ne peut avoir qu'une seule page. Autoriser les données sur plusieurs pages rendra le panneau d'option très complexe et difficile à gérer. Voici l'exemple du panneau d'options pour remplir des données sur la page d'accueil:
En revanche, il est beaucoup plus facile de remplir les données avec des codes courts. Dans l'éditeur TinyMCE, nous pouvons créer des boutons personnalisés pour insérer des codes courts. Après avoir cliqué sur le bouton, le code court sera placé dans l'éditeur de page et vous pouvez remplir le code court avec les données nécessaires au besoin. L'image suivante montre un éditeur de contenu avec des boutons shortcode pour générer des conceptions personnalisées:
Il s'agit de la méthode la plus couramment utilisée et efficace. Nous pouvons créer plusieurs pages en utilisant le même modèle de conception de raccourcis et remplir des données pertinentes que les attributs.
Conclusion
Les codes courts sont plus efficaces lorsque vous devez utiliser le même modèle de conception sur plusieurs pages.
Ajouter des conceptions personnalisées aux thèmes existants
Les thèmes avancés contiennent généralement un ensemble de modèles de page intégrés ou de conceptions de pages personnalisées. Mais supposons que nous voulons créer un nouveau modèle de conception qui n'est pas disponible par défaut. Examinons les solutions possibles à l'aide de shortcodes et de modèles de page.
Modèle de page
Nous pouvons créer un nouveau design comme modèle de page et le copier dans le dossier du thème pour fonctionner immédiatement. Chaque modèle de page est placé dans le dossier de thème actif. Une fois que nous modifions le thème, tout le contenu en utilisant notre nouvelle page de conception se bloque car il n'y a pas de modèle pour cette page dans le nouveau thème.
Code court
Dans ce cas, nous pouvons créer le nouveau design en tant que shortcode et l'utiliser pour les plugins au lieu de l'inclure dans le fichier de thème, ce qui nous permet de l'utiliser comme shortcode sur plusieurs thèmes.
Conclusion
Chaque fois que vous avez besoin d'un nouveau modèle de conception, créez un code court dans le plugin pour rendre le modèle compatible avec plusieurs thèmes.
Comment choisir les codes courts et les modèles de page
Dans la section précédente, nous avons discuté de trois aspects différents à considérer lors de la sélection d'un code court ou d'un modèle de page. Examinons maintenant certaines directives courantes pour nous assurer que nous utilisons ces technologies efficacement.
réutilisabilité
Les codes courts sont plus adaptés lorsque vous souhaitez utiliser le même modèle plusieurs fois. Les modèles de page conviennent plus à une seule page statique. Des pages telles que la page d'accueil, à peu près, sont utilisées comme pages indépendantes dans la plupart des cas. Par conséquent, les modèles de page conviennent à ces pages. Il est préférable de créer des pages dynamiques telles que les services, les portefeuilles, les projets, etc. comme modèles de raccourcis.
dépendance
Les shortcodes peuvent être utilisés comme composants indépendants du thème, tandis que les modèles de page reposent sur des thèmes et des styles. Si vous créez un modèle de conception commun, assurez-vous de le créer en tant que shortcode dans le plugin pour le rendre compatible avec les thèmes croisés.
porabilité
Les modèles de code court sont plus faciles à porter que les modèles de page. Vous pouvez placer les shortcodes n'importe où sur la page et peut être utilisé plusieurs fois. D'un autre côté, vous avez besoin d'une page complète pour utiliser la conception du modèle de page.
facile à utiliser
Les modèles de page sont fournis par le sujet. En tant qu'utilisateur, il vous suffit de sélectionner un modèle de page pour une page donnée. Le code court et les données nécessaires sont placés dans l'éditeur de contenu de la page. Par conséquent, il y a de fortes chances que vous supprimez le contenu par erreur. Dans ce cas, toutes les données avec une conception complète seront perdues. Par rapport aux codes courts, les modèles de page sont permanents et non sujets aux erreurs. Par conséquent, du point de vue d'un utilisateur, les modèles de page sont plus faciles et plus sûrs à utiliser.
Conclusion globale
Il n'y a pas de conclusion claire sur quelle méthode de conception de modèle personnalisée est meilleure. Dans la plupart des cas, cela dépend de la combinaison de divers facteurs mentionnés dans cet article. Vous devez prêter attention à la situation spécifique et choisir la méthode qui convient le mieux à la situation spécifique.
J'espère que mon analyse vous aidera à mieux comprendre la différence entre l'utilisation de codes courts et de modèles de pages, et quelle méthode est la meilleure pour votre propre conception de page personnalisée. Vous devriez maintenant pouvoir sélectionner un modèle de shortcode ou de page pour les trois scénarios suivants:
- Concevez une page à 3 colonnes sans barre latérale
- Concevoir une page publicitaire pour votre blog
- Concevoir une liste de prix pour afficher les prix des packages pour différents produits et services
Au plaisir de partager vos réponses et raisons dans la section des commentaires.
FAQ de conception de page WordPress: codes courts et modèle de page
- Quelles sont les principales différences entre les codes courts et les modèles de page dans WordPress?
Les codes courts et les modèles de page dans WordPress sont utilisés différemment. Les codes courts sont de petits morceaux de code qui peuvent être insérés dans vos messages et pages pour ajouter des fonctionnalités ou des éléments de conception spécifiques, tels que des boutons, des formulaires ou des curseurs. Les modèles de page, en revanche, sont des fichiers qui déterminent la disposition et la conception de pages ou de groupes de pages spécifiques sur un site Web WordPress. Ils peuvent être utilisés pour créer des dispositions uniques pour différentes parties d'un site Web, telles que des pages de portefeuille, des pages de blog ou des pages de contact.
- Comment créer des modèles de page personnalisés dans WordPress?
Pour créer un modèle de page personnalisé dans WordPress, vous devez créer un nouveau fichier PHP dans le répertoire de thème. Vous pouvez nommer ce fichier comme vous le souhaitez, mais il devrait se terminer avec ".php". En haut de ce fichier, vous devez inclure un commentaire que WordPress utilisera pour identifier ce fichier comme modèle de page. Ce commentaire devrait ressembler à ceci: /* Template Name: 我的自定义页面 */
. Après cela, vous pouvez ajouter toutes les fonctions HTML, PHP ou WordPress que vous souhaitez utiliser dans le modèle.
- Puis-je utiliser les shortcodes dans mon modèle de page personnalisé?
Oui, vous pouvez utiliser des codes shortcodes dans des modèles de page personnalisés. Pour ce faire, vous devez utiliser la fonction do_shortcode
fournie par WordPress. Cette fonction vous permet d'exécuter du code court dans un fichier PHP. Par exemple, si vous avez un shortcode qui affiche un formulaire de contact, vous pouvez l'inclure dans votre modèle de page comme ceci: echo do_shortcode('[contact-form]');
.
- Comment attribuer des modèles de page personnalisés aux pages dans WordPress?
Pour attribuer un modèle de page personnalisé à une page dans WordPress, vous devez modifier la page à laquelle vous souhaitez attribuer un modèle. Dans l'éditeur de page, recherchez la zone Propriétés de la page à droite. Dans cette case, vous verrez un menu déroulant marqué "modèle". Cliquez sur ce menu et sélectionnez le modèle que vous souhaitez utiliser. Ensuite, enregistrez vos modifications et affichez votre page pour voir le nouveau modèle.
- Puis-je utiliser à la fois des codes shortcodes et des modèles de page sur la même page?
Oui, vous pouvez utiliser à la fois les raccourcis et les modèles de page sur la même page. Vous pouvez insérer des codes courts dans le contenu de la page et utiliser des modèles de page pour contrôler la disposition globale et la conception de la page. Cela vous offre beaucoup de flexibilité dans la conception et la construction de pages.
- Quelles sont les restrictions sur l'utilisation de codes courts ou de modèles de page?
La principale limitation de l'utilisation de codes courts est que si vous avez de nombreux codes courts sur votre site Web, ils peuvent parfois être difficiles à gérer. Si vous modifiez le thème ou désactivez le plugin qui fournit des shortcodes, le shortcode ne fonctionnera plus et sera visible sur votre site Web. Les modèles de page, en revanche, sont spécifiques au sujet. Si vous modifiez le thème, vous devez recréer le modèle de page dans le nouveau thème.
- Puis-je créer un modèle de page personnalisé sans écrire de code?
Oui, il existe plusieurs plugins WordPress qui vous permettent de créer des modèles de page personnalisés sans écrire de code. Ces plugins fournissent une interface glisser-déposer que vous pouvez utiliser pour concevoir des modèles de page. Certaines options populaires incluent Elementor, Beaver Builder et Divi.
- Comment mettre à jour les modèles de page personnalisés?
Pour mettre à jour le modèle de page personnalisé, vous devez modifier le fichier PHP du modèle dans le répertoire de thème. Apporter les modifications requises et enregistrer le fichier. Des modifications seront appliquées à toutes les pages à l'aide du modèle.
- Puis-je utiliser des shortcodes dans mon gadget?
Oui, vous pouvez utiliser des codes courts dans vos gadgets. Pour ce faire, ajoutez simplement le widget texte à votre zone de widget et insérez votre raccourci dans la zone de contenu du widget.
- Comment créer des shortcodes dans WordPress?
Pour créer un code court dans WordPress, vous devez ajouter la fonction au fichier functions.php du thème ou au plugin personnalisé. Cette fonction doit utiliser la fonction add_shortcode
fournie par WordPress pour enregistrer de nouveaux codes short. La fonction add_shortcode
prend deux paramètres: le nom du code court et la fonction de rappel qui définit la fonction de code court.
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

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.

Undress AI Tool
Images de déshabillage gratuites

Clothoff.io
Dissolvant de vêtements AI

Video Face Swap
Échangez les visages dans n'importe quelle vidéo sans effort grâce à 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

Les blogs sont la plate-forme idéale pour que les gens expriment leurs opinions, opinions et opinions en ligne. De nombreux débutants sont impatients de créer leur propre site Web, mais hésitent à s'inquiéter des obstacles techniques ou des problèmes de coûts. Cependant, comme la plate-forme continue d'évoluer pour répondre aux capacités et aux besoins des débutants, il commence maintenant à devenir plus facile que jamais. Cet article vous guidera étape par étape comment créer un blog WordPress, de la sélection de thème à l'utilisation des plugins pour améliorer la sécurité et les performances, vous aidant facilement à créer votre propre site Web. Choisissez un sujet et une direction de blog Avant d'acheter un nom de domaine ou d'enregistrer un hôte, il est préférable d'identifier les sujets que vous prévoyez de couvrir. Les sites Web personnels peuvent tourner autour des voyages, de la cuisine, des critiques de produits, de la musique ou de tout passe-temps qui suscite vos intérêts. Se concentrer sur les domaines qui vous intéressent vraiment peuvent encourager l'écriture continue

Il existe quatre façons d'ajuster la liste des articles WordPress: utilisez des options de thème, utilisez des plugins (tels que l'ordre des types de publication, la liste des publiques WP, des trucs boxy), utilisez du code (ajoutez des paramètres dans le fichier functions.php), ou modifiez directement la base de données WordPress.

Voulez-vous savoir comment afficher les catégories d'enfants sur la page des archives de la catégorie parent? Lorsque vous personnalisez une page d'archive de classification, vous devrez peut-être le faire pour le rendre plus utile à vos visiteurs. Dans cet article, nous vous montrerons comment afficher facilement les catégories d'enfants sur la page des archives de la catégorie parent. Pourquoi les sous-catégories apparaissent-elles sur la page des archives de la catégorie des parents? En affichant toutes les catégories d'enfants sur la page des archives de la catégorie parent, vous pouvez les rendre moins génériques et plus utiles aux visiteurs. Par exemple, si vous exécutez un blog WordPress sur les livres et que vous avez une taxonomie appelée "thème", vous pouvez ajouter une sous-taxonomie telle que "roman", "non-fiction" afin que vos lecteurs puissent

Récemment, nous vous avons montré comment créer une expérience personnalisée pour les utilisateurs en permettant aux utilisateurs d'enregistrer leurs publications préférées dans une bibliothèque personnalisée. Vous pouvez porter des résultats personnalisés à un autre niveau en utilisant leurs noms à certains endroits (c'est-à-dire des écrans de bienvenue). Heureusement, WordPress facilite l'obtention d'informations sur les utilisateurs connectés. Dans cet article, nous vous montrerons comment récupérer des informations liées à l'utilisateur actuellement connecté. Nous utiliserons le get_currentUserInfo (); fonction. Cela peut être utilisé n'importe où dans le thème (en-tête, pied de page, barre latérale, modèle de page, etc.). Pour que cela fonctionne, l'utilisateur doit être connecté. Nous devons donc utiliser

WordPress est facile pour les débutants de commencer. 1. Après se connecter à l'arrière-plan, l'interface utilisateur est intuitive et le tableau de bord simple fournit tous les liens de fonction nécessaires. 2. Les opérations de base incluent la création et l'édition de contenu. L'éditeur WYSIWYG simplifie la création de contenu. 3. Les débutants peuvent étendre les fonctions du site Web via des plug-ins et des thèmes, et la courbe d'apprentissage existe mais peut être maîtrisée par la pratique.

Dans le passé, nous avons partagé comment utiliser le plugin PostExpirator pour expirer les publications dans WordPress. Eh bien, lors de la création du site Web de la liste d'activités, nous avons trouvé ce plugin très utile. Nous pouvons facilement supprimer les listes d'activités expirées. Deuxièmement, grâce à ce plugin, il est également très facile de trier les publications par date d'expiration du post. Dans cet article, nous vous montrerons comment trier les publications par date d'expiration post-expiration dans WordPress. Code mis à jour pour refléter les modifications du plugin pour modifier le nom du champ personnalisé. Merci Tajim de nous avoir fait savoir dans les commentaires. Dans notre projet spécifique, nous utilisons des événements comme types de publication personnalisés. Maintenant

L'un de nos utilisateurs a demandé à d'autres sites Web comment afficher le nombre de requêtes et de temps de chargement dans le pied de page. Vous voyez souvent cela dans le pied de page de votre site Web, et il peut afficher quelque chose comme: "64 requêtes en 1,248 secondes". Dans cet article, nous vous montrerons comment afficher le nombre de requêtes et de temps de chargement de page dans WordPress. Collez simplement le code suivant partout dans le fichier de thème (par exemple Footer.php). requêtes

Cherchez-vous des moyens d'automatiser votre site Web WordPress et vos comptes de médias sociaux? Avec l'automatisation, vous pourrez partager automatiquement vos articles de blog WordPress ou vos mises à jour sur Facebook, Twitter, LinkedIn, Instagram et plus encore. Dans cet article, nous vous montrerons comment automatiser facilement WordPress et les médias sociaux en utilisant IFTTT, Zapier et Uncanny Automator. Pourquoi automatiser WordPress et les médias sociaux? Automatiser votre wordpre
