Author: Malo

Qu’est ce que l’API REST WordPress

L’Api de WordPress est apparu en 2015 puis a été ajouter au core WordPress en 2016 avec la version 4.7. Cela peut sembler être un petit ajout basique mais l’Api de WordPress ouvre un grand nombre de nouvelles possibilitées sur les façons d’utiliser ce CMS. En effet depuis 2016 un grand nombre d’exemple ont démontré la puissance de cet outil.

Les différents usages de l’API

Du simple filtre AJAX à l’application mobile basé ou encore de nombreux exemples de “headless wordpress” en utilisant des outils comme Next.js ou encore Gatsby. Bref cette API apporte une nouvelle jeunesse à WordPress en offrant de multiples nouvelles façon d’utilise le CMS.

Comment personaliser l’api wordpress ?

Malgré tout ces avantages l’api de WordPress à des inconvénients. Et oui tout n’est pas parfait. Mon principal soucis avec l’Api est la quantité d’informations retourné pour un post ou custom post. Bien souvent vous n’allez pas avoir besoin de toutes ses informations mais uniquement une petit partie et donc dans un soucis de performance je vais vous apprendre a réduire la quantité d’informations et renvoyer uniquement le stricte nécessaire.

Comment créer un custom endpoint WordPress REST API ?

Prenons un exemple concret, mon Portfolio.

Mon portfolio est composé d’un custom post type (CPT) avec 2 customs taxonomies, la technologies utilisé ainsi que type de site web.
J’ai aussi étendu mon CPT à l’aide du plugin ACF pour ajouter des champs tel que le logo, le background utiliser pour la grille.

Après toutes ces explications rentrons dans le coeur du sujet, LE CODE!!!

Tout d’abord il faut ajouter une route personnalisé a L’API,

Pour cela il faut ajouter une action wordpress à l’initialisation de l’API

add_action('rest_api_init', maSuperfonction )

Puis dans votre super fonction ajouter la ou les routes que vous souhaité ajouter a votre api via la fonction register_rest_route().

Cette fonction prend en paramètres :

• le prefix de l’url de votre route qui doit être unique ('/nom-de-ma-route/v1')
• l’url de la route que vous souhaité ajouter avec les paramètre url ici j’ajoute la catégorie en paramètre ('project/cat=(?P<cat>[a-z0-9 ,\-]+)')
• un Array avec La/les methodes que vous souhaité autoriser (‘GET’) ainsi que votre callback ou vous définirez le contenue à renvoyer

function maSuperfonction(){
  register_rest_route('/nom-de-ma-route/v1', 'project/cat=(?P<cat>[a-z0-9 ,\-]+)',[
 'methods' => 'GET',
 'callback' => 'loma_porfolio_data', 
]);
}

Il est temps de définir les données à renvoyer avec la fonction callback ('loma_porfolio_data')

function loma_porfolio_data($cat){
//definition des arguments du loop 
    $args = [
        'numberposts' => 10, 
        'post_type' => 'project', 
        'category' => $cat['cat'] 
    ];
    //définition des variables pour la génération du json
    $posts = get_posts($args);
    $data = []; 
    $i = 0;
    foreach($posts as $post) {
        // recuperation du logo avec ACF
        $logo = get_field('logo',$post->ID );
        // generation de la donnée pour chaque post
        $data[$i]['id'] = $post->ID;
        $data[$i]['title'] = $post->post_title;
        $data[$i]['content'] = $post->post_content; 
        $data[$i]['slug'] = $post->post_name; 
        $data[$i]['logo'] = $logo ; 
        $data[$i]['featured_image']['thumbnail'] = get_the_post_thumbnail_url($post->ID, 'thumbnail'); 
        $data[$i]['featured_image']['medium'] = get_the_post_thumbnail_url($post->ID, 'medium');
        $data[$i]['featured_image']['large'] = get_the_post_thumbnail_url($post->ID, 'large');
        $i++;
    } 
return $data;
}

Voilà vos données sont générer vous pouvez dès à présent tester votre route à l’adresse :
www.exemple.com/wp-json/nom-de-ma-route/v1/project?cat=12

vous recevrez un beau Json de vos posts pour votre catégorie d’id 12 ????

NB : ce code est bien sur à ajouter au fichier function.php mais selon le nombre de route que vous voulez ajouter, je vous invite a isoler le code dans un autre fichier où vous ajouterez toutes vos routes.

⚠️ Attention le type project est spécifique a mon Custom Post Type si vous voulez utiliser cette technique sur les articles remplacer celui ci par posts

❤️Désolé pour l’indentation du code a l’heure ou j’écrit cette article ce site en en cours de finalisation ❤️