Le Blog Maintenance WP

Comment créer un custom post type avec WordPress ?

19 janvier 2024 | Support WordPress

Avez-vous déjà entendu parler d’un custom post type ? Même si vous débutez sur WordPress, c’est un terme qui a dû vous remonter aux oreilles. 

Il faut dire qu’il s’agit de l’un des outils les plus puissants de WordPress. Et pourtant… Nativement, le CMS (Content management system, Système de gestion de contenu) ne le propose même pas à ses utilisateurs !

Sûrement parce qu’un minimum de connaissances techniques sont nécessaires pour s’en servir. 

Une fois bien maîtrisé, cet outil souvent indispensable pour de nombreux sites ouvre le champ des possibles. 

Flexible et évolutif, un type de contenu personnalisé (sa traduction en français) va vous aider à classer et à hiérarchiser votre contenu de façon beaucoup plus fine qu’avec un article, par exemple.

Vous souhaitez savoir comment en tirer profit sur votre site WordPress ? Vous êtes au bon endroit. 

À la fin de votre lecture, vous serez capable de créer un custom post type avec et sans plugin, grâce à tous nos conseils détaillés étape par étape. 

C’est quoi un custom post type ?

Un custom post type (type de contenu personnalisé, en français) est une fonctionnalité de WordPress qui permet à l’utilisateur de catégoriser et de gérer ses contenus en les configurant lui-même. Il peut être conçu en utilisant un plugin dédié ou du code PHP. 

Apparus avec la sortie de la version 3.0 de WordPress (2010), les custom post types (CPT, en abrégé) ne sont pas présents nativement sur chaque nouvelle installation de WordPress. C’est à vous de les concevoir, si besoin. 

C’est notamment ce qui les différencie des 7 types de contenu présents par défaut sur chaque site WordPress, comme :

  • les articles (posts) ; 
  • les pages ;
  • les fichiers joints (attachments), c’est-à-dire vos médias (images, vidéos, PDF etc.) ; 
  • les révisions, soit les sauvegardes de vos contenus (articles & pages) ;
  • les menus de navigation ;
  • le CSS personnalisé ;
  • les modifications (changesets) opérées dans l’Outil de personnalisation (appelé Customizer, en anglais).

Comme d’autres types de contenu par défaut (ex : posts et pages), les custom post types sur WordPress s’affichent dans la barre latérale de votre interface d’administration, une fois créés. 

Vous pouvez même leur assigner vos propres taxonomies et champs personnalisés (custom fields, en anglais) pour les organiser de façon encore plus précise.

D’ailleurs, de nombreux plugins célèbres utilisent leurs propres types de contenu personnalisés sur WordPress. C’est le cas par exemple du célèbre WooCommerce, qui permet de transformer votre site WordPress en boutique en ligne.

Le plugin ecommerce propose par exemple un CPT appelé « Produits » :

Le custom post type Produits créé par le plugin WooCommerce sur WordPress.

Pourquoi créer un type de contenu personnalisé sur WordPress ?

De façon générale, les custom post types sur WordPress permettent de mieux organiser les contenus de votre site, et de les hiérarchiser.

Dans le détail, leur usage comporte plusieurs avantages notables : 

  • vous gagnez en flexibilité, puisque vous pouvez personnaliser chaque type de contenu personnalisé en fonction de vos besoins ; 
  • votre contenu devient mieux organisé car vous pouvez le scinder en différentes catégories ; 
  • vous améliorez l’expérience utilisateur (UX). Si votre contenu est mieux structuré, il est plus facile à trouver et à parcourir. Cela engendre moins de friction et vous augmentez vos chances de retenir vos visiteurs sur votre site afin de les inciter à accomplir l’action de votre choix (achat, téléchargement d’un fichier, remplissage d’un formulaire etc.) ; 
  • vous n’êtes pas limité dans le nombre de CPT que vous souhaitez concevoir. Vous pouvez en créer sans limites ; 
  • vous pouvez utiliser des custom post types pour classer tous types de contenus : produits, films, recettes, témoignages, portfolios etc. ;
  • vous pouvez créer des modèles de page spécifiques (templates) pour chaque custom post type, ce qui vous donne un contrôle total sur la présentation et le style de chaque type de contenu.

Quand devez-vous utiliser un custom post type sur votre site WordPress ?

