La triche ultime de WordPress

WordPress devient rapidement un nom familier s’il ne l’est pas déjà. C’est partout, cette beauté bénigne, propulsant certains des meilleurs sites Web et applications Web que le monde ait jamais vus. Il s’agit d’une première plateforme de CMS et de blogues non seulement incroyablement polyvalente, mais aussi incroyablement facile à apprendre et à utiliser. Sinon, pourquoi WordPress gagnerait en popularité chaque jour qui passe?


Mais ce que vous voyez à la surface lorsque vous configurez et lancez WordPress n’est qu’une petite fraction de ce qui se passe dans les coulisses. En fait, la belle interface utilisateur que nous aimons tous n’est rien comparée au tumulte de l’activité dans les coulisses. Ce que je veux dire, c’est que WordPress fonctionne sur deux technologies Web quelque peu compliquées appelées PHP et MySQL.

Les autres technologies qui jouent un rôle incluent JavaScript, c’est le proche cousin jQuery, CSS et HTML. Les thèmes WordPress (et même les plugins) sont principalement écrits en PHP et s’appuient sur des bases de données MySQL pour fonctionner. Ils dépendent également des technologies Web susmentionnées. Toutes ces technologies doivent fonctionner ensemble.

Maintenant, en tant que débutant, vous ne comprendrez peut-être pas que pour que la plateforme, les thèmes et les plugins WordPress fonctionnent à l’unisson, les développeurs utilisent un ensemble de codes standardisés, autrement connus collectivement sous le nom de balises PHP. Ce sont ces codes que nous décrivons dans la publication d’aujourd’hui, vous montrant comment ils sont utiles. Nous allons en insérer quelques exemples quelque part ici pour faire bonne mesure, alors préparez-vous à vous éclater dans votre voyage de construction de thème!

Anatomie du thème

anatonmy-of-a-wordpress-theme

Un thème WordPress n’est tout simplement rien de plus que plusieurs fichiers PHP liés ensemble. Il est livré avec un fichier de feuille de style CSS qui est responsable de l’apparence de votre thème (et site). Mais revenons aux bases, un thème WordPress n’est que quelques fichiers PHP. Ci-dessus est un instantané d’un grand tuts + cheatsheet pour l’anatomie d’un thème WordPress. Pour créer un thème WordPress, vous aurez besoin des fichiers suivants:

  • header.php– Ce fichier modèle contient les informations d’en-tête qui apparaissent dans le section, et avant l’ouverture étiquette. Ici, vous ajoutez des métadonnées, le titre du site et un lien vers votre feuille de style CSS, entre autres.
  • index.php – Il s’agit du modèle de corps principal pour votre thème (ou site) WordPress. Son seul but est de rassembler les autres fichiers en les incluant à l’aide de balises de modèle (en savoir plus sur les balises de modèle dans un instant).
  • sidebar.php – Ceci est votre section de barre latérale. Vous pouvez placer des widgets, des catégories, des menus supplémentaires, un formulaire de recherche et tout ce que vous souhaitez
  • footer.php – Ceci est la section de pied de page. Ajoutez vos informations de copyright, liens RSS, widgets, liens, icônes sociales, etc.
  • page.php – Chaque fois que vous créez une page sur votre site WordPress, c’est le modèle responsable
  • single.php – Ce fichier modèle contient un seul article de blog
  • comments.php – Le modèle responsable des commentaires
  • 404.php – Le modèle affiché lorsque votre lecteur rencontre l’infâme erreur 404 introuvable
  • search.php –  Offre à vos lecteurs la possibilité de trouver du contenu sur votre site WordPress
  • searchform.php – Vous aurez besoin d’un formulaire de recherche pour offrir les fonctionnalités mentionnées ci-dessus, n’est-ce pas?
  • archive.php – Parce que trouver du contenu que vous avez publié en 2008 ne sera pas un problème
  • functions.php – Placez toutes les fonctions spéciales et même les plugins personnalisés ici. Cependant, pour la compatibilité entre les thèmes, il est conseillé d’ajouter du code personnalisé en tant que plugins autonomes. Vous pouvez ajouter des menus supplémentaires, activer des widgets et bien plus encore. Ce fichier vous donne tellement de pouvoir pour transformer votre site / thème WordPress comme vous le souhaitez.
  • style.css – Ce n’est pas un fichier de modèle PHP en tant que tel. Mais c’est le fichier où vous ajoutez vos styles CSS pour contrôler l’esthétique. Il est également livré avec l’en-tête d’informations pour votre thème WordPress.

