Types de publications WordPress : le guide complet

Publié: 2021-02-16

Si vous êtes le type de développeur WordPress qui se soucie beaucoup de la conception et de l'organisation, il est temps de bien comprendre les types de publication WordPress.

Comme vous le savez bien, tous les sites WordPress ne sont pas de simples blogs. Souvent, les développeurs ont besoin de plus que de simples pages et publications standard. Ils doivent pouvoir ajouter des types de contenu complètement nouveaux.

Mais quel est le meilleur moyen de briser le plafond de verre de la conception et du développement de WordPress, tout en offrant à l'utilisateur une excellente expérience utilisateur ?

La réponse se trouve dans les types de publication WordPress et les types de publication personnalisés WordPress.

En apprenant, en comprenant et en mettant en œuvre tout le potentiel des types de publication WordPress, vous transformerez votre zone d'administration en un endroit passionnant, organisé et personnalisé qui vous est propre.

Les types de publication WordPress permettent aux concepteurs d'organiser facilement le contenu en permettant la création de nouveaux compartiments pour mettre vos types de contenu uniques.

Mais qu'est-ce que cela signifie exactement et par où commencer ?

Que peut faire l'utilisation des types de publication personnalisés WordPress pour l'expérience utilisateur globale de votre site ?

Découvrons-le.

Quels sont les types de publication WordPress ?

À l'échelle la plus basique, un type de publication WordPress fonctionne comme les publications et les pages familières de votre zone d'administration.

Par défaut, le noyau de WordPress héberge plusieurs types de contenu différents qui sont divisés en types de publication. L'un de ces types de contenu s'appelle une publication. Cependant, ce n'est qu'un des nombreux types de publication standard dans WordPress.

Lorsque vous utilisez WordPress core, il viendra automatiquement avec les types de publication suivants, qui sont chacun stockés dans la table wp_posts de votre base de données WordPress :

Pages
Des postes
Révisions
Pièces jointes

CSS personnalisé
Menus de navigation
Ensembles de modifications

Chacun de ces types de publication a des champs d'éditeur et de titre, comme vous en avez l'habitude avec les pages et les publications ordinaires.

Et lorsque vous créez un type de publication personnalisé, que nous vous montrerons dans ce guide, il apparaîtra dans votre menu d'administration WordPress, tout comme les types de publication WordPress standard.

Une fois que vous avez implémenté un type de publication personnalisé WordPress, vous pourrez y ajouter du contenu comme vous le faites lorsque vous ajoutez un nouveau contenu de blog à votre section de publications.

Cependant, avec les types de publication WordPress, vous pouvez faire en sorte que ces types de publication fassent bien plus que les publications et les pages standard. Vous pouvez également personnaliser la façon dont le front-end de votre site affiche le contenu de votre type de publication aux utilisateurs du site.

Un nouveau type de publication peut être tout ce que vous voulez qu'il soit. Selon le sujet de votre site, il peut s'agir de choses comme :

Maisons
Commentaires
Études de cas

Films
Citations inspirantes
Etc.

La fonctionnalité de type de publication WordPress rend tout nouveau type de contenu possible.

Bien sûr, il existe des plugins qui vous aident à créer des types de publication WordPress. Mais vous ne voulez pas nécessairement qu'un plugin ait autant de contrôle sur la conception et les fonctionnalités de votre site.

Si vous souhaitez un contrôle total sur votre conception et votre UX, la meilleure option consiste à coder vos propres types de publication personnalisés.

Nous suggérerons un plugin plus loin dans ce guide pour ceux d'entre vous qui préfèrent cette option pour créer des types de publication personnalisés WordPress.

Mais la meilleure façon pour vous de vous inscrire, d'ajouter ou de créer un type de publication WordPress est de le coder directement dans le thème de votre site. Cela se fait en utilisant la fonction WordPress register-post-type.

En utilisant cette fonction, vous pouvez ajouter immédiatement du contenu à votre nouveau compartiment de type de publication et l'afficher sur votre site.

Mieux encore, cela ne nécessitera que l'ajout de cinq lignes de code pour vous permettre de démarrer.

Un regard sur les types de publication personnalisés WordPress

Maintenant que vous avez une compréhension de base des types de publication WordPress et des types de publication personnalisés, il est temps de vous salir un peu les mains.