Les différents cas d’usage possibles

Bien que les custom post types présentent de multiples attraits, ce n’est pas pour autant que vous devez vous empresser d’en créer !

Vous pensez qu’un CPT s’impose sur votre site WordPress et vous hésitez à vous lancer ? Nous vous conseillons de créer un custom post type sur WordPress si : 

  • les différents types de contenu par défaut proposés par WordPress (posts et pages) ne vous permettent pas de structurer votre contenu comme vous le souhaitez ; 
  • vous désirez que l’apparence d’un nouveau contenu soit différente des types de contenu déjà présents sur votre site ; 
  • vous avez besoin de champs supplémentaires pour organiser votre contenu. Par exemple, si vous maintenez un blog de cuisine, vous avez peut-être envie de lister vos recettes par ingrédients, difficulté, durée de cuisson etc. ;
  • le contenu que vous souhaitez créer ne correspond pas à son usage « traditionnel » sur WordPress. Par exemple, un article sert à créer du contenu pour votre blog, contenu qui est amené à être actualisé. Une page sert à afficher du contenu statique (aussi appelé contenu « froid »). 

Cas concrets de l’usage de custom post types sur WordPress

Pour rendre les choses plus concrètes, prenons un exemple précis. Imaginons que vous êtes en charge de la gestion d’un blog dédié au cinéma. 

Afin que l’ensemble soit plus clair et digeste, vous souhaitez classer les films que vous avez critiqués en fonction de différents critères : 

  • acteur ; 
  • durée ; 
  • genre ; 
  • date de sortie ; 
  • notation etc.

Pour chaque article de blog correspondant à une critique de film, vous pouvez bien sûr lui assigner différentes catégories et étiquettes. 

Cependant, ces deux dernières taxonomies présentent des limites :

  • vous risquez de vite vous retrouver avec de nombreuses catégories sur votre site, rendant l’organisation moins claire pour vous, les utilisateurs de votre site et vos visiteurs ; 
  • les catégories et les étiquettes de vos articles de blog ne représentent pas la façon la plus logique de classer votre contenu. Imaginez le nombre de catégories que vous allez devoir créer seulement pour différencier les séries par type (action, horreur, drame, humour etc.) !

Dans ce cas, la création d’un custom post type fera beaucoup plus sens. Et vous pouvez même en créer pour afficher ce que vous voulez :

  • des événements ;
  • des créations issues de votre portfolio ; 
  • des produits pour votre boutique en ligne ; 
  • des témoignages ; 
  • des recettes ; 
  • des livres ; 
  • des films ; 
  • des vidéos etc.

En outre, chaque custom post type peut bien sûr contenir ses propres champs personnalisés. Par exemple, le CPT « Livres » peut contenir des champs pour l’auteur, l’éditeur, l’année de publication, le nombre de pages etc.

Après l’aspect théorique, place à la pratique. Vous allez à présent découvrir comment créer vos propres custom post types sur WordPress. 

Quels prérequis avant de créer un CPT ?

Comme nous vous l’avons indiqué plus haut, la création d’un type de contenu personnalisé peut se faire via un plugin ou du code. 

Nous allons vous présenter les deux méthodes juste après. Quelle que soit celle que vous allez utiliser, nous vous recommandons au préalable d’appliquer les bonnes pratiques suivantes : 

  • sauvegardez votre site (fichiers +base de données) avant toute manipulation technique. Pour cela, servez-vous d’un plugin comme UpdraftPlus, ou d’un outil de maintenance comme WP Umbrella. En cas de problème, vous pourrez facilement restaurer votre site en quelques clics ; 
  • si possible, créez d’abord votre custom post type sur un environnement de test avant de le passer en production (sur votre site en ligne).
    Encore une fois, cela permet de vous couvrir en cas d’erreur technique. Pour mener vos tests en toute tranquillité, travaillez par exemple en local avec l’outil Local. Vous pouvez aussi vous appuyer sur l’outil WordPress Playground, qui permet de simuler un environnement WordPress sur votre navigateur web :
L'outil WordPress Playground permet de simuler un environnement WordPress et de créer des custom post types.
L’outil WordPress Playground

Comment concevoir un custom post type sur WordPress avec un plugin ?

Abordons maintenant la première méthode pour créer un custom post type sur WordPress. Elle consiste à utiliser un plugin. 