Sans aucun doute, vous pouvez créer un thème avec moins de modèles, mais nous ne recommandons pas d’en prendre l’habitude. Après tout, vous avez juste besoin des 10 fichiers ci-dessus pour créer un thème WP standard. Treize n’est pas une grosse figure, maintenant? En un mot, votre index.php pourrait ressembler à quelque chose comme:



// Insérez le contenu principal ici, incluez la boucle



Passons à autre chose, parlons d’un extrait de code astucieux appelé la boucle.

La boucle

Dans certaines de nos précédentes publications, telles que le populaire didacticiel WordPress: comment créer un thème WordPress à partir de HTML, nous avons mentionné la boucle, bien qu’en passant. Alors, qu’est-ce qui fait de la boucle l’extrait populaire qu’elle est? Eh bien, sans ce morceau de code spécial, vous devriez coder manuellement chaque publication, ainsi que les extraits, dans votre thème WordPress. Vous le feriez à chaque fois que vous publiez un nouvel article.

L’effort et le temps que vous perdriez vous rendraient bleus et raides. L’empreinte carbone que vous laisseriez – après avoir travaillé à mort vous-même – déchirerait un trou de la taille de douze stades Yankee à travers la couche d’ozone. Eh bien, je suis en train d’étirer les faits (ou leur absence), mais vous iriez bonkers si vous codiez manuellement chaque publication sur votre site WordPress.

La boucle est un épargnant de vie. Jetez simplement l’extrait de code suivant n’importe où dans vos fichiers de modèle WordPress, et il répertoriera toutes les publications que vous avez jamais créées:

Nous utilisons généralement la boucle dans index.php pour afficher une liste de publications mais n’hésitez pas à expérimenter; ajoutez-le où vous voulez répertorier vos messages. De plus, ajoutez des balises HTML et PHP personnalisées dans la boucle pour personnaliser vos publications à votre guise. En parlant de tags, ce qui est disponible dans WordPress?

Inclure les balises

balises wordpress

Les balises d’inclusion de modèle sont simplement des codes PHP que vous utilisez dans n’importe quel fichier de modèle pour inclure (ou plutôt appeler) d’autres fichiers de modèle de votre dossier de thème WordPress. Voici de quoi nous parlons:

  • – Utilisez ceci dans index.php pour appeler (ou inclure) le fichier header.php. Il va chercher header.php et afficher son contenu dans index.php – c’est tout ce qui inclut un fichier.
  • – Comprend sidebar.php
  • – Inclut le fichier modèle footer.php
  • – Quiz rapide: Que pensez-vous de cette balise include??

Modèle de balises Bloginfo

Il existe une autre catégorie de balises de modèles que nous appellerons simplement des balises bloginfo. Ils jouent un rôle, qui est de récupérer des informations sur votre site WordPress dans la base de données. Il s’agit principalement des informations que vous fournissez à votre site WordPress dans votre zone d’administration via le Profil de l’utilisateur et Paramètres -> Général. Une fois les informations récupérées dans vos bases de données, ces balises s’afficheront alors sur votre site au fur et à mesure que vous les placerez.

Vous pouvez légèrement modifier la structure de bloginfo, de sorte qu’au lieu d’afficher simplement les informations récupérées, vous pouvez les utiliser (les informations) ailleurs dans votre code PHP. Comme c’est pratique? Plus d’informations à ce sujet dans un instant. Voici les balises bloginfo les plus courantes:

  •  – Cela affiche le titre de votre blog / site WordPress
  • – Cette balise de modèle affiche l’URL de votre blog
  •  – Cela affiche la description, ou plutôt le slogan, de votre blog.
  •  – Affiche le jeu de caractères utilisé pour coder votre site. La valeur par défaut est UTF-8
  •  – Cela montre l’URL de la feuille de style CSS de votre thème actif
  •  – Affiche la version de WordPress que vous utilisez
  •  – Affiche la langue de WordPress
  •  – Affiche l’URL du flux RSS 0.92
  • – Affiche l’URL du flux RSS 2.0

