구텐베르크 에디터란? 어떻게 WordPress 세계를 폭풍으로 몰아넣었습니까? 당신이 알고 싶은 모든 것

WordPress를 사용하는 웹사이트 4개 중 1개는 의심할 여지 없이 가장 많이 사용되는 콘텐츠 관리 시스템(CMS) 중 하나입니다. 초기부터 블로그 관리 시스템에서 광범위한 선의의 CMS로 발전했습니다. 하지만 워드프레스 세계에서는 상황이 정말 빠르게 변하고 있으며 우리의 의견에 따르면 모든 것이 영원히 변하고 있습니다!

멸종 위기에 처한 전통적인 텍스트 기반 편집자!

WordPress 콘텐츠 편집은 전통적으로 몇 개의 이미지가 있는 텍스트 페이지를 편집하는 것이었습니다. 콘텐츠 생성을 위한 드래그 앤 드롭 사용자 경험을 제공하지 않았습니다. 또한 복잡한 콘텐츠 임베딩 개발자는 특수한 유형의 구문인 짧은 코드를 사용합니다. 이러한 모든 제한 사항으로 인해 WordPress 개발 커뮤니티는 개발을 더 빠르고 효율적으로 만들 수 있는 훨씬 더 간단한 편집기가 필요했습니다.

2018년 12월 6일 WordPress 5.0이 출시되면서 Gutenberg라는 새로운 편집기가 도입되었습니다. 인쇄기의 발명가 요하네스 구텐베르크의 이름을 따서 명명되었습니다.

Gutenberg는 TinyMCE 편집기 또는 이러한 전통적인 텍스트 편집기와 어떻게 다릅니까?

Gutenberg 편집기는 블록 기반 접근 방식을 따릅니다. 모든 콘텐츠 레이아웃을 쉽게 만들 수 있으며 필요한 경우 이동 중에도 콘텐츠를 편집할 수 있습니다. 블록은 다음과 같은 거의 모든 것이 될 수 있습니다.

• 텍스트
• 영상
• 포함시키다
• 단추
• 위젯
• 테이블
• 그리고 더 많은.

사용자는 필요한 경우 사용자 정의 블록을 생성하고 동일한 것을 여러 번 사용할 수도 있습니다. 테마 및 플러그인은 새로운 블록 유형을 추가하여 구텐베르그와의 호환성을 향상시킬 수 있습니다. 이 접근 방식을 사용하면 상상할 수 없는 가능성이 있습니다. 그리고 우리는 WordPress 개발자 커뮤니티가 최선을 다해 혁신할 것이라고 확신합니다.

많은 사람들이 WordPress 버전 5.0 미만을 사용하고 Gutenberg 플러그인을 가지고 놀고 싶어하는 경우가 있습니다. 시작하려면 다음 단계를 따르세요.

Gutenberg 플러그인을 설치하는 방법?

WordPress.org 플러그인 저장소에서 Gutenberg 플러그인을 다운로드하고 설치하여 시작할 수 있습니다. 저장소 담당자인 경우 표준 권장 사항은 GitHub에서 호스팅되는 Gutenberg의 개발 버전을 복제하는 것입니다. 개발 리포지토리 사용의 또 다른 이점은 이미 Gutenberg 리포지토리와 함께 번들로 제공되는 React.js 개발 버전을 얻을 수 있다는 것입니다.

개발 버전은 효과적인 디버깅에 도움이 되는 보다 자세한 오류 보고 기능도 제공합니다.

구텐베르크 레이아웃 이해하기

1. 사용 가능한 다른 유형의 블록은 무엇입니까?

Gutenberg는 다양한 범주로 나누어진 수많은 블록을 제공합니다. 가장 많이 사용되는 블록은 맨 위에 표시되고 아래로 스크롤하면 일반 블록, 서식, 레이아웃 요소, 위젯 등과 같은 다른 섹션이 있습니다. 필요한 블록을 선택하고 페이지 레이아웃에서 끌어서 편집을 시작할 수 있습니다. 일부 블록 유형 및 사용성은 아래에 설명되어 있습니다.

• 인라인 요소에는 인라인 이미지에 대한 단일 블록만 포함됩니다.
• 공통 블록에는 일반 텍스트, 단락, 따옴표 및 더 많은 기본 빌딩 블록이 포함됩니다.
• 형식은 표와 같은 콘텐츠나 끌어오기 인용과 같은 형식이 지정된 콘텐츠에 사용할 수 있습니다.
• 레이아웃 요소를 사용하여 텍스트를 열로 분할할 수 있습니다.
• 위젯을 사용하여 카테고리, 단축 코드를 추가하거나 사이드바 위젯을 표시할 수 있습니다.
• Embed는 YouTube, Twitter, Instagram 또는 기타 외부 콘텐츠를 추가하는 데 도움이 될 수 있습니다.