Il s’agit de la façon la plus simple et rapide pour démarrer. Elle convient particulièrement aux débutants et non-techniciens – entre autres – car elle n’implique pas de manipuler du code. 

Sur le répertoire officiel de plugins WordPress, plusieurs plugins de custom post types gratuits vous sont proposés :

Pour les besoins de ce test, notre choix s’est porté sur Custom Post Type UI pour plusieurs raisons : 

  • c’est le plus populaire sur le sujet (1 million+ installations actives) ; 
  • il est facile à prendre en main et à utiliser
  • ses réglages sont disponibles en français
  • il est très bien noté par ses utilisateurs ; 
  • il est fréquemment mis à jour
  • il est développé et maintenu par une agence spécialiste de WordPress (WebDevStudios) qui a très bonne presse au sein de l’écosystème.
Capture d'écran du plugin Custom Post Type UI sur WordPress.

Voici comment procéder pour vous servir étape par étape du plugin Custom Post Type UI.

Étape 1 : Installer et activer l’extension Custom Post Type UI

Pour commencer, allez dans le menu Extensions > Ajouter une extension.

Dans la barre de recherche, tapez « custom post type ui », puis installez ET activez l’extension :

Installation de l'extension Custom post Type UI sur le back office WordPress.

Vous disposerez ensuite d’un nouveau… custom post type appelé « CPT UI » dans la barre latérale de votre interface d’administration.

C’est à partir de là que vous accédez aux menus de réglages de l’extension :

Le menu de réglages CPT UI de WordPress.

Étape 2 : Créer un custom post type

Cliquez ensuite sur le sous-menu « Ajouter/Modifier des types de publication » pour concevoir votre premier custom post type. Pour l’exemple, nous allons créer un CPT appelé « Films »

Configuration par défaut de votre custom post type WordPress

En haut de la page, vous tomberez sur un encart nommé « Configuration par défaut ». On vous invite à remplir les éléments suivants : 

  • Slug du type de publication. Il s’agit de la partie de l’URL qui contiendra le nom de votre CPT. Ici, mettez « films » en minuscules. N’utilisez pas de tirets, underscores et autres caractères spéciaux ; 
  • Libellé pour le pluriel (Films) ; 
  • Libellé pour le singulier (films) ; 
  • Auto-remplir les libellés. Si vous cliquez sur le lien « Remplir les libellés supplémentaires en fonction des libellés choisis », Custom Post Type UI va générer lui-même le nom des libellés. Cela vous fait gagner un peu de temps, mais la traduction n’est pas parfaite. On vous conseille donc, après avoir cliqué sur le lien, de modifier à la main chaque libellé.
Configuration par défaut d'un custom post type avec le plugin Custom Post Type UI.

Personnalisation des libellés

L’encart « Libellés supplémentaires » contient une trentaine de libellés dont vous pouvez personnaliser l’intitulé.

La traduction du nom du CPT qui s’affichera dans notre barre latérale d’administration ne nous convient pas (« Mon Films »). Nous choisissons de la renommer plus sobrement « Films ». 

Parcourez la liste des libellés et modifiez ceux que vous souhaitez.

Personnalisation des libellés avec le plugin Custom Post Type UI.

Réglages du type de contenu personnalisé sur WordPress

Dans l’encart suivant, vous trouverez toute une série de réglages sur une même page. Ceux proposés par défaut feront le travail, mais vous pouvez quand même procéder à quelques ajustements, si vous le souhaitez. Voici quelques pistes pour vous aider : 

  • l’option « Position du menu » permet de choisir l’emplacement de votre custom post type sur votre barre latérale d’administration. Vous pouvez le faire remonter ou redescendre en choisissant un chiffre allant de 5 à 100. 
  • l’option « Icône du menu » permet de définir une icône représentant votre CPT. Cliquez sur « Choisir le dashicon » pour sélectionner l’une des icônes proposées. Vous pouvez aussi télécharger l’image de votre choix en cliquant sur le bouton « Choisissez une image d’icône ».
  • l’option « Supports » permet de sélectionner les fonctionnalités prises en charge par votre custom post type WordPress. Vous pouvez par exemple autoriser des commentaires, des champs personnalisés etc.
  • l’option « Taxonomies » permet d’ajouter le support une taxonomie (taxonomy) déjà enregistrée. Par défaut, vous aurez à disposition celles proposées nativement par WordPress : les catégories et les étiquettes.