Il existe plusieurs autres balises bloginfo vous pouvez utiliser pour améliorer votre thème WordPress. Maintenant, à propos de cette petite modification de bloginfo dont nous avons parlé il y a quelques secondes. Jusqu’à présent, nous utilisons Modifions ceci pour: . Permettez-moi de décomposer les paramètres:

  • $ show  Il s’agit du mot clé que vous utilisez pour nommer les informations que vous souhaitez récupérer dans la base de données. Les exemples incluent «nom», «url», «description», «admin_email», etc.
  • $ filter – Cela vous permet simplement de filtrer les informations récupérées. Par défaut, il est défini sur «brut», ce qui signifie simplement que la valeur de $ show est renvoyée telle quelle. Si vous le définissez sur “display”, la valeur de $ show sera d’abord passée par la fonction wptexturize (). Ne vous inquiétez pas pour le moment cependant.

Voici un exemple: supposons que nous voulons récupérer et afficher votre slogan (description du site) qui ressemble à “Meilleurs thèmes WordPress Premium”, nous devrions d’abord récupérer ces informations à l’aide de cette balise …

… Qui charge la description du site dans $ site_description. Pour afficher la description de votre site sur votre site, utilisez ceci:

Cela vous donne: Votre slogan est: Les meilleurs thèmes WordPress Premium

Remarque: Il existe de nombreux autres types de balises de modèle qui vous permettent de faire bien plus avec votre site WordPress. Ils sont classés en différents ensembles à savoir balises générales, balises d’auteur, publier des vignettes, balises de catégorie, et lien Mots clés entre autres. Vous pouvez même les utiliser à l’intérieur de la boucle, alors oui, vous devriez vous amuser.

Feuille de style de thème

Nous avons mentionné style.css plus tôt. Encore une fois, pourquoi le fichier style.css est-il important? Premièrement, il fournit des détails sur votre thème. Ces informations vont dans l’en-tête de la feuille de style, ce qui aide à identifier le thème lors de la sélection dans la zone d’administration. En tant que tel, deux thèmes ne devraient pas avoir les mêmes détails dans leurs en-têtes de feuille de style. Voici un exemple d’en-tête de feuille de style:

/ *
Nom du thème: Votre nom de thème
URI du thème: https://www.yoursite.com/yourtheme
Auteur: votre nom
URI de l'auteur: https://www.yoursite.com/
Description: Ce thème WordPress est 100% réactif bla bla...
Version: 1.0
Licence: GNU General Public License V2 ou ultérieure
URI de licence: http://www.gnu.org/licenses/gpl-2.0.html
Tags: or, une colonne, barre latérale gauche, grille réactive, etc.
Domaine de texte: yourthemename
* /

Ces informations viennent en premier (ou tout en haut) dans style.css. À part cela, assurez-vous que:

  • Suivre Normes de codage CSS
  • Utiliser un CSS valide
  • Minimiser CSS
  • Ajoutez des styles faciles à imprimer
  • Style tous les éléments HTML

Dernières pensées

Cette feuille de triche n’est qu’une ressource rapide qui vous aidera à commencer à apprendre le développement de thèmes WordPress. À l’aide des balises et des extraits de code que nous avons partagés ici, vous pouvez rapidement développer un thème standard et l’améliorer sans vous ruiner. Bien sûr, vous devez continuer à apprendre le développement de thèmes WordPress, et pour cela, nous recommandons le Codex WordPress, tuts+, Threehouse, et ThemeShaper entre autres ressources réputées.

En dehors de cela, n’hésitez pas à partager vos conseils, astuces, extraits ou tout autre élément que vous avez en tête dans les commentaires ci-dessous. Nous aimerions savoir où et comment vous en apprendre davantage sur WordPress. À un de ces quatre!

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map