Créer des méta-boîtes WordPress maintenables

À l'heure actuelle, l'un des modèles de conception les plus courants - sinon la le modèle de conception le plus courant - utilisé dans le développement Web est celui de MVC (ou Modèle / Vue / Contrôleur), mais aussi populaire soit-il, ce n'est pas le seul moyen de construire les frameworks, fondations et autres bibliothèques.

Exemple concret: WordPress utilise le modèle de conception piloté par les événements pour alimenter son système de points d'ancrage. Et bien que les modèles de conception ne soient pas mutuellement exclusifs, vous êtes plus susceptible de reconnaître cette motif particulier parce que c'est ce qui rend WordPress aussi flexible qu'il est.

Pour être clair, cela ne signifie pas que d'autres modèles ne sont pas utilisés dans sa base de code (ou dans toute autre base de code d'application), ils risquent de ne pas être aussi facilement reconnaissables.

En plus de cela, les développeurs professionnels aspirent à écrire du code maintenable. Cependant, à mesure que la base de code vieillit et que de plus en plus de personnes intègrent leur travail dans la base de code, il devient de plus en plus difficile de maintenir le même niveau d'organisation, de clarté et de maintenabilité cohérent à mesure que le projet vieillit.

Toutes les idées ci-dessus s’appliquent à WordPress, que vous travailliez sur des thèmes, des plugins, des extensions ou un autre type de projet. Le fait est qu'il est important de vous assurer que vous suivez les normes et les conventions de codage définies pour la création de ces projets..

Disons que vous travaillez sur un plugin qui introduit une méta-boîte personnalisée. Cependant, il ne suffit pas d'introduire une boîte à méta. Au lieu de cela, il y aura la création de groupes d'options connexes.

C'est là que ça commence à devenir un peu plus difficile. Tout au long de cette série, nous allons, d’une manière ou d’une autre, écrire du code maintenable dans WordPress grâce à un exemple de plug-in qui introduit des boîtes de méta, diverses options et une navigation par onglets dans le tableau de bord WordPress..

Organiser les Meta Box

Lorsque vous planifiez comment planifier les options de vos boîtes de méta, vous disposez de deux options:

Introduire une seule méta-boîte par option
Introduisez une seule boîte à méta avec des onglets qui regroupent logiquement chaque option

Pour ceux qui ont utilisé WordPress pendant une longue période, vous êtes probablement habitué à voir la navigation par onglets dans le tableau de bord au moins dans une certaine mesure. Pour ceux qui sont curieux de savoir comment implémenter cela non seulement par programmation, mais maintenable manière, nous allons regarder comment faire cela à travers cette série.

Plus précisément, nous allons écrire un petit plugin WordPress qui introduit quelques champs, des options associées regroupées par onglets, puis quelques éléments supplémentaires pour montrer comment bien et sécuriser correctement enregistrer, assainir, et récupérer les données.

Où sommes-nous dirigés

Comme pour la majorité des articles de la série que j'écris, j'aime essayer de décrire ce que nous allons faire à un niveau élevé avant de passer au code. Cela aide à fournir une base conceptuelle de la direction que nous prenons et à décrire la série d'articles à venir ainsi que ce que nous allons faire au niveau du code..

Si rien d’autre, c’est un lieu de référence car nous continuons à progresser tout au long de la série..

Avant de regarder les grandes lignes, ce que je veux dire, c’est que la conclusion la plus importante de cet article est de noter la séparation des préoccupations et des préoccupations. Pourquoi nous avons choisi de faire les choses comme nous l'avons fait pour comprendre comment cela facilite la maintenabilité.

À cette fin, voici ce que nous examinons dans les prochains articles:

Jeter les bases du plugin
Définir toutes les options et les organiser en onglets
Mettre en œuvre proprement chacune des options et des onglets avec les mesures de sécurité
Tout voir en action

Comme pour tout ce qui est en développement, il est absolument essentiel de décomposer les éléments en composants plus petits. Pour le reste de cet article, nous allons donc examiner les étapes nécessaires pour pouvoir commencer à travailler sur un plugin qui introduit une méta-boîte. dans le type de post 'Post' standard.

Le squelette du plugin

Avant d'aller plus loin, configurons le répertoire de notre plugin. Cela devrait inclure les éléments suivants:

Un fichier pour amorcer le plugin
La classe du plugin principal
Compréhension de la manière dont les fichiers initiaux sont organisés
Un blanc LISEZMOI

Et, évidemment, nous devrions nous assurer que les répertoires sont bien organisés et que le code est clair.

Afin de rendre cela au moins un peu pratique, nous appellerons ce plugin "Commentaire de l'auteur" qui nous permet de partager quelques notes franches sur ce que nous pensions, utilisé et noté lors de la rédaction du message..

Nous pouvons choisir de le rendre public dans un prochain article en fonction de vos commentaires, mais pour le moment, nous prévoyons simplement de le laisser dans le backend.

Cela dit, commençons.

Débuter avec Commentaire de l'auteur

Préparer le répertoire

