워드프레스 우커머스 상품페이지 에디터를 블럭 에디터로 변경

우커머스 상품 페이지는 아직 구텐베르크 에디터를 지원하지 않는다. 플러그이나 간단한 코드로 구텐베르크 에디터로 바꿀 수 있다.

우커머스 상품 페이지 에디터는 구텐베르크 에디터(블럭 에디터)가 아니다

워드프레스 기본 에디터가 쿠텐베르크 에디터로 변경되었지만 아직 우커머스 상품페이지는 클래식 에디터다.

본문을 작성하는데는 문제가 없다. 우커스 블럭 데이터 항목 중에 상품 목록을 가져오는 기능을 사용하려면 구텐베르크 에디터를 사용해야한다. 마이템의 아이템은 우커머스 상품 기능으로 만들었다. 아이템 페이지에서 해당 카테고리의 아이템을 표시하려면 우커머스 블럭 에디터의 기능이 필요하다.

언제 상품 페이지에 구텐베르크 에디터를 지원하는지 하는지 찾을 수 없다. 방법이 없을까?

우커머스 상품 페이지 에디터를 구텐베르크 에디터로 바꾸기

워드프레스 코어만 지원된다면 안되는 건 거의 없다.

찾아보니 플러그인이 있고 테마에서 추가하는 방법이 있다. 플러그인이나 테마를 수정하면 상품 페이지도 아래와 같이 구텐베르크 에디터로 바꿀 수 있다.

Blocks Product Editor for WooCommerce 플러그인

Blocks Product Editor for WooCommerce 플러그인으로 상품 페이지 에디터를 구텐베르크 에디터로 바꿀 수 있다. 한국어도 지원한다.

아래 기능은 유료를 구입해야한다. 무료 버전으로 충분했다.

• The Catalog visibility metabox
• Enable tags and categories taxonomies in REST

테마 수정

테마의 function.php 에 아래 코드를 추가하면 된다. 테마는 차일드테마를 만들어서 수정해야한다. 안그러면 테마가 업데이트 될 때 수정한 게 날아간다.

// Enable Gutenberg in 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 Gutenberg editor in WooCommerce 에서 찾았다. 플러그인에서 유료로 제공하는 기능도 이 글의 코드를 사용하면 된다.

(2023년 5월 15일 수정)

우커머스 플러그인 업데이트 후에 상품글 새로 작성할때 정해진 템플리트만 나오고 글이 수정 안되었다. 위 코드를 제거하고, Blocks Product Editor for WooCommerce 플러그인를 설치하니 다시 블럭 에디터를 사용할 수 있었다.

우커머스 블록 에디터 중 카테고리 상품 지정하면 서버죽는다

상품 페이지에서 우커머스 블록 에디터로 상품 하나씩 지정하면 괜찮다. 그런데 상품 카테고리를 지정하고 저정시켰더니 저장하다가 서버가 죽었다. php-fm 이 CPU 다 작아먹고 있었다. 마리아디비,php-fm, nginx 를 재시작했다.

해당 상품페이지를 열거나 편집해도 서버가 죽는다. phpmyadmin 으로 접속해 해당 글을 찾아 카테고리 상품 지정하는 걸 지워서 해결했다.

<!-- wp:woocommerce/product-category {"columns":4,"alignButtons":true,"categories":[315]} /-->

강제로 구텐베르크 에디터로 바꿨는데 아직 우커머스 블럭 에디터는 제대로 지원하지 않는 모양이다. 아니면 내가 지정한 상품 카테고리만 이상한 건지 모르겠다.

마치며

이제 우커머스 상품 페이지에 같은 카테고리나 특정 아이템을 노출하기 편하다.

18년 동안 워드프레스 클래식 에디터를 사용했다. 블럭 에디터로 바꾼지는 2개월 정도 되었다. 새 사이트를 만들면서 새로운 것을 시도해보기 위해서였다. 잘 한 것 같다.