Jak włączyć edytor Gutenberg na stronach produktów w WooCommerce

Domyślny edytor WordPressa, czyli Gutenberg, jest uruchomiony dla wpisów i stron, dzięki czemu możesz w wygodny sposób tworzyć na nich treści. Jednak w przypadku WooCommerce, przy dodawaniu produktów i ich opisów, wciąż używany jest klasyczny edytor. Jeśli więc preferujesz edytor blokowy, który oferuje znacznie większą elastyczność w tworzeniu treści, to takie rozwiązanie może być dla Ciebie nieco niekomfortowe.

Można jednak aktywować Gutenberga dla produktów WooCommerce. Pozwoli Ci to tworzyć bardziej rozbudowane opisy stron produktowych i mieć pełną kontrolę nad ich stylem i wyglądem. Jeśli więc zależy Ci na tym, aby Twoje opisy produktowe były bardziej „zaawansowane” i dostosowane do Twoich potrzeb, to rozwiązanie będzie idealne dla Ciebie.

W tym artykule pokażę Ci, jak włączyć edytor Gutenberg na stronach produktów w WooCommerce. Wystarczy do tego krótki fragment kodu, który należy dodać do pliku functions.php w motywie potomnym. Jeśli jednak obawiasz się bezpośredniej edycji plików lub nie korzystasz z motywu potomnego, możesz użyć darmowych wtyczek, takich jak „WP Code” albo „Code Snippets”. Są one dostępne w repozytorium pluginów WordPressa i pozwalają na łatwe oraz bezpieczne zarządzanie własnymi skryptami na stronie.

Poniżej zamieszczam kod, który należy dodać na stronie.

// Wyłączenie nowego szablonu produktu WooCommerce (od wersji 7.7.0)
function ppwp_woo_reset_product_template($post_type_args) {
    if (array_key_exists('template', $post_type_args)) {
        unset($post_type_args['template']);
    }
    return $post_type_args;
}
add_filter('woocommerce_register_post_type_product', 'ppwp_woo_reset_product_template');

// Włączenie edytora Gutenberg dla produktów WooCommerce
function ppwp_woo_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', 'ppwp_woo_activate_gutenberg_product', 10, 2);

// Włączenie taksonomii dla WooCommerce przez REST API - opcjonalnie
function ppwp_woo_enable_taxonomy_rest($args) {
    $args['show_in_rest'] = true;
    return $args;
}
add_filter('woocommerce_taxonomy_args_product_cat', 'ppwp_woo_enable_taxonomy_rest');
add_filter('woocommerce_taxonomy_args_product_tag', 'ppwp_woo_enable_taxonomy_rest');

Usuwanie szablonu produktów

// Wyłączenie nowego szablonu produktu WooCommerce (od wersji 7.7.0)
function ppwp_woo_reset_product_template($post_type_args) {
    if (array_key_exists('template', $post_type_args)) {
        unset($post_type_args['template']);
    }
    return $post_type_args;
}
add_filter('woocommerce_register_post_type_product', 'ppwp_woo_reset_product_template');

Pierwszy fragment kodu usuwa opcję 'template' z argumentów rejestracji typu posta dla produktów WooCommerce. Domyślnie produkty mogą mieć przypisany niestandardowy szablon, ale ten kod usuwa tę możliwość, co powoduje, że produkty korzystają z domyślnego szablonu. Może to poprawić ich kompatybilność z edytorem Gutenberg i ułatwić integrację z jego blokami.

Włączenie Gutenberga dla produktów

// Włączenie edytora Gutenberg dla produktów WooCommerce
function ppwp_woo_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', 'ppwp_woo_activate_gutenberg_product', 10, 2);

Drugi fragment kodu aktywuje edytor Gutenberg dla produktów WooCommerce. Zamiast korzystać z klasycznego edytora, produkty będą edytowane za pomocą natywnego edytora bloków. Dzięki temu użytkownicy mogą korzystać z bloków do tworzenia niestandardowych układów, co zapewnia większą elastyczność i kontrolę nad treścią produktów.

Włączenie dostępu do taksonomii przez REST API (opcjonalny)

// Włączenie taksonomii dla WooCommerce przez REST API - opcjonalnie
function ppwp_woo_enable_taxonomy_rest($args) {
    $args['show_in_rest'] = true;
    return $args;
}
add_filter('woocommerce_taxonomy_args_product_cat', 'ppwp_woo_enable_taxonomy_rest');
add_filter('woocommerce_taxonomy_args_product_tag', 'ppwp_woo_enable_taxonomy_rest');

Ostatni fragment kodu umożliwia on dostęp do kategorii (product_cat) i tagów (product_tag) produktów WooCommerce przez REST API. Dzięki temu dane o kategoriach i tagach produktów mogą być łatwo pobierane i zarządzane przez aplikacje zewnętrzne lub systemy, które potrzebują tych informacji. To szczególnie przydatne, jeśli planujesz integrację z aplikacjami mobilnymi lub innymi zewnętrznymi systemami. Kod ten jest opcjonalny, jeśli więc nie będziesz korzystać z takich rozwiązań, to jego dodanie możesz pominąć.