Travailler avec des classes, des modèles et des partiels dans WordPress

Quand je me suis assis pour commencer ce post, j’avais prévu d’écrire quelque chose de beaucoup plus impliqué que ce que je vais partager. Au départ, je voulais parcourir l’une des deux choses suivantes :

• Le guide complet pour configurer un environnement de développement,
• Intégration des outils de qualité de code dans PhpStorm

La première serait de se concentrer sur une variété d’autres choses dont j’ai parlé, de les lier toutes ensemble et d’avoir une référence définitive. Mais c’est quelque chose que je veux prendre le temps de mettre en place pour m’assurer que c’est bien fait.

Le second est celui que je pense être important mais je suis un peu dans une phase de transition avec certains de mes propres outils. Tant que ce n’est pas fait, je préfère ne pas écrire à ce sujet.

Même quand même, il y a toujours quelque chose à couvrir, n’est-ce pas? Alors aujourd’hui, j’ai opté pour quelque chose de plus simple: décomposer l’utilisation des classes, des modèles et des partiels dans les plugins WordPress à l’aide d’un exemple simple.

Classes, modèles et partiels dans WordPress

Pour ce sujet particulier, une question immédiate qui peut venir à l’esprit est simple: pourquoi s’embêter à en parler ?

Parce que nous sommes en 2018 et que nous voyons toujours un mélange grossier de PHP, CSS, balisage et JavaScript dans un seul fichier. Ce n’est pas pour frapper sur d’autres technologies qui le font par défaut (comme React). Je parle spécifiquement des plugins WordPress et de l’écriture de code maintenable de manière à ce qu’il soit facile [évidemment] à maintenir, écrire et lire.

Un exemple pratique

Disons que vous travaillez sur une page de sous-menu pour quelque chose qui va apparaître sous un menu personnalisé. Vous enregistrez votre page à l’aide de l’API WordPress :

<?php

public function addMenuPage()
{
    add_menu_page(
      'Acme Menu',
      'Acme Menu',
      'manage_options',
      'acme-custom-menu',
      array($this, 'display'),
      'dashicons-dashboard',
      30
    );

    add_submenu_page(
      'acme-custom-menu',
      'Acme Menu',
      'Acme Menu',
      'Acme Menu',
      'acme-custom-menu',
      array($this, 'display')
    );
}

Mais lorsque vous configurez une fonction de rappel pour afficher la page, vous n’utilisez pas la fonction pour mélanger toutes les différentes langues ensemble. Au lieu de cela, vous l’utilisez pour inclure un fichier.

<?php

public function display()
{
    include_once $this->pluginPath. 'views/acme-settings.php';
}

Notez que dans le fichier ci-dessus, je référence une propriété $this->pluginPath. Ceci est défini dans le constructeur de la classe afin que je puisse facilement accéder à la racine du plugin.

Quoi qu’il en soit, à quoi pourrait ressembler ce fichier ?

Un modèle et un partiel

Dans ce cas, je suppose que votre modèle est ce qui va fournir des informations à l’utilisateur et va demander sa contribution. Le partiel sera responsable de l’affichage d’un message de réussite, d’erreur ou d’avertissement à l’utilisateur.

Un modèle

Pour rester simple, je vais garder à la fois le modèle et le partiel aussi légers que possible. Dans ce cas, supposons que nous allons afficher une page, demander à l’utilisateur d’enregistrer une valeur, et si la valeur est enregistrée avec succès (et existe donc dans la table wp_options ), nous afficherons le message de réussite.

Ça signifie:

• le modèle affichera le titre de la page, les informations, la saisie et le bouton d’enregistrement,
• le partiel affichera le message de réussite si nécessaire.

Jetez un œil au code du modèle ci-dessous :

<?php
/**
 * Renders the settings page for the plugin.
 */
?>
<div class="wrap">
    <h1 class="wp-heading-inline"><?php echo get_admin_page_title(); ?></h1>
    <?php if ($this->showSuccessMessage()) { ?>
      <?php include_once 'partials/settings-saved.php'; ?>
    ?>
    <div id="acme-settings-schedule">
        <form id="acme-form" method="post" action="<?php echo esc_html(admin_url('admin-post.php')); ?>"">
            <!-- This is where your settings go. -->
            <p>
                <?php
                submit_button(
                    'Save',
                    'primary',
                    'acme-save-settings',
                    false
                );
                wp_nonce_field(
                    'acme-save',
                    'acme-save-nonce'
                );
                ?>
            </p>
        </form>
    </div>
</div>

Notez que, oui, il a une entrée, un bouton d’enregistrement et un nonce qui sont tous importants (mais au-delà de la portée de cet article) pour enregistrer des informations.

Mais notez également qu’il a une fonction d’assistance que j’utilise pour vérifier la présence d’informations enregistrées avec succès. Cette fonction réside dans la même classe responsable du rendu du modèle.

Partiel

Cela ressemble à ceci :

<?php

public function showSuccessMessage()
{
  return (false !== get_option('acme_custom_setting'));
}

Et le partiel résultant est très simple :

<?php
/**
 * Renders the success message if the option has been properly saved.
 */
?>

<div class="notice-success notice is-dismissible">
    <p>Your settings have been successfully saved.</p>
    <button type="button" class="notice-dismiss">
        <span class="screen-reader-text">Dismiss this notice.</span>
    </button>
</div>

Bien sûr, votre implémentation de la fonction peut varier. Le but n’est pas tant de montrer comment implémenter la fonction mais comment tirer parti d’une fonction pour vérifier les informations pour afficher un partiel.

Il y a plus (mais pas ici)

C’est peut-être quelque chose qui devrait être placé au début de l’article.

Pour être honnête, je pense que c’est l’une de ces choses où certains peuvent trouver plus utile de le voir dès le début (mais manquent alors de contexte du code) et d’autres trouvent cela plus utile à la fin car ils peuvent voir comment tout s’intègre ensemble.

Quoi qu’il en soit, j’espère que cela fournira finalement des éclaircissements sur la façon dont tout cela s’emboîte.

De plus, il y a beaucoup de place dans les endroits pour que des choses soient personnalisées telles que :

• vérifier que l’utilisateur a l’autorisation d’enregistrer,
• vérification de la valeur nonce,
• assainir et valider les données,
• déterminer ce qui constitue le succès, les avertissements et les erreurs.

Mais si je dois couvrir tout ce qui précède, nous envisageons un message extraordinairement long ou une longue série de messages. Ce n’est pas quelque chose contre quoi je suis, mais c’est aussi quelque chose qui ne vaut pas la peine à ce stade.

N’hésitez jamais à donner votre avis. Mais en attendant, j’espère que tout cela vous aidera à créer une base sur laquelle bâtir lorsque vous travaillerez sur votre prochain projet.