2. 블록 사용 방법의 예

1. 아래는 공통 블록 카테고리에서 선택되어 화면에 배치된 인용 블록입니다. 인용 블록을 배치하면 필요에 따라 텍스트 편집을 시작할 수 있습니다.

2. 여러 열 레이아웃을 만들 수도 있습니다. 레이아웃 요소 섹션에서 열 블록을 선택할 수 있습니다. 열 블록이 선택되면 이 열 블록 내의 모든 하위 블록을 이동하여 콘텐츠를 구성할 수 있습니다.

3. 이러한 기본 빌딩 블록을 재배열하는 방법은 무엇입니까?

1. 위 또는 아래 화살표를 사용하여 한 번에 한 위치씩 블록을 이동할 수 있습니다.
2. 좀 더 자유롭게 이동하고 싶다면 6개의 점 아이콘을 이용하여 필요한 곳에 끌어다 놓을 수 있습니다.

• 소스 코드를 편집하는 방법?

1. 소스 코드 수준에서 편집이 필요한 경우 오른쪽 상단에 있는 세 개의 세로 점을 클릭하고 코드 편집기를 선택할 수 있습니다.

   

2. 편집 경험을 개선하기 위해 Gutenberg는 전체 화면 모드, 고정 도구 모음, 스포트라이트 모드를 제공합니다.

편집이 완료되면 게시 버튼을 클릭하기만 하면 게시물이 준비됩니다!

구텐베르크의 장점(PROS)

• 우리에 따르면 Gutenberg는 Publishers에게 축복이 될 것입니다. 구텐베르크의 잠금 방식을 사용하여 정말 혁신적인 테마와 플러그인을 만들 수 있습니다.
• 개발자는 블록에 대한 정보를 저장하고 자신의 요구 사항에 맞는 새 블록을 만들 수도 있습니다. 가장 좋은 점은 개발자가 블록을 한 번만 생성하고 모든 곳에서 사용할 수 있다는 것입니다.
• 블록 기반 접근 방식이 깔끔하고 깨끗한 레이아웃을 제공하므로 전체 화면이 덜 복잡해집니다.
• 블록 레이아웃은 모바일 반응형 개발을 위한 정말 최적의 접근 방식입니다. 이제 웹사이트를 모바일과 호환되도록 만드는 것이 비교적 더 쉬울 것입니다.
• 초보자도 WordPress 사이트를 만드는 데 쉽게 대처할 수 있을 정도로 사용자 친화적입니다.

구텐베르크의 단점(CONS)

• 인터넷에 있는 모든 웹사이트의 33%가 WordPress를 사용하여 구축되었다는 점을 고려하면 Gutenberg와의 이전 버전과의 호환성은 여전히 ​​의심스럽습니다. 업그레이드하면 최종 사용자나 초보자가 작업을 쉽게 수행할 수 있지만 개발자 커뮤니티에서 기존 WordPress 웹 사이트를 Gutenberg와 호환되도록 만드는 것은 지루한 작업이 될 것입니다.
• React를 사용하기 때문에 표준 WordPress 개발에 비해 배우기가 다소 어려울 것입니다.
• 기존 플러그인과 테마는 Gutenberg를 지원하도록 업그레이드해야 하며 이 전환을 소화하는 데 시간이 걸릴 수 있습니다.
• 모든 것이 상자 기반이기 때문에 개발자 커뮤니티에서는 올바른 상자 요소를 찾을 수 없다는 우려를 표명하는 부분이 있으며, 이는 결국 레이아웃의 혼란으로 이어집니다.

WordPress 5.0에서 기존 편집기(예: TinyMCE) 사용

WordPress 5.0이 이미 사용 가능하므로 보안 업데이트를 받으려면 모든 WordPress 웹사이트를 업그레이드해야 합니다. 즉, 개발자가 Gutenberg에 익숙해질 수 있는 "클래식 편집기"(https://WordPress.org/plugins/classic-editor/)라는 공식 WordPress 플러그인이 있습니다. 이 플러그인의 설명에 언급된 공식 성명에 따르면 "클래식 편집기는 최소 2022년까지 또는 필요한 기간 동안 완전히 지원되고 유지됩니다."

업그레이드 및 Gutenberg 사용을 시작하는 데 도움이 필요한 경우 [email protected]으로 언제든지 문의하십시오. 우리는 WordPress 서비스를 제공하고 귀하의 웹사이트를 업계의 속도로 빠르게 제공하게 된 것을 기쁘게 생각합니다.