Home » WooCommerce » Comment activer l’éditeur de blocs WordPress dans les pages produits de WooCommerce

Comment activer l’éditeur de blocs WordPress dans les pages produits de WooCommerce

Il y a quelques semaines, j’ai eu un client qui avait des besoins assez spécifiques avec WooCommerce. Presque tous les produits avaient beaucoup d’informations visuelles dans la description, de sorte que l’éditeur WYSIWYG normal n’aurait pas eu beaucoup de sens à cet endroit. Si seulement il y avait un moyen d’utiliser l’éditeur de blocs dans les pages produits de WooCommerce… Et c’est le cas !

Aujourd’hui, je vais vous montrer comment transformer le champ de description de produit de WooCommerce en champ d’éditeur de blocs. Ainsi, tout ce qui se trouve dans l’onglet de description du produit sera affiché de la même manière que dans les articles et pages WordPress ordinaires. Et vous n’aurez besoin d’aucun plugin tiers pour cela. Et si votre thème WordPress est construit correctement, cela ne devrait pas casser quoi que ce soit – cela fonctionnera comme prévu.

Comment remplacer le champ de description de produit de WooCommerce par l’éditeur de blocs ?

Par défaut, le champ de description de produit de WooCommerce ressemble à un champ WYSIWYG normal, comme ceci :

woocommerce default product description editor

Lorsque nous remplacerons le champ de description de produit par l’éditeur de blocs de WordPress, il ressemblera à ceci :

change woocommerce product description editor to block editor

Vous pourrez désormais utiliser tous les blocs WordPress dans les pages produits de WooCommerce. De la même manière que vous les utilisez dans les articles et les pages WordPress ordinaires.

Comment activer l’éditeur de blocs dans WooCommerce ? C’est une astuce facile. Allez dans Apparence >> Editeur de fichiers de thème (ou Outils >> Editeur de fichiers de thème) dans lepanneau d’ administration de WordPress.

Une fois que vous y êtes, ouvrez le fichier functions.php sur le côté droit de l’écran, et faites défiler jusqu’au bas de son contenu.

Ajoutez ensuite ces lignes de code :

// ENABLE WORDPRESS EDITOR IN WOOCOMMERCE start
add_filter('use_block_editor_for_post_type', 'activate_gutenberg_product', 10, 2 ) ;
function activate_gutenberg_product( $can_edit, $post_type ) {
 if ( $post_type == 'product' ) { $can_edit = true ; }
 return $can_edit ;
}

add_filter('woocommerce_taxonomy_args_product_cat', 'enable_taxonomy_rest' ) ;
add_filter('woocommerce_taxonomy_args_product_tag', 'enable_taxonomy_rest' ) ;
function enable_taxonomy_rest( $args ) {
 $args['show_in_rest'] = true ;
 return $args ;
}
// ENABLE WORDPRESS EDITOR IN WOOCOMMERCE end

Best WordPress hosting 2024

Cela devrait ressembler à cela dans votre fichier functions.php :

woocommerce enable block editor

Une fois que vous avez enregistré les modifications en cliquant sur Mettre à jour le fichier, votre page produit WooCommerce fonctionnera en mode éditeur de blocs. Et vous n’avez pas à vous soucier des anciens produits de votre boutique. Leur contenu sera automatiquement chargé dans l’éditeur de blocs.

Tags:

Fathom analytics - privacy focused cookie-free website analytics

Most popular tutorials


Get our latest WordPress news and special offers from RockSolidWP!

Only useful WordPress and WooCommerce tips and tricks and exclusive offers for our readers once a month. No marketing nonsense.

Looking for reliable yet affordable WordPress hosting?
Hostinger is the way to go!

Get 10% OFF by using code IMAKEITWORK