Pour commencer, suivez ces étapes pour créer un nouveau type de publication :

Connectez-vous à votre espace d'administration.
Ouvrez votre éditeur de code et le fichier functions.php de votre thème.
Ajoutez les cinq lignes de code ci-dessous en haut du fichier functions.php.
Actualisez le navigateur.
Vérifiez le menu d'administration WordPress sous Commentaires pour le nouvel élément de menu de type de publication.
Videz vos permaliens.

Voici le code à ajouter :

<?php 
  add_action( 'init', function() {
    $label = 'Books';
    $type = 'book';
    register_post_type( $type, [ 'public' => true, 'label' => $label ] );
  });

Vous devriez maintenant avoir un nouveau type de message.

Mais que pouvez-vous réellement faire avec le nouveau type de publication ?

La puissance des types de publication WordPress et des types de publication personnalisés WordPress

Pour vraiment creuser dans les types de publication, travaillons avec un exemple spécifique de création d'un nouveau site Web de portefeuille qui doit comporter une liste d'études de cas.

Pour cela, nous allons enregistrer un nouveau type de publication pour gérer chacune des études de cas.

En utilisant le thème WordPress par défaut Twenty Twenty, nous commencerons par ajouter notre type de publication Study dans le thème.

Tout d'abord, ouvrez le fichier functions.php du thème Twenty Twenty dans votre éditeur de code. C'est là que vous écrirez votre code de type de message.

Le nouveau type de publication doit être enregistré en haut du fichier functions.php. Cela se fait avec un hook init WordPress en utilisant add_action(). Lorsque vous utilisez la fonction register_post_type pour ajouter le type de publication, cela ne fonctionnera pas correctement sans le hook init.

Ensuite, commencez avec trois arguments pour le register_post_type :

Public – Cela signifie définir le type de publication afin que tout le monde puisse y accéder.
Description - Ce n'est pas beaucoup utilisé mais c'est quand même bon d'avoir.
Étiquette – C'est un argument que nous développerons un peu plus tard.

<?php 
  add_action( 'init', function() {
    $type = 'study';
    $label = 'Studies';
    $arguments = [
        'public' => true, // Allow access to post type
        'description' => 'Case studies for portfolio.', // Add a description
        'label' => $label // Set the primary label
    ];
    register_post_type( $type, $arguments);
  });

Assurez-vous de vider vos permaliens chaque fois que vous effectuez une modification.

Personnalisation des étiquettes de type de publication

WordPress étiquetera par défaut le nouveau type de publication comme Publication dans toute la zone d'administration de votre site. Mais vous voudrez peut-être que les étiquettes soient marquées comme le nouveau type de publication appelé Étude, pas Publication.

Afin de remplacer les libellés par défaut du type de publication, vous devrez les appeler manuellement.

Pour définir correctement les étiquettes, créez une nouvelle fonction qui compile les étiquettes sans encombrer votre code d'enregistrement de type de publication.

Ajoutez simplement la fonction suivante dans votre thème afin qu'elle puisse être utilisée dans le processus d'enregistrement du type de publication :

<?php 
  function xcompile_post_type_labels($singular = 'Post', $plural = 'Posts') {
    $p_lower = strtolower($plural);
    $s_lower = strtolower($singular);

    return [
      'name' => $plural,
      'singular_name' => $singular,
      'add_new_item' => "New $singular",
      'edit_item' => "Edit $singular",
      'view_item' => "View $singular",
      'view_items' => "View $plural",
      'search_items' => "Search $plural",
      'not_found' => "No $p_lower found",
      'not_found_in_trash' => "No $p_lower found in trash",
      'parent_item_colon' => "Parent $singular",
      'all_items' => "All $plural",
      'archives' => "$singular Archives",
      'attributes' => "$singular Attributes",
      'insert_into_item' => "Insert into $s_lower",
      'uploaded_to_this_item' => "Uploaded to this $s_lower",
    ];
  }

Ensuite, dans le code d'enregistrement, vous devrez appeler la fonction que nous venons de créer, xcompile_post_type_labels(). Utilisez-le pour vos étiquettes, puis vérifiez votre zone d'administration.