Vous pouvez ajouter une icône personnalisée à votre custom post type, par exemple via un nom de classe (class name) Dashicon.

Lorsque vous avez terminé, cliquez sur le bouton « Ajouter un type de publication ». 

Vous constaterez alors que votre nouveau custom post type « Films » est disponible sur votre back office.

Pour ajouter un nouveau film, cela fonctionne exactement comme pour un article ou une page. Cliquez sur Films > Ajouter un nouveau. 

Vous atterrirez sur l’interface de l’éditeur de contenu de WordPress (Gutenberg) et vous pouvez ajouter tout le contenu de votre choix.

Étape 3 : Ajouter une taxonomie personnalisée à votre CPT

Pour organiser tout ça de façon encore plus détaillée, vous pouvez classer vos films en fonction de différents critères, grâce à des taxonomies personnalisées. 

Pour les créer sur-mesure, passez par le menu CPT UI > Ajouter/modifier des taxonomies. 

Pour l’exemple, nous allons créer les taxonomies, « Acteurs », « Réalisateurs » et « Genre »

Comme lors de la création d’un CPT, vous devez renseigner un slug, un libellé pour le singulier et le pluriel, et surtout rattacher votre taxonomie (taxonomy) à votre CPT. 

Pour ce dernier point, cochez bien la case « Films » dans la partie « Attacher au type de publication » :

Ajout d'une taxonomie personnalisée à votre custom post type.

Cliquez sur le bouton « Ajouter une taxonomie » lorsque vous avez terminé. Une fois vos taxonomies créées, vous les retrouverez sur l’interface de l’éditeur de contenu de WordPress, dès que vous ajouterez une nouvelle publication :

Ajout de taxonomies sur l'interface de Gutenberg.

Vous savez désormais comment créer un custom post type avec un plugin comme Custom Post Type UI.

Découvrez à présent le mode opératoire pour procéder manuellement, avec du code. 

Comment créer un type de contenu personnalisé avec du code ? 

Attention : La création d’un CPT sur WordPress avec du code nécessite de l’expérience et des compétences techniques. La moindre erreur ou oubli dans le code peut faire planter votre site. C’est la raison pour laquelle nous ne conseillons pas cette méthode aux débutants. Préférez l’usage du plugin Custom Post Type UI si vous vous trouvez dans cette situation.
Si vous vous sentez en mesure de créer un type de contenu personnalisé manuellement, pensez à sauvegarder votre site au préalable. Puis testez votre code en local ou sur un site de staging avant de le basculer sur votre site en production.

Où et comment créer votre CPT WordPress : les deux approches possibles

Pour commencer, sachez qu’il existe deux façons de développer un custom post type en passant par le code.

Option 1 : Créer un custom post type dans le fichier functions.php 

Première possibilité pour vous : concevoir votre CPT en ajoutant son code dans le fichier functions.php de votre thème enfant

Info : Un thème enfant hérite des fonctionnalités et de l’apparence de son thème parent. Il permet de personnaliser un thème parent tout en vous assurant de ne pas perdre vos modifications à chaque mise à jour du thème parent. Découvrez ici comment créer un thème enfant.  

Cette option a un problème majeur : vous ne disposerez plus de vos custom post types en cas de changement de thème. 

Option 2 : Utiliser un plugin dédié

Pour pallier ce souci de « portabilité », WordPress recommande dans ses ressources aux développeurs de placer vos CPT dans un plugin, plutôt que dans votre thème :

WordPress recommande de créer un custom post type dans un plugin.

En cas de changement de thème, vous ne serez pas embêté tant que votre plugin reste actif sur votre site web. 

La création d’un plugin nécessiterait un tutoriel à part en soi. C’est la raison pour laquelle nous allons aller à l’essentiel par ici. Vous allez voir comment ajouter un CPT dans votre fichier functions.php afin de comprendre la mécanique de fonctionnement. 

Si jamais vous optez pour la méthode du fichier functions.php chez vous (qui n’est pas recommandée par WordPress, encore une fois), pensez à créer un thème enfant (child theme) auparavant.

Étape 1 : Déclarer un custom post type

