Les bases du PHP avec WordPress (2)

Nous avions vu les bases du PHP dans notre première partie concernant les bases de PHP avec WordPress.

Soyons honnête, nous n’avions pas du tout abordé le PHP interne à WordPress, je me suis contenté d’expliquer les fondements du langage. Nous allons à présent voir comment intégrer ce langage de manière propre à un site WordPress voire possédant l’extension WooCommerce.

Je pars donc du principe que vous avez un thème enfant, ce qui me semble être quelque chose d’absolument impératif si vous avez acheté un thème ou en utilisez un issu de la bibliothèque de WordPress. Nous allons aborder les points suivants :

J’aurais mon petit coup de cœur pour les thèmes de Kadence Theme, notamment Virtue ou Ascend, qui sont très élaborés. Si vous n’avez pas de thème enfant, créez-en un et revenez ensuite sur ce tutoriel.

En plus du tutoriel précédent, n’hésitez pas à vous former en visitant des sites comme OpenClassRoom (anciennement site du Zéro) ou des forums qui vous proposeront des exercices de plus en plus poussés.

Le functions.php d’un thème

L’avantage avec WordPress (comme son inconvénient) est que dans un seul fichier, nous pouvons modifier la quasi intégralité du CMS. C’est à la fois super pratique, mais dangereux, car une seule ligne de code peut planter l’intégralité de votre site ou boutique en ligne. Testez donc systématiquement votre code sur un WordPress en local, en développement, mais jamais en production.

Lorsque vous créez un thème enfant, ça n’est pas requis, mais veillez à mettre en place un fichier functions.php qui va vous permettre d’ajouter énormément de fonctionnalités qui à terme vous permettront :

• de booster votre boutique en ligne
• de vous passer de plugins en les intégrant directement au thème
• de sécuriser et de mettre à jour votre site

Démarrons par quelque chose de simple, sécuriser ce fichier

Sécuriser un functions.php

La toute première chose à faire est de bien sécuriser ce fichier. Démarrons notre code dans ce fichier avec ceci :

<?php
// Exit if accessed directly
if (!defined('ABSPATH')) {
    exit; // Exit if accessed directly
}

Ce code signifie que si la « constante » ABSPATH n’est pas définie (autrement dit si quelqu’un cherche à accéder à ce fichier en-dehors de WordPress), on « exit« , on coupe court à tout.

Ainsi, si depuis votre navigateur vous cherchez à accéder à ce fichier manuellement, rien à faire, c’est la page blanche.

Si d’aventure vous avez utilisé un plugin pour générer votre thème enfant, veillez à ce que ces lignes soient bien en place au plus haut de votre fichier, ou ajoutez-les manuellement. Nul ne doit pouvoir déclencher des fonctions PHP en-dehors du site et de son propriétaire.

WordPress : du PHP et des hooks

J’avais déjà abordé le sujet des hooks sur les CMS WordPress et Prestashop (retrouvez mon tutoriel en cliquant ici), mais je vais en reparler rapidement, pour WordPress uniquement.

Dans votre thème, vous pouvez trouver une foule de fonctions PHP, comme wp_head() par exemple. Certains thèmes affichent même des fonctions de ce type : do_action('ever_hook').

Un hook, clairement, c’est un emplacement sur lequel on peut « greffer » une fonction PHP, de manière à ce qu’à chaque fois que ce hook apparaît sur notre site, la fonction est déclenchée.

Par exemple, si je greffe une fonction sur le hook de WordPress wp_footer(), à chaque fois que le footer de mon site apparaîtra, la fonction sera déclenchée (en somme, sur toutes les pages de mon site, puisque le footer est véritablement partout).

Via un functions.php, nous créons donc une fonction, puis nous la greffons sur un hook précis. Si je veux afficher « Hello World ! » dans le pied de page de mon site, j’ajoute ceci dans mon functions.php :

function helloWorld()
{
    echo 'Hello World !';
}
add_action('wp_footer', 'helloWorld');

Si je lis le code ci-dessus, en premier je crée ma fonction helloWorld(). Nous sommes bien d’accord qu’elle est créée mais ne fait strictement rien, puisque nulle part pour le moment je ne l’utilise.

Juste en-dessous de ma fonction, j’utilise la fonction native de WordPress add_action() qui me permet de donner l’ordre à WordPress de déclencher ma fonction à un emplacement précis du site, à savoir wp_footer. Cette ligne signifie donc « ajoute au wp_footer l’action helloWorld« . Et chaque fois que le hook wp_footer apparaît sur une page du site, la fonction se déclenche.

Difficile de vous lister tous les hooks de WordPress, s’autant plus que les thèmes en ajoutent. Pour un développeur WordPress, un bon thème dispose de beaucoup de hooks, pour que l’on puisse ajouter autant de fonctions que l’on désire, là où on en a besoin.

Des fonctions utiles à mettre en place

L’avantage avec le code PHP bien pensé, c’est qu’une fois qu’on en dispose, on peut le réutiliser à convenance à grands coups de copier-coller ! J’aurais même tendance à comparer certaines fonctions à une « routine beauté WordPress » 🙂