<?php 
  add_action( 'init', function() {
    $type = 'study';

    // Call the function and save it to $labels
    $labels = xcompile_post_type_labels('Study', 'Studies');

    $arguments = [
      'public' => true,
      'description' => 'Case studies for portfolio.',
      'labels' => $labels // Changed to labels
    ];
    register_post_type( $type, $arguments);
  });

Comment ça se passe jusqu'ici ?

Icône de menu et position pour les types de publication personnalisés WordPress

Depuis l'introduction de WP Dashicons, il est devenu très facile d'ajouter des icônes de menu aux types de publication.

Pour ce faire, définissez d'abord l'argument menu_icon sur un nom Dashicon. Pour cet exemple, nous utiliserons l'icône du bureau de l'ordinateur en utilisant la valeur dashicons-desktop.

<?php 
  add_action( 'init', function() {
    $type = 'study';
    $labels = xcompile_post_type_labels('Study', 'Studies');

    $arguments = [
      'public' => true,
      'description' => 'Case studies for portfolio.',
      'menu_icon' => 'dashicons-desktop', // Set icon
      'labels' => $labels
    ];
    register_post_type( $type, $arguments);
  });

Maintenant, si vous souhaitez modifier l'emplacement de l'élément de menu, utilisez l'argument menu_position. Cet argument prendra une valeur commençant par 0 et se terminant par 100. La valeur choisie listera un élément de menu plus haut ou plus bas sur la base du menu, avec une valeur 0 en haut et 100 en bas.

Maintenant, nous devons ajouter une image en vedette au nouveau type de publication.

Comment activer et désactiver l'image, le titre et l'éditeur en vedette

Pour ajouter ou modifier les champs de formulaire d'administration par défaut pour votre type de publication, tels que les champs Image en vedette, Titre et Éditeur, utilisez un argument de prise en charge défini.

Il existe de nombreuses options que vous pouvez activer et désactiver en utilisant l'argument de support de type de publication. Elles sont:

Champ de titre
Éditeur
Boîte auteur
Vignette (image en vedette)
Extrait
Rétroliens

Les champs personnalisés
commentaires
Révisions
Attributs de page
Post-formats

Pour votre nouveau type de publication d'étude, vous pouvez remplacer les options WordPress par défaut et ajouter votre propre image en vedette en appliquant l'option de vignette.

Avant de faire cela, assurez-vous d'avoir activé la prise en charge des thèmes pour les post-vignettes. Cela se fait en utilisant la fonction add-theme-support.

Il ne nécessite que quelques lignes de code supplémentaires pour utiliser la fonction de support, et cela activera l'image en vedette.

<?php 
  // Add theme support for featured image / thumbnails
  add_theme_support('post-thumbnails');

  add_action( 'init', function() {
    $type = 'study';
    $labels = xcompile_post_type_labels('Study', 'Studies');

    // Declare what the post type supports
    $supports = ['title', 'editor', 'revisions', 'page-attributes', 'thumbnail'];

    $arguments = [
      'supports' => $supports, // Apply supports
      'public' => true,
      'description' => 'Case studies for portfolio.',
      'menu_icon' => 'dashicons-desktop',
      'labels' => $labels,
    ];
    register_post_type( $type, $arguments);
  });

Peu de concepteurs ou de développeurs WordPress en font autant dans les types de publication personnalisés WordPress. C'est le bon moment pour vous donner une petite tape dans le dos.

La hiérarchie des types de publication personnalisés WordPress

Alors que les publications WordPress ne peuvent pas avoir de publications enfants, les pages le peuvent. Un enfant d'une page est considéré comme une sous-page.

Si vous le souhaitez, vous pouvez faire en sorte que les types de publication personnalisés WordPress utilisent une hiérarchie telle que Pages en utilisant l'argument hiérarchique.

Pour notre exemple de type de poste Études, nous n'en aurions pas nécessairement besoin. Mais si vous en avez besoin pour votre projet spécifique, voici le code à utiliser :

<?php 
  add_action( 'init', function() {
    $type = 'study';
    $labels = xcompile_post_type_labels('Study', 'Studies');

    // Declare what the post type supports
    $supports = ['title', 'editor', 'revisions', 'page-attributes', 'thumbnail'];

    $arguments = [
      'hierarchical' => false, // Do not use hierarchy
      'supports' => $supports,
      'public' => true,
      'description' => 'Case studies for portfolio.',
      'menu_icon' => 'dashicons-desktop',
      'labels' => $labels,
    ];
    register_post_type( $type, $arguments);
  });

