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

공정위 광고 문구 Ver 3.1
공정위 광고 문구 Ver 3.2(모바일 전용)

워드프레스를 시작하게 되면 워드프레스 블록에디터인 구텐베르크(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를 다시 변경해야 하는 것입니다.

ℹ️ 제휴 안내
본 사이트의 콘텐츠에는 제휴 링크가 포함되어 있습니다. 방문자가 이 링크를 통해 상품 또는 서비스를 구매하면 본 사이트는 판매처로부터 수수료를 지급받습니다. 이 과정에서 구매자가 지불하는 금액(이벤트 할인 시 금액이 내려갑니다↓)은 오르지 않습니다. 게시된 가격·할인·재고 정보는 작성 시점 기준이며 실제와 다를 수 있으므로, 구매 전 판매처에서 최종 확인하시기 바랍니다. 상품 선정과 평가는 자체 기준에 따라 작성되며, 수수료 지급 여부가 소개 순서나 평가 내용에 영향을 주지 않습니다.

Similar Posts

  • [Chrome App-PC] 세이프 브라우징 설정 방법

    Google의 데스크탑 및 모바일 앱인 Chrome 세이프 브라우징은 유저가 위험한 웹사이트를 탐색하는 중 위험한 파일을 다운로드 하려고 할 때 사용자에게 경고하는 구글의 서비스입니다. 랜섬웨어, 스파이웨어, 바이러스, 웜 및 트로이 목마를 포함한 맬웨어 등의 감염을 사전에 방지할 수 있도록 해 주는 서비스인 것이죠. 크롬 브라우저를 사용하던 중 빨간 화면의 안내 창을 본 적이 있을…

  • 구라제거기 다운로드 링크

    구라제거기(hoax eliminator)는 블루앤라이브(BLUEnLIVE)님께서 개발한 툴입니다. 키보드 보안 프로그램 및 인터넷 뱅킹 프로그램들은 우리가 사용하는 윈도우 PC의 성능을 느리게 만드는 프로그램이기도 하지요. nProte**, 안랩의 세이프 트랜잭션, 잉카인터넷 등 은행이나 증권사 홈페이지에서 강제로 다운 받게 설정된 프로그램들을 클릭 한번으로 삭제할 수 있는 소프트웨어다. nProte** 프로그램 등을 자주 쓰지 않는다면 느려진 컴퓨터를 제대로 쓰기 위해서라도 hoax…

  • [SEO] robots.txt 정의 | 구글 or 네이버에서 유효성 검사하기

    Robots.txt란 웹 마스터가 웹 로봇(보통 검색 엔진 로봇)에게 웹 사이트 페이지의 크롤링 방법을 지시하기 위한 텍스트 파일입니다. robots.txt 웹 사이트의 루트 파일에 위치하고 있어야 합니다. 이 파일은 로봇이 웹을 탐색하고 콘텐츠에 접근하며 해당 콘텐츠를 사용자에게 제공하는 방법을 제어하는 웹 표준인 로봇 배제 프로토콜(REP:robots exclusion protocol)의 일부입니다. 로봇 배제 프로토콜(REP)에 의해 모든 봇이 지침을…

  • 글로벌 SEO란? 인터내셔널 SEO 정의

    특정 웹사이트를 보면 다국어 기능을 가진 사이트를 확인할 수 있습니다. 글로벌 SEO(Global SEO) 또는 인터내셔널 SEO(International SEO)로 부르며, 해외 SEO 시장 공략을 위한 인터내셔널 SEO 전략은 어떤 방식을 취해야 하는지 알아 보겠습니다. 글로벌 SEO: 인터내셔널 SEO란? 해외 SEO 시장 공략을 위한 International SEO 전략은 어떤 방식과 개념의 접근이 필요할까요? 우선 기본 사항은 해당…

  • 페이오니아: 가입, 수취 계좌 등록, 현지 은행 계좌 연결 방법(데스크탑)

    페이오니아는 미국에 본사를 둔 글로벌 금융 서비스 기업으로, 주된 목적은 국제 온라인 송금, 글로벌 결제 처리, 프리랜서·기업을 위한 현지 통화 계좌 제공입니다. 예를 들어 아마존 어소시에이트 등을 할 때 연동이 필요한 경우 페이오니아를 사용할 수 있습니다. 해외 클라이언트로부터 대금을 받을 때, 혹은 글로벌 플랫폼(예: 아마존, 업워크, 피버 등)의 수익금을 인출할 때 페이오니아는 합리적인…

  • DNS 레코드 확인 및 네임서버 성능 측정 사이트

    DNS(Domain Name System)는 호스트의 네트워크 주소 변경을 수행하기 위해 개발된 시스템입니다. 기본 호스트 서버로 연결되기 전에 보통의 경우 IP 주소를 대신해서 사용하는 주소인 도메인은 DNS에 의해 IP와 도메인을 연결해 줍니다.DNS 레코드 확인을 편하게 할 수 있는 “whatsmydns”와 DNS 서버의 성능을 측정할 수 있는 “DNSPerf”에 대해 알아 보겠습니다. 호스팅 서비스를 이용하게 되면 공유 호스팅과…