La première étape consiste à déclarer votre custom post type. Pour cela, WordPress recommande d’utiliser une fonction PHP (le logiciel sur lequel tourne WordPress) appelée register_post_type().

Pour l’exemple, nous allons créer un CPT WordPress pour présenter des éléments de portfolio.

Pour information, le code présenté par la suite est issu d’un tutoriel officiel proposé par WordPress que vous pouvez retrouver ici. N’hésitez pas à vous y référer lorsque vous menerez vos tests à la maison !

Info : Si vous comprenez la syntaxe PHP et le mode de fonctionnement d’un CPT, vous pouvez aussi vous appuyer sur un générateur de custom post type (custom post type generator) comme GenerateWP, Meta Box ou WPTurbo.

Commencez par ouvrir le fichier functions.php de votre thème enfant avec l’éditeur de texte de votre choix (Brackets, Sublime Text etc.).

Ajoutez le morceau de code ci-dessous à la fin du fichier :

//CPT Portfolio
function my_custom_portfolio_item() {
$args = array();
register_post_type( 'portfolio_item', $args );
}

add_action( 'init', 'my_custom_portfolio_item' );

Ceci est la structure de base de votre custom post type. Pour le moment, rien ne s’affiche sur votre interface d’administration. 

C’est normal. Vous allez devoir ajouter ce que l’on appelle des arguments. 

Étape 2 : Personnaliser le CPT

Pour personnaliser votre CPT et notamment afficher publiquement ses menus sur l’admin de WordPress, remplacez le morceau de code précédent par celui-ci :

//CPT Portfolio
function my_custom_portfolio_item() {
  $labels = array(
 'name'            => _x( 'Réalisations', 'post type general name' ),
 'singular_name'   => _x( 'Réalisation', 'post type singular name' ),
 'menu_name'       => 'Portfolio'
  );
 $args = array(
 'labels'     => $labels,
 'description'   => 'Contient des réalisations de portfolio',
 'public'     => true,
'show_in_rest' => true,
 'menu_position' => 5,
 'supports'   => array( 'title', 'editor', 'thumbnail', 'excerpt', 'comments' ),
 'has_archive'   => true,
  );
  register_post_type( 'portfolio_item', $args );
}
add_action( 'init', 'my_custom_portfolio_item' );

Décomposons maintenant ce snippet (morceau de code) pour mieux comprendre. Grosso modo, il y a deux parties principales.

Les libellés de votre type de contenu personnalisé

Le tableau (array) $labels correspond aux libellés qui vont s’afficher sur votre interface d’administration.

Pour faire simple, nous en avons entré 3 ici : 

  • ‘name’, le nom de votre CPT au pluriel ; 
  • ‘singular_name’, le nom de votre CPT au singulier ;
  • ‘menu_name’, le libellé (name) du CPT qui sera affiché sur votre administration.

Vous pouvez aller beaucoup plus loin et ajouter d’autres options, en créant par exemple des sous-menus de votre choix. 

Retrouvez les fonctionnalités proposées par la fonction register_post_type() sur la documentation de WordPress. 

Les arguments 

Ensuite, le tableau (array) $args contient une liste d’arguments pour personnaliser votre custom post type

Le code que nous vous proposons propose les arguments suivants  :

  • ‘description’ : pour expliquer ce que contient le custom post type ; 
  • ‘public’ : pour afficher votre custom post type WordPress sur le site. Ici, la valeur est réglée sur ‘true’. Préférez ‘false’ pour ne plus rendre visible le CPT ; 
  • ‘show_in_rest’ : pour rendre le type de contenu personnalisé disponible sur l’éditeur de WordPress (Gutenberg). Dans le cas contraire, c’est l’éditeur classique (TinyMCE) qui sera utilisé ; 
  • ‘menu_position’ : la position du CPT dans votre menu. Avec le chiffre 5, le custom post type va se positionner sous les Articles.
  • supports’ : les champs affichés dans l’interface d’édition de vos publications ; 
  • ‘has_archive’ : pour créer une archive du custom post type (laissez sur « true » si vous le souhaitez).

Encore une fois, vous pouvez customiser selon vos souhaits en utilisant les arguments de présentés dans la documentation de WordPress.

Il pourrait par exemple être intéressant de modifier la petite icône qui s’affiche à côté du nom de votre CPT, sur votre admin WP. 