Comment activer l'API REST pour un nouveau type de publication

L'API REST a changé WordPress pour toujours. En tant que tel, vous souhaiterez que votre nouveau type de publication puisse accéder à toutes les fonctionnalités les plus récentes de WordPress, telles que Gutenberg.

L'activation de l'API REST pour les nouveaux types de publication personnalisés WordPress est aussi simple que de définir l'argument show_in_rest sur true.

Lorsque l'API REST est activée, votre nouveau type de publication commencera à utiliser Gutenberg (s'il prend également en charge l'éditeur).

<?php 
  add_action( 'init', function() {
    $type = 'study';
    $labels = xcompile_post_type_labels('Study', 'Studies');

    // Declare what the post type supports
    $supports = ['title', 'editor', 'revisions', 'page-attributes', 'thumbnail'];

    $arguments = [
      'show_in_rest' => true, // Enable the REST API
      'hierarchical' => false,
      'supports' => $supports,
      'public' => true,
      'description' => 'Case studies for portfolio.',
      'menu_icon' => 'dashicons-desktop',
      'labels' => $labels,
    ];
    register_post_type( $type, $arguments);
  });

Lorsque vous activez l'API REST dans WordPress, vous pourrez également accéder au nouveau type de publication en tant qu'objet JSON via des points de terminaison WordPress spécifiques.

Pour afficher le point de terminaison du type de publication REST, utilisez ce /wp-json/wp/v2/study.

Pour modifier le nom de base de votre type de publication dans l'URL en études au lieu d'étude, utilisez l'argument rest_base.

<?php 
  add_action( 'init', function() {
    $type = 'study';
    $labels = xcompile_post_type_labels('Study', 'Studies');

    // Declare what the post type supports
    $supports = ['title', 'editor', 'revisions', 'page-attributes', 'thumbnail'];

    $arguments = [
      'rest_base' => 'studies', // Change the REST base
      'show_in_rest' => true,
      'hierarchical' => false,
      'supports' => $supports,
      'public' => true,
      'description' => 'Case studies for portfolio.',
      'menu_icon' => 'dashicons-desktop',
      'labels' => $labels,
    ];
    register_post_type( $type, $arguments);
  });

Et juste comme ça, l'API est définie et Gutenberg est activé sur le type de publication.

Comment ajouter Gutenberg aux types de publication personnalisés WordPress

N'oubliez pas que Gutenberg ne peut pas être activé pour les types de publication personnalisés à moins qu'il ne prenne en charge l'éditeur et que l'API REST soit activée.

Une fois activé, pour ajouter Gutenberg à votre type de publication, nous devons oublier notre type de publication Étude pendant une seconde et créer un nouveau type de publication que nous appellerons Article.

Nous utiliserons le type de publication Article pour activer Gutenberg.

<?php 
  add_action( 'init', function() {
    $type = 'article';
    $labels = xcompile_post_type_labels('Article', 'Articles');

    $arguments = [
      'rest_base' => 'articles',
      'show_in_rest' => true, // Required for Gutenberg
      'supports' => ['editor'], // Required for Gutenberg
      'public' => true,
      'description' => 'Case studies for portfolio.',
      'menu_icon' => 'dashicons-desktop',
      'labels' => $labels,
    ];
    register_post_type( $type, $arguments);
  });

Vous remarquerez que les deux arguments dont vous avez besoin pour ajouter Gutenberg sont :

'show_in_rest' => true,
'supports' => ['editor'],

Comment supprimer Gutenberg des types de publication personnalisés WordPress

Si vous souhaitez supprimer Gutenberg de l'un de vos types de publication, ajoutez simplement le crochet d'action use_block_editor_for_post_type dans le fichier functions.php de votre thème.

Cela se fait avec le code suivant :

<?php 
add_filter('use_block_editor_for_post_type', function($enabled, $post_type) {

  // List of post types to remove
  $remove_gutenberg_from = ['study'];

  if (in_array($post_type, $remove_gutenberg_from)) {
    return false;
  }

  return $enabled;
  }, 10, 2);

Cela désactive de force Gutenberg du type de publication.

Notez que tous vos types de publication personnalisés WordPress ne doivent pas être activés avec Gutenberg. Il y a des moments où vous voudrez peut-être utiliser l'éditeur WordPress classique avec des types de publication.

