Vor ein paar Wochen hatte ich einen Kunden mit ganz speziellen WooCommerce-Anforderungen. Fast jedes Produkt hatte viele visuelle Informationen in der Beschreibung, so dass der reguläre WYSIWYG-Editor dort nicht viel Sinn machen würde. Wenn es nur eine Möglichkeit gäbe, den Block-Editor in WooCommerce-Produktseiten zu verwenden… Und es gibt sie!
Heute zeige ich Ihnen, wie Sie das WooCommerce-Produktbeschreibungsfeld in ein Block-Editor-Feld umwandeln können. So wird alles, was in der Registerkarte Produktbeschreibung steht, auf die gleiche Weise angezeigt wie in normalen WordPress-Beiträgen und -Seiten. Und du wirst keine Plugins von Drittanbietern dafür benötigen. Und wenn Ihr WordPress-Theme richtig aufgebaut ist, sollte es nichts kaputt machen – es wird wie erwartet funktionieren.
So ersetzen Sie das WooCommerce-Produktbeschreibungsfeld durch einen Block-Editor
Standardmäßig sieht das WooCommerce-Produktbeschreibungsfeld wie ein normales WYSIWYG-Feld aus, etwa so:
![woocommerce default product description editor](https://rocksolidwebsite.com/wp-content/uploads/2023/10/01-woocommerce-default-product-description-1024x456.jpg)
Wenn wir das Produktbeschreibungsfeld durch den WordPress-Blockeditor ersetzen, sieht es so aus:
![change woocommerce product description editor to block editor](https://rocksolidwebsite.com/wp-content/uploads/2023/10/02-woocommerce-default-product-description-1024x524.jpg)
Jetzt können Sie alle WordPress-Blöcke in WooCommerce-Produktseiten verwenden. Auf die gleiche Weise, wie Sie sie in normalen WordPress-Beiträgen und -Seiten verwenden.
Wie aktivieren Sie also den Block-Editor in WooCommerce? Das ist ein einfacher Trick. Gehen Sie imWordPress-Administrationsbereich zu Darstellung >> Theme File Editor (oder Tools >> Theme File Editor).
Öffnen Sie dort die Datei functions.php auf der rechten Seite des Bildschirms und scrollen Sie bis zum Ende des Inhalts.
Fügen Sie dann die folgenden Codezeilen ein:
// 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
So sollte es in Ihrer functions.php-Datei aussehen:
![woocommerce enable block editor](https://rocksolidwebsite.com/wp-content/uploads/2023/10/03-woocommerce-default-product-description.jpg)
Sobald Sie die Änderungen durch Klicken auf Datei aktualisieren speichern, funktioniert Ihre WooCommerce-Produktseite im Block-Editor-Modus. Um die alten Produkte in Ihrem Shop brauchen Sie sich nicht zu kümmern. Ihr Inhalt wird automatisch in den Blockeditor geladen.