Des mises à jour automatiques

Si vraiment votre site a bien été structuré, vous allez pouvoir automatiser les mises à jour de WordPress. Entendez par là qu’à chaque fois qu’un des thèmes en place, qu’un plugin, une traduction ou même le cœur de WordPress dispose d’une mise à jour, nous allons automatiquement la mettre en place, sans qu’aucune interaction de notre part ne soit requise.

Ici, le Codex de WordPress nous donne tout. Vous avez juste à ajouter ceci dans votre functions.php :

/**
* Auto Updates themes, translations and plugins
 */
add_filter( 'auto_update_core', '__return_true' );
add_filter( 'allow_minor_auto_core_updates', '__return_true' );
add_filter( 'allow_major_auto_core_updates', '__return_true' );
add_filter( 'auto_update_plugin', '__return_true' );
add_filter( 'auto_update_theme', '__return_true' );
add_filter( 'auto_update_translation', '__return_true' );

Ces « filtres » WordPress vont automatiquement mettre à jour l’intégralité de votre site, de vos plugins, vos thèmes, vos traductions, à chaque fois qu’il y a une mise à jour disponible, sans que vous n’ayez rien à faire.

L’avantage est bien évidemment le gain de temps indéniable ! Si à terme vous avez comme moi dépassé les 200 sites en ligne, vous n’avez probablement aucune envie de tous les mettre à jour manuellement, un par un…

L’inconvénient est que si vous avez utilisé des thèmes ou des plugins qui ne sont plus maintenus, tôt ou tard c’est le crash assuré ! Veillez donc à utiliser des thèmes qui seront mis à jour de manière fréquente et sur du long terme, et à utiliser des plugins populaires pour disposer d’une garantie de suivi. Je n’ai cependant à ce jour jamais eu de crash de site avec une mise à jour automatique.

Un peu plus de sécurité avec le functions.php

Maintenant, nous allons voir comment améliorer encore la sécurité de notre site WordPress avec quelques fonctions utiles. Souvent, ces fonctions dépendent de ce que le propriétaire du site va faire, il faudra donc en ajouter ou pas, selon l’utilisation réalisée avec WordPress

Désactiver les flux RSS

Lorsque je demande aux gens s’ils savent ce qu’est un flux RSS, la majorité me répondent que non. Il s’agit en fait d’un fichier XML que WordPress génère nativement, et qui liste les dernières entrées de votre blog. Parfois (souvent même), les hackers et les robots se servent de ces flux RSS pour tenter de pénétrer dans votre site. D’autres sites par contre peuvent se servir de ces flux afin d’envoyer des messages sur les réseaux sociaux, ou dupliquer les données d’un site vers un autre…

Pas de blog ou aucune utilisation des flux RSS ? Retirons-les !

function wpb_disable_feed() {
    wp_redirect(get_bloginfo('url'));
} 
add_action('do_feed', 'wpb_disable_feed', 1);
add_action('do_feed_rdf', 'wpb_disable_feed', 1);
add_action('do_feed_rss', 'wpb_disable_feed', 1);
add_action('do_feed_rss2', 'wpb_disable_feed', 1);
add_action('do_feed_atom', 'wpb_disable_feed', 1);
add_action('do_feed_rss2_comments', 'wpb_disable_feed', 1);
add_action('do_feed_atom_comments', 'wpb_disable_feed', 1);

Retirer la version de WordPress

J’aime beaucoup les sites ou logiciels analysant le code source d’un site comme celui de la Team. Souvent les rapports sont erronés ou complètement à côté de la plaque, ce qui me fait bien rire.

Et c’est si simple de tromper ces robots !

/**
 * Remove WP Version
 */
function remove_version() {
return '';
}
add_filter('the_generator', 'remove_version');

Sur le filtre affichant dans le code source la version de WordPress utilisée, je ne mets plus rien 🙂

Pire encore, je pourrais mettre une autre version que celle que j’utilise, voire même une version inexistante, comme une version 124.83.90 !

Les fonctions PHP natives de WordPress

Lorsque les développeurs disent qu’il ne faut pas réinventer la roue, cela va très loin. WordPress dans son code vous fournit tout un tas de fonctions extrêmement utiles qui vous permettent de gagner du temps dans votre code.

Le Codex une fois de plus sera un excellent indicateur de ce qui est possible et de comment le faire. Par exemple, nous pouvons détecter dans une fonction PHP si nous sommes sur une page, un article de blog ou une catégorie de la sorte :

function whereAmI()
{
    if (is_category()) {
        echo 'je suis sur une catégorie';
    } elseif (is_single()) {
        echo 'je suis sur un article de blog';
    } elseif (is_page()) {
        echo 'et là je suis sur une page';
    } else {
        echo 'bah je suis ailleurs alors';
    }
}
add_action('wp_footer', 'whereAmI');

Selon la page sur laquelle vous vous rendez, le message qui s’affichera variera. Ces fonctions de WordPress sont utilisables à volonté, quand vous le désirez !