La fonction de désactivation de Gutenberg est également utile lorsque le type de publication doit être accessible depuis l'API REST.

Dans ces cas, la désactivation de Gutenberg est la direction dans laquelle vous voudrez aller.

Activation des archives et configuration du frontal

Nous sommes enfin arrivés au point où il est temps d'aborder notre conception frontale des publications personnalisées WordPress.

Il y a trois choses que vous devrez faire lorsque vous souhaitez configurer la liste de contenu de type de publication personnalisé WordPress :

Activez l'argument has_archive.
Définissez le slug des règles de réécriture sur une forme plurielle du nom de votre type de publication. Dans le cas de l'exemple de ce guide, il faudrait le remplacer par « études ».
Videz vos permaliens.

<?php 
  add_action( 'init', function() {
    $type = 'study';
    $labels = xcompile_post_type_labels('Study', 'Studies');

    // Declare what the post type supports
    $supports = ['title', 'editor', 'revisions', 'page-attributes', 'thumbnail'];

    $arguments = [
      'rewrite' => [ 'slug' => 'studies' ] // Change the archive page URL
      'has_archive' => true, // Enable archive page
      'rest_base' => 'studies',
      'show_in_rest' => true,
      'hierarchical' => false,
      'supports' => $supports,
      'public' => true,
      'description' => 'Case studies for portfolio.',
      'menu_icon' => 'dashicons-desktop',
      'labels' => $labels,
    ];
    register_post_type( $type, $arguments);
  });

Avec tout cela en place, il est temps de commencer à thématiser le contenu de votre type de publication personnalisé. Pour l'instant, nous utiliserons le thème par défaut Twenty Twenty. Bien sûr, vous pouvez utiliser n'importe quel thème que vous souhaitez.

Modèle de type de publication personnalisé WordPress

Avant de modéliser notre type de publication personnalisé, examinons d'abord la hiérarchie des modèles WordPress.

Si vous n'êtes pas déjà familiarisé avec la façon dont WordPress fonctionne avec les modèles, pensez-y comme similaire à la façon dont CSS gère la spécificité. Bien qu'il ne soit pas trop important de s'enliser dans les détails, cette simple analogie vous aidera à mieux comprendre la hiérarchie des modèles WordPress.

Il y a deux fichiers modèles spécifiques auxquels prêter attention dans la hiérarchie des modèles pour notre nouveau type de publication d'étude.

Elles sont:

1. single-study.php - Il s'agit de la page unique lorsqu'un utilisateur accède à http://yourcoolsite.com/studies/your-cool-study-post pour afficher une seule étude.

2. archive-study.php - Il s'agit de la page d'archive lorsqu'un utilisateur accède à http://yourcoolsite.com/studies pour afficher une liste de toutes les études.

WordPress utilisera, par défaut, les modèles single.php et archive.php de votre thème pour la conception frontale de types de publication personnalisés. Cependant, lorsqu'un modèle spécifique existe pour les types de publication personnalisés, single-study.php et archive-study.php remplaceront les valeurs par défaut dans WordPress.

Une seule page

Comme nous utilisons le thème WordPress Twenty Twenty par défaut dans ce guide, nous devons d'abord créer le nom de fichier single-study.php et travailler avec.

Dans le fichier de modèle de type de publication unique, ajoutez cette boucle WordPress :

<?php
	/**
	 * The template for displaying single posts and pages.
	 *
	 * @link https://developer.wordpress.org/themes/basics/template-hierarchy/
	 *
	 * @package WordPress
	 * @subpackage Twenty_Twenty
	 * @since 1.0.0
	 */
	
	get_header();
	?>
	
	<main id="site-content" role="main">
	
	        <?php
	
	        if ( have_posts() ) {
	
	                while ( have_posts() ) {
	                        the_post();
	
	                }
	        }
	
	        ?>
	
	</main><!-- #site-content -->
	
	<?php get_template_part( 'template-parts/footer-menus-widgets' ); ?>
	
	<?php get_footer(); ?>

Page d'archives

La page d'archive pour le type de publication utilise exactement le même processus que la page unique. La seule différence est que vous utiliserez le modèle archive-study.php plutôt que single-study.php.