Notez aussi que la fonction add_action permet de déclarer une directive à WordPress via le hook init, qui s’exécute après que WordPress ait fini de se charger, mais avant que les en-têtes ne soient envoyés.

Pour finir, enregistrez votre fichier functions.php et retournez sur votre interface d’administration. 

Étape 3 : Afficher le type de contenu personnalisé sur WordPress

Si tout va bien, votre custom post type devrait s’afficher dans votre barre latérale, sur la gauche, sous la partie Articles.

Le custom post type Portfolio sur l'admin de WordPress.
Notre custom post type est bien là, avec l’icône par défaut proposée par WordPress.

À partir de là, vous disposerez des options que vous aurez paramétrées. Votre type de contenu est disponible et vous pouvez ajouter du contenu depuis l’éditeur de WordPress.

Personnalisation d'un custom post type avec l'éditeur de contenu de WordPress.

Si vous rencontrez une erreur 404 sur l’interface front-end lorsque vous souhaitez afficher votre CPT, c’est normal. Vous devez mettre à jour les règles de réécriture d’URLs de WordPress dans votre base de données.

La façon la plus simple d’y parvenir consiste à enregistrer de nouveau vos permaliens d’URL (faites-le à chaque modification de votre CPT).

Pour cela, rendez-vous dans le menu Réglages > Permaliens, puis cliquez sur le bouton « Enregistrer les modifications », en bas de la page.

En principe, tout devrait rentrer dans l’ordre. Voilà pour la création de votre premier custom post type. 

Pour faire coller ce CPT à votre charte graphique et à vos besoins, il est possible (et conseillé) d’aller beaucoup plus loin dans la personnalisation. Sachez que vous pouvez également : 

  • ajouter votre propre taxonomie (taxonomy) personnalisée à vos CPT avec du PHP
  • intégrer des champs personnalisés, par exemple à l’aide de l’excellent plugin Advanced Custom Fields (ACF) ; 
  • modifier le modèle de page (template) utilisé par vos custom post types etc.

Récapitulatif

Outil puissant et flexible, le custom post type permet d’organiser et de hiérarchiser le contenu de votre site WordPress. 

Grâce à notre tutoriel, vous savez désormais qu’il est possible de créer un CPT de deux façons différentes : 

  • soit avec un plugin comme Custom Post Type UI
  • soit avec du code PHP à ajouter en priorité dans une extension conçue à cet effet. 

Quelle que soit la méthode choisie, le processus reste technique, surtout si vous souhaitez procéder manuellement (sans plugin).

Le respect des bonnes pratiques et de solides compétences techniques sont nécessaires pour faire les choses dans les règles de l’art, sans risquer de casser votre site. 

Vous désirez être conseillé et accompagné pour intégrer vos premiers types de contenus personnalisés sur votre site internet ? 

Disponible 7j/7, le service de support WordPress de l’agence Maintenance WP vous proposera une solution sur-mesure qui répondra à vos besoins avec rapidité, professionnalisme et efficacité.

Sur le même sujet :

Comment mettre en place des redirections sur WordPress ?

Comment mettre en place des redirections sur WordPress ?

Supprimer une page sur votre site web. À première vue, voilà une opération banale que vous avez déjà dû effectuer à plusieurs reprises. Une paire de clics, et le tour est joué.  C’est simple. C’est rapide… mais attention. Cette action peut avoir des conséquences...

Comment résoudre une erreur 502 sur WordPress ?

Comment résoudre une erreur 502 sur WordPress ?

Error 502, 502 Bad Gateway : en fait, peu importe son libellé. Quand ce genre de message s’affiche sur une page de votre écran, pas besoin de traduction.  Le mal est déjà fait. Et vous comprenez vite qu’il y a un problème. L’écran est (presque) tout blanc. Vous...

Sécurité WordPress : comment protéger et sécuriser son site ?

Sécurité WordPress : comment protéger et sécuriser son site ?

Tic, tac. Tic, tac. Tic, tac. À chaque seconde qui s’égrène sur votre montre, 2 800 attaques cibleraient des sites WordPress. Le piratage de votre site ? Vous vous dites sûrement que cela n’arrive qu’aux autres. Et puis, un beau jour, voilà que cela vous tombe dessus....