Triii Technologies LLC

WooCommerce is the most popular wordpress shopping plugin by a large margin, however it by default does not come with the Gutenberg Block Editor enabled but shows a form of the classic wordpress editor. This is confusing to many new users looking to get started in the usage of WooCommerce as an ECommerce Platform.

It is possible however to change this by editing the theme you have in your WordPress administration panel.

What is the Gutenberg Block Editor

Gutenberg is the codename for WordPress 5’s new block-based editor. It takes the place of the standard TinyMCE-based WordPress editor. It represents a substantial shift in how material is generated. Gutenberg allows you to add numerous media kinds and arrange the layout within the editor using blocks.

The following snippet added to your theme’s functions.php file at the very bottom will enable Gutenberg Block Editor for WooCommerce products.

// enable gutenberg for woocommerce //
function activate_gutenberg_product( $can_edit, $post_type ) {
 if ( $post_type == 'product' ) {
        $can_edit = true;
    }
    return $can_edit;
}

add_filter( 'use_block_editor_for_post_type', 'activate_gutenberg_product', 10, 2 );


// enable taxonomy fields for woocommerce with gutenberg on
function enable_taxonomy_rest( $args ) {
    $args['show_in_rest'] = true;
    return $args;
}
add_filter( 'woocommerce_taxonomy_args_product_cat', 'enable_taxonomy_rest' );
add_filter( 'woocommerce_taxonomy_args_product_tag', 'enable_taxonomy_rest' );

After saving your themes functions.php, you will now be able to edit WooCommerce products with the Gutenberg Block Editor.