Pour votre page d'archives, vous voudrez qu'elle soit liée à chaque étude et n'affiche que le titre « Étude ».

Bien sûr, n'hésitez pas à vous amuser avec ce code :

<?php
  /*
  Template Name: Archive-Study
  */
  get_header(); ?>

  <div id="container">
  	<div id="content" role="main">

  		<?php the_post(); ?>
  		<h1 class="entry-title"><?php the_title(); ?></h1>
  		
  		<?php get_search_form(); ?>
  		
  		<h2>Archives by Month:</h2>
  		<ul>
  			<?php wp_get_archives('type=monthly'); ?>
  		</ul>
  		
  		<h2>Archives by Subject:</h2>
  		<ul>
  			 <?php wp_list_categories(); ?>
  		</ul>

  	</div><!-- #content -->
  </div><!-- #container -->


  <?php get_footer(); ?>

Maintenant que votre page d'archives est parfaitement en place, il semble que vous ayez terminé. Mais que se passe-t-il si vous avez cent études de cas ou plus ?

Comment modifier la requête de la page d'archivage

Les pages d'archive ne répertorient que le nombre d'éléments spécifiés par l'administrateur dans Paramètres > Lecture. Souvent, vous ne voudrez pas que la même limite soit appliquée aux types de publication personnalisés que votre blog principal ou votre flux d'articles.

Lorsque vous souhaitez supprimer la limite sur votre page d'archive, modifiez simplement la requête principale en utilisant le crochet pre_get_posts.

Une fois que vous serez connecté à pre_get_posts, vous pourrez accéder et modifier l'objet principal WP_Query.

Afin de répertorier toutes les études sur votre page d'archives, vous devez :

Utilisez le crochet pre_get_posts.
Détectez si la méthode is_main_query est ce qui exécute la requête principale.
Détectez si vous êtes sur la page d'archives de l'étude en utilisant is_post_type_archive.
Dans le WP_Query principal, définissez posts_per_page sur -1. Cela supprime toutes les limites de nombre et répertorie tout.

<?php
  add_action('pre_get_posts', function( WP_Query $query ) {
    if($query->is_main_query() && $query->is_post_type_archive('study')) {
      $query->set('posts_per_page', -1);
    }
  });

En utilisant le hook pre_get_posts, vous accédez directement à la requête SQL que WordPress exécute déjà. La requête vous donne accès aux publications, aux pages et à vos types de publication personnalisés sans écrire de code SQL.

C'est toujours un bonus.

Utilisation d'un plugin pour les types de publication personnalisés WordPress

Si vous n'êtes pas du genre à creuser dans le code et que vous préférez créer et modifier vos types de publication personnalisés avec un plugin, Custom Post Type UI fournit une interface facile à utiliser pour l'enregistrement et la gestion des types de publication personnalisés (et taxonomies).

Le plugin est très bien noté et est configuré pour fonctionner avec les versions WordPress 5.5 et supérieures.

Il a été testé jusqu'à 5,6.

Utiliser un générateur pour les types de publication personnalisés WordPress

Vous voulez un moyen vraiment simple d'obtenir votre code pour des types de publication personnalisés (ou taxonomies) ? Découvrez GenerateWP. Vous pouvez utiliser GenerateWP pour créer une large gamme de code personnalisé. C'est assez simple aussi. Remplissez simplement le bon formulaire et obtenez le code à copier/coller.

Vous pouvez même voir un webinaire de formation sur les types de publication personnalisés d'il y a quelques années qui présentait GenerateWP. La bonne nouvelle est que les types de publication personnalisés existent depuis si longtemps que la formation est toujours d'actualité.

Les types de publication WordPress sont votre nouveau meilleur ami

Que vous travailliez avec des types de publication WordPress manuellement ou avec un plugin, il est extrêmement important que votre site soit équipé du meilleur plugin de sauvegarde WordPress disponible.

L'édition de code a toujours le potentiel de provoquer des conflits qui peuvent envoyer votre site dans une direction que vous n'aviez pas prévue.

Dans ces cas, BackupBuddy et iThemes Security, un puissant plugin de sécurité WordPress, viendront à la rescousse et vous ramèneront au travail en toute sécurité.

AJ Morris

AJ apporte plus de deux décennies d'expérience dans le travail et le développement de sites d'adhésion avec un large éventail de clients.