[WP] 워드프레스 블록에디터 개요 및 구텐베르크

워드프레스를 시작하게 되면 워드프레스 블록에디터인 구텐베르크(Gutenberg) 편집기란 단어를 접하게 됩니다. 예전 워드프레스 편집기는 클래식 편집기를 사용했지만 보다 직관적인 웹 구축 경험을 위해 Gutenberg 편집기로 대체되었습니다.

워드프레스 블록에디터: 구텐베르크란?

Gutenberg란 Wordpress 플랫폼의 블록 기반 편집기입니다. 워드프레스 5.0으로 업데이트 되면서 구텐베르크라는 에디터가 기본 편집기로 변경되고 기존 클래식 편집기를 그대로 사용하는 유저가 적응하지 못하고 클래식 편집기를 사용하기도 합니다.

초기에는 버그도 많았기 때문에 이용자들의 불만이 속출했지만 시간이 지남에 따라 버그도 점차 사라졌습니다. 간혹 2023년에도 업데이트 중에 워드프레스 글을 작성하는 중 글이 날라가는 버그가 작동해서 DB에서 작성중인 포스트를 다시 가져오기도 했습니다.

워드프레스 구텐베르크 편집기 VS 클래식 편집기

워드프레스 웹사이트를 본격적으로 만들지 3~5개월 이후 구텐베르크 편집기가 나왔고 앞으로의 구텐베르크 편집기가 기본적인 워드프레스 블록에디터로 자리 매김 할 것이 분명했기에 100개 전 후의 글들 이후로 워드프레스 구텐베르크 편집기로 콘텐츠를 작성했습니다.

가장 많이 사용하는 워드프레스 구텐베르크 편집기의 텍스트 블록입니다. 블록은 텍스트, 미디어, 디자인, 위젯, 테마(테마의 기능) 등 다양한 블록을 활용할 수 있습니다. 기존 클래식 편집기를 사용할 때는 보통 워드프레스 블록 플러그인을 같이 사용하는 것이 일반적이었습니다.

온라인 콘텐츠가 시각적이고 직관적인 방법으로 구축하는 추세로 점점 바뀌면서 기존 사용자의 비난을 감수하면서 Gutenberg 블록으로 변경했다고 볼 수 있습니다. Gutenberg 플러그인도 같이 있지만 매우 낮은 별점을 지속적으로 받고 있는 것 또한 현재까지 현실이기도 합니다.

Wix와 같은 CMS는 시각적으로 만들 어 줄 수 있는 웹사이트 빌더 지원이 훌륭했습니다. 페이지 빌더 플러그인 Elementor, Beaver Builder, Divi 빌더 등이 있었지만 워드프레스는 자체 페이지 블록 Gutenberg를 만들게 됩니다.

Gutenberg Plugin은 사용하지 않지만 Gutenberg Block는 꾸준한 업데이트가 진행되면서 만족하면서 사용하고 있습니다.

블록

• 텍스트
  • 문단, 제목, 인용 등 가장 기본적이며 많이 사용하는 블록
• 미디어
  • 이미지, 갤러리, 커버 등의 미디어 파일을 삽입 및 편집
• 디자인
  • 콜투 액션으로 활용할 수 있는 버튼, 컬럼, 그룹 등
• 위젯: 기존 워드프레스 좌·우측 위젯에서 쓸 수 있는 위젯을 사용
• 테마
• 임베드: 트위터, 유튜브 등의 임베드 기능

임베드(Embed)란 SNS 등 인터넷에서 다른 사이트의 내용을 그대로 가져와서 보여주는 것을 뜻합니다.

패턴

만들어져 있는 블록 패턴을 직접 적용해서 사용할 수 있습니다.

구텐베르크 편집기 장점과 단점

장점은 다음과 같습니다.

• 직관적이고 초보자가 쉽게 익힐 수 있습니다.
• 별도의 단축 코드가 필요하지 않아 빠른 작업이 가능합니다.
• 다양한 시각적 옵션의 제공을 합니다.
• 빌더 플러그인이 필수로 필요하지 않습니다.

치명적이며 유일한 단점은 기존 클래식 편집기에서 구텐베르크 편집기로 변경 시 모든 Post와 Page를 다시 변경해야 하는 것입니다.