WordPress heeft sinds versie 5.1 de Gutenberg Editor geïntroduceerd als vervanging voor de ‘klassieke editor’. Bij het aanmaken van custom post types wordt standaard de ‘klassieke editor’ gebruikt. Wil je voor je custom post types toch liever de Gutenberg Editor gebruiken, dan kan dit door één regel code toe te voegen aan de functie waarmee je de custom post types aanmaakt.

Maak eerst een custom post type aan met onderstaande code snippet. Hieronder een simpel voorbeeld voor de custom post type Portfolio. Natuurlijk kan je ook andere post types aanmaken zoals boeken, evenementen, teamleden, etc.

/**
 * Register the 'portfolio' custom post type
 */
add_action( 'init', 'wpsimpel_register_post_type' );

function wpsimpel_register_post_type() {

   register_post_type(
      'portfolio',

      // Custom post type options
      array(
         'labels'    => array(
            'name'          => __( 'Portfolio', 'wpsimpel' ),
            'singular_name' => __( 'Portfolio', 'wpsimpel' )
         ),
         'has_archive'   => true,
         'public'        => true,
         'rewrite'       => array( 'slug' => 'portfolio' ),

      )
   );
}

Wanneer je nu in de WP Admin van je website een nieuwe portfolio post aan wil maken dan krijg je de klassieke editor te zien.

De klassieke editor wordt standaard gebruikt bij custom post types
De ‘klassieke editor’ die standaard wordt gebruikt voor nieuwe custom post types

Door onderstaande regel code aan de code van de custom post type toe te voegen kan je er echter voor zorgen dat de Gutenberg Editor verschijnt wanneer je een nieuw portfolio bericht aanmaakt.

'show_in_rest'  => true,

De volledige code komt er dan als volgt uit te zien:

/**
 * Register the 'portfolio' custom post type
 */
add_action( 'init', 'wpsimpel_register_post_type' );

function wpsimpel_register_post_type() {

   register_post_type(
      'portfolio',

      // Custom post type options
      array(
         'labels'    => array(
            'name'          => __( 'Portfolio', 'wpsimpel' ),
            'singular_name' => __( 'Portfolio', 'wpsimpel' )
         ),
         'has_archive'   => true,
         'public'        => true,
         'rewrite'       => array( 'slug' => 'portfolio' ),
         'show_in_rest'  => true, // Add Gutenberg support
      )
   );
}

Wanneer je nu de pagina van het bewerkscherm van je custom post type post ververst, of een nieuwe post aanmaakt zal je zien dat de Gutenberg Editor voor je custom post type actief is.

De Gutenberg Editor gebruiken voor custom post types

Beoordeel deze post:

Gemiddeld: 0 / 5. Aantal beoordelingen: 0

Nog geen beoordelingen

Whoops! 😔

Zou je ons willen laten weten hoe we (deze post) kunnen verbeteren?