Certaines fonctions comme is_category() peuvent disposer de paramètres optionnels. Je peux savoir si je suis sur une catégorie très précise, comme is_category(3) qui me donnera un boolean true si la catégorie affichée est bien la numéro 3. Ces paramètres fonctionnent de la même manière pour is_single() et is_page().

WooCommerce a des fonctions similaires ! Si le plugin de e-commerce est installé et activé sur votre site, vous pouvez à présent utiliser des fonctions de ce type :

• is_product() si on est sur un produit
• is_product_category() si on est sur une catégorie de produits
• is_shop() si on est sur la boutique
• etc

Faites bien attention cependant, n’utilisez des fonctions de WooCommerce que si et seulement si l’extension est installée, ou idéalement testez cela avec cette condition :

if (class_exists('WooCommerce')) {
    // WooCommerce existe
}

Des fonctions de ce type, ajoutez-en selon vos besoins, à convenance. Au plus vous coderez vos besoins dans le functions.php, au moins vous aurez besoin de plugins, et au plus votre WordPress WooCommerce sera léger.

Du print sur WordPress WooCommerce

Pour ajouter un fichier CSS dédié à l’impression (lorsque l’on effectue CTRL + P), vous pouvez ajouter la fonction suivante dans votre thème enfant :

add_action( 'wp_enqueue_scripts', 'add_my_script' );
function add_my_script() {
    wp_enqueue_style( 'print',
        get_stylesheet_directory_uri() . '/assets/css/print.css',
        array(),
        '1.1',
        'print'
    );
}

Ici, nous greffons une fonction add_my_script() sur la position wp_enqueue_scripts.

Là où cette fonction est intéressante, c’est qu’elle utilise deux autres fonctions natives de WordPress.

• wp_enqueue_style() qui permet d’ajouter un fichier CSS et a besoin de paramètres (media, url, etc)
• get_stylesheet_directory_uri() qui retourne tout simplement l’URL du thème actif (et dans notre cas, l’URL du thème enfant)

Réfléchissons à ce que nous avions vu plus haut. Si nous pouvons utiliser is_single() – fonction native de WordPress me permettant de savoir si oui ou non nous sommes sur un article – je peux très bien alléger mon site en effectuant cet ajout de CSS uniquement sur les articles, comme ceci :

add_action( 'wp_enqueue_scripts', 'add_my_script' );
function add_my_script() {
    if (is_single()) {
        wp_enqueue_style( 'print',
            get_stylesheet_directory_uri() . '/assets/css/print.css',
            array(),
            '1.1',
            'print'
        );
    }
}

Ou a contrario, je peux dire au contraire « si nous ne sommes PAS sur un article » en effectuant une négation PHP grâce à un point d’exclamation :

add_action( 'wp_enqueue_scripts', 'add_my_script' );
function add_my_script() {
    if (!is_single()) {
        wp_enqueue_style( 'print',
            get_stylesheet_directory_uri() . '/assets/css/print.css',
            array(),
            '1.1',
            'print'
        );
    }
}

Et vous pouvez de la sorte constater la négation !is_single() qui me sert à inverser la condition.

Du Jquery sur WordPress – WooCommerce

Nous allons ajouter un simple script Jquery pour faire tomber de la neige sur notre site ! Voici la fonction à ajouter :

add_action( 'wp_enqueue_scripts', 'add_my_script' );
function add_my_script() {
    wp_enqueue_style( 'print',
        get_stylesheet_directory_uri() . '/assets/css/print.css',
        array(),
        '1.1',
        'print'
    );
    wp_enqueue_script(
        'theme_js',
        get_stylesheet_directory_uri().'/assets/js/flurry.js',
        array( 'jquery' ),
        '1.0',
        true
    );
    wp_enqueue_script(
        'theme_js',
        get_stylesheet_directory_uri().'/assets/js/custom.js',
        array( 'jquery' ),
        '1.0',
        true
    );
}

Nous retrouvons bien l’appel au fichier CSS de print.css que nous avons réalisé plus haut, à nous de ranger proprement un fichier custom.js et un autre fichier flurry.js

Ainsi que cela est indiqué dans ma fonction, je range bien ces deux fichiers dans /wp-content/mon-theme-enfant/assets/js. Le fichier flurry.js, vous pouvez le récupérer ici, il s’agit d’un plugin Jquery plutôt sympa. Le fichier custom.js, il vous faudra le créer à la main et ajouter ceci dedans :

$ = jQuery.noConflict();
$( document ).ready( function() {
    $('body').flurry({
        character: "❄",
        color: "white",
        frequency: 1,
        speed: 3000,
        small: 1,
        large: 28,
        wind: 400,
        windVariance: 20,
        rotation: 90,
        rotationVariance: 180,
        startOpacity: 1,
        endOpacity: 0,
        opacityEasing: "cubic-bezier(1,.3,.6,.74)",
        blur: true,
        overflow: "hidden",
        zIndex: 9999
    });
});

Une fois le code enregistré, et ces deux fichiers Jquery bien ajoutés dans votre thème enfant (et surtout correctement rangés), allez voir la neige tomber sur votre WordPress WooCommerce 🙂

 Imprimer