Ce que nous devons faire est de remplacer la structure de répertoires que nous utiliserons pour le projet. Vous verrez une capture d'écran pour cela ci-dessous, après quoi je décrirai le but de chaque répertoire..

La racine du répertoire comprend deux fichiers:

LISEZMOI.md qui est la norme LISEZMOI qui vient avec un plugin WordPress.
auteurs-commentary.php qui est responsable du démarrage effectif du plugin. Ceci est le fichier d'amorçage.

Ensuite, nous avons le répertoire admin. Ce répertoire comprend:

les atouts qui comprend des sous-répertoires pour nos fichiers JavaScript et CSS (nous utiliserons le CSS vanille tout au long de cette série.
classe-auteurs-commentary.php qui va être la classe principalement que encapsule une grande partie de nos fonctionnalités.
vues qui comprend un sous-répertoire nommé partiels. le vues annuaire sera responsable du rendu des onglets et de l’inclusion de tout le contenu de chaque onglet en fonction du partial. C'est le partiels répertoire inclure le contenu de chaque onglet.

Notez que nous pouvons ajouter des répertoires supplémentaires pour le plugin au fur et à mesure que la série avance. C'est-à-dire que cette structure est sujette à des modifications car nous allons probablement ajouter ou même déplacer un peu de contenu en fonction de la progression du plug-in, mais c'est la structure de base dont nous avons besoin pour commencer..

Créer les fichiers

Puisque nous avons la structure de répertoires de base et les fichiers nécessaires en place, nous sommes prêts à commencer à décomposer une partie du code. Notez que bien que le plugin soit fonctionnel du point de vue de l'activation, il ne fera rien avant que nous commencions à ajouter du code dans la prochaine série d'articles..

Cela dit, nous allons commencer par renseigner les fichiers nécessaires à la mise en place du plug-in dans le tableau de bord WordPress..

La première chose à faire est de renseigner l'en-tête du plug-in afin qu'il contienne le bloc de documentation nécessaire à WordPress pour afficher le plug-in dans le tableau de bord:

La dernière condition garantit que, si quelqu'un tente d'accéder directement au fichier, le script annule l'exécution..
Ensuite, nous devons nous assurer que le fichier de plug-in principal que nous avons démarré ci-dessus est conscient de la classe primaire créée à l'étape précédente. Pour ce faire, nous avons juste besoin d’un simple Demandez une fois déclaration.
Mais avant d'appeler Demandez une fois, nous avons besoin d'un fichier à inclure, non? À cette fin, sautons dans le admin sous-répertoire et dans le classe-auteur-commentary.php classe, nous ajouterons le code suivant.
Les commentaires sont explicites, mais je m'assurerai de décrire tout ce qui se passe après l'achèvement du bloc de code:
 * / class Author_Commentary_Admin / ** * L'ID de ce plugin. * * @since 0.1.0 * @access private * @var string $ name L'ID de ce plugin. * / nom privé $; / ** * La version de ce plugin. * * @since 0.1.0 * @access private * @var string $ version La version actuelle de ce plugin. * / version privée $; / ** * Initialise la classe et définit ses propriétés. * * @since 0.1.0 * @var string $ name Nom de ce plugin. * @var string $ version La version de ce plugin. * / public function __construct ($ name, $ version) $ this-> name = $ name; $ this-> version = $ version; 
Notez que dans le code ci-dessus, tout ce que nous avons vraiment fait - mis à part la documentation de notre classe, de nos propriétés et de notre constructeur - est de configurer un constructeur qui accepte $ name et un $ version paramètre.
Celles-ci seront utiles ultérieurement lors de l'importation de dépendances et de feuilles de style JavaScript. Pour l’instant, c’est tout ce dont nous avons besoin pour commencer.
Avec cela fait, nous pouvons revenir à auteurs-commentary.php et écrivez le code pour démarrer le plugin.
Tout d'abord, nous allons utiliser Demandez une fois pour importer la classe que nous venons de créer:
Ensuite, nous allons configurer une fonction simple et un appel de fonction pour lancer le processus:
Notez que nous ne définissons aucun hook dans ce fichier. Tout finira par résider dans le sous-paquetage - cela nous aide à séparer nos problèmes plus efficacement, ce qui rend le code plus facile à gérer, et nous permet de garder notre code aussi orienté objet que possible..
Notez que cela définit une fonction simple qui, lorsqu'elle est appelée dès que le plugin est activé, crée une instance du Auteur_Commentaire_Admin classe après avoir passé le nécessaire $ name et $ version paramètres.
Jeter les bases
À ce stade, tout le travail préparatoire a été fait pour nous aider à aller de l'avant avec notre plugin. Vous devriez pouvoir télécharger le fichier depuis GitHub, l’installer dans WordPress et l’activer..
Encore une fois, ceci n’affiche rien, mais il prépare la base de code pour le travail que nous commencerons dans le prochain article..
Si vous avez des questions au-dessus du code ci-dessus ou sur l’orientation de la série, n'hésitez pas à laisser un commentaire. sinon, je suis impatient de vous voir dans la prochaine tranche.



		
			
	   
	




Code