구텐베르크 WordPress 편집기에 대해 알아야 할 사항

게시 됨: 2018-03-08
많은 웹사이트 자원 봉사자와 기고자가 현재 최신 Gutenberg WordPress 편집기 를 사용하고 있습니다. 그러나 그들의 목표는 간단합니다. 'WordPress에 풍부한 콘텐츠 추가' 를 보다 즐겁고 부드러운 경험으로 만드는 것입니다.

구텐베르그 워드프레스 에디터는 워드프레스 코어의 가장 핵심적인 측면 중 하나가 될 것입니다. 그러나 웹 사이트 소유자에게는 무엇을 의미합니까? 사용자가 이미 페이지 빌더를 사용하고 있다면 어떻게 됩니까? 우리는 이 가이드에서 이러한 질문과 더 많은 것에 답할 것입니다. 또한 구텐베르그의 기초에 대해서도 이야기하겠습니다. 또한 최신 버전에 대해 알아야 할 모든 것에 대해 이야기할 것입니다. 그 동안 WordPress 디자인을 더 쉽게 만들 수 있는 페이지 빌더 플러그인이 있습니다.

구텐베르크 워드프레스 에디터 이해하기

Gutenberg WordPress 편집기는 새로운 시각적 편집기입니다. 또한 WordPress 코어에 통합되도록 설계되었습니다. Gutenberg는 페이지 빌더와 같은 기능을 추가하여 도움을 주지만 콘텐츠 블록이 추가되었습니다. 예를 들어 TinyMCE를 기본 콘텐츠 편집기 중 하나로 복원할 수 있습니다.

그럼에도 불구하고 사용하면서 다양한 유형의 블록에 콘텐츠가 추가되는 것을 알 수 있습니다. 또한 추가는 WordPress 백엔드에서 바로 시작됩니다.

게다가 구텐베르크는 단순한 편집자 그 이상입니다. 전체 콘텐츠 게시 환경에 사용자 지정 기능을 추가합니다. 그것은 사용자가 현대적인 디자인을 만들 수 있습니다. 또한 더 나은 편집 경험을 제공합니다. 또한 WordPress 웹 사이트의 미래를 위한 기반을 구축합니다. 구텐베르크는 워드프레스 5.0 내에서 출시될 예정입니다.

구텐베르크 워드프레스 에디터의 주요 목적

기능적 관점에서 구텐베르크의 주요 목적을 살펴보겠습니다.

주요 용도는 'WordPress에 풍부한 콘텐츠 추가' 경험을 더 재미있고 흥미롭게 만드는 것입니다.

WordPress의 진화에서 중요한 단계입니다. Gutenberg가 없으면 WordPress 기본 기능에는 기사용 기본 텍스트 편집기만 포함됩니다. 또한 구텐베르크를 사용하면 WordPress 사용자는 멋진 콘텐츠 레이아웃을 만들 수 있습니다. 또한 Gutenberg는 WordPress 사용자 경험을 단순화하기 위한 많은 중요한 전환 중 하나입니다.

구텐베르크에 대한 현재 진행 중인 논쟁이 궁금하십니까? 그런 다음 더 자세히 논의하면서 계속 읽으십시오.

Matt Mullenweg는 Gutenberg의 배후에 있는 저명한 인물입니다.

Mullenweg의 'State of the Word 2016' 발표에 따르면 Gutenberg는 비주얼 에디터입니다. 그러나 이것은 WordPress의 미래를 위한 세 가지 주요 핵심 중 하나입니다. 2017년 초에 Mullenweg는 Gutenberg를 프로젝트 리더로 인수했습니다. 그러나 추가 개발을 위해 Mullenweg는 Joen Asmussen과 Matias Ventura를 고용했습니다. 그는 그들을 자동 직원으로 고용합니다. 따라서 Mullenweg에 대한 Gutenberg에 대한 자세한 내용을 보려면 'We Called it Gutenberg for Reason'을 방문해야 합니다.

Gutenberg Editor는 플러그인입니다

WordPress 플러그인 디렉토리에서 찾을 수 있는 WordPress 플러그인으로 다운로드하여 WordPress 사이트에 Gutenberg를 추가하는 것은 매우 쉽습니다.
새롭고 향상된 기능이 계속 추가됨에 따라 Gutenberg 플러그인은 매주 업데이트됩니다. 그러나 이 플러그인에 대한 설명을 기록해 두십시오. 아직 베타 소프트웨어이므로 적절한 주의를 기울여 사용해야 합니다. 앞서 언급했듯이 이 편집기는 WordPress 5.0에 통합될 가능성이 높습니다.

구텐베르크는 여전히 구현되고 있습니다

다음은 구텐베르크의 향후 기능에 대해 알아야 할 사항입니다.

  • 구텐베르크는 아직 완성되지 않았습니다. 현재 구텐베르크의 다양한 기능이 구현되고 있습니다. 이와 함께 새 버전에서는 이전에 구현된 기능과 UI를 개선했습니다.
  • Gutenberg가 현재 제대로 작동하지 않더라도 걱정하지 마십시오. 팀이 계속 개발하면서 문제가 해결되고 있습니다.
  • 편집기는 React JavaScript의 도움으로 작성되고 있습니다. 그러나 MIT 라이선스라는 이름으로 프로젝트를 다시 라이선스하는 Facebook의 현재 행위를 고려할 때 Matt 씨는 Gutenberg와 wordpress.com이 다른 라이브러리로 다시 작성될 것이라고 발표했습니다. 이것은 잠시 동안 Gutenberg의 진행을 지연시킬 것입니다.

구텐베르크 임베딩 및 블록

레이아웃과 콘텐츠를 사용자 정의하기 위해 Gutenberg는 다양한 블록을 제공합니다.

블록

공통 블록

서식 지정 블록

레이아웃 블록

위젯

영상

카테고리

테이블

분리 기호

짧은 코드

표제

견적서 가져오기

텍스트 열

최근 게시물

갤러리

사용자 정의 HTML

단추

목록

맞춤 테스트

인용하다

미리 포맷됨

비디오/오디오

암호

표지 이미지

다음은 Gutenberg에서 제공하는 Embed입니다.

임베드

유튜브

클라우드업

믹스클라우드

스머그

트위터

아니모토

Meetup.com

테드

인스 타 그램

데일리모션

레딧

스피커

페이스북

대학 유머

포토 버킷

비디오프레스

사운드 클라우드

훌루

폴리다디

텀블러

워드프레스

이수

스크린캐스트

워드프레스.tv

비메오

임구르

리버브네이션

덩굴

플리커

웃기거나 죽는다

슬라이드쉐어

스포티 파이

킥스타터

스크리브드

구텐베르크의 장점

다음은 구텐베르그를 워드프레스 5.0과 통합할 때의 몇 가지 큰 이점입니다.

WordPress 비주얼 편집기의 진행 상황

  • 수년 동안 WordPress 비주얼 편집기는 매우 단조롭습니다.
  • Gutenberg의 목적은 사용자에게 매우 직관적인 인터페이스를 통합하는 것입니다. WordPress가 Squarespace 및 Wix와 같은 다른 시각적 편집기와 경쟁할 수 있도록 설계되었습니다.

HTML 주석을 사용하여 블록 정보를 저장하는 현명한 움직임

  • Gutenberg는 HTML 주석에 블록 정보를 저장합니다.
  • 이러한 댓글은 사이트의 라이브 페이지에서 활발하게 렌더링되지 않으며 사이트의 백엔드에서만 볼 수 있습니다.

사이트를 손상시키지 않고 쉽게 구텐베르크를 비활성화할 수 있습니다

  • 다른 페이지 편집기와 달리 이 시각적 편집기인 Gutenberg는 사이트를 손상시키지 않고 쉽게 제거할 수 있습니다.
  • 구텐베르그를 재활성화할 때 이전에 배열된 블록을 잃을 기회는 없습니다. HTML 주석은 항상 콘텐츠에 보존됩니다.
  • Gutenberg가 비활성화된 경우 페이지 소스가 HTML 주석을 렌더링할 수 있다는 점에 유의해야 합니다.

복사/붙여넣기 루틴의 더 나은 실행

  • 이전 구텐베르크 버전에서 복사/붙여넣기 구현은 엉망이었습니다. 또한이 전체 프로세스에서 손실되는 데 사용되는 형식이지만 더 이상 그렇지 않습니다.
  • 목록, 제목, 단락 등을 붙여넣으면 적절한 유형의 블록이 되고 구텐베르그가 자동으로 생성합니다.
  • 기울임꼴 및 굵게와 같은 텍스트 마크업도 유지됩니다.

강력한 HTML5 출력

  • Gutenberg는 그림 및 섹션과 같은 HTML 5 태그를 사용하여 출력 콘텐츠를 차단합니다.
  • HTML 5 태그의 도움으로 구텐베르크에서 미래 지향적인 콘텐츠를 구축할 수 있습니다.

쓰기 쉬운 블록

  • 맞춤형 콘텐츠를 제작하기 위해 개발자는 자신의 개인 블록을 구축할 수 있습니다.
  • 구텐베르크에서 블록 작성에 대한 자세한 정보를 얻을 수 있는 온라인 리소스가 많이 있습니다.

구텐베르크 사용의 단점

브라우저에서 더 이상 구성이 필요하지 않습니다.

  • Gutenberg UI의 초점은 콘텐츠 생성 대신 콘텐츠 레이아웃에 있습니다.
  • 개발자가 게시물 창을 사용하여 콘텐츠를 작성하던 시대는 끝났습니다.

UI가 약간 투박하다고 느낄 수 있습니다.

  • 일부 간단한 작업에는 과거보다 더 많은 작업이 필요할 수 있습니다. 페이지를 업데이트할 때 한 번이 아니라 두 번 클릭해야 합니다. 정확한 기능에 대한 단서가 많지 않은 설명이 없는 아이콘이 있습니다.
  • 더 작은 디스플레이의 경우 사용자가 아래로 스크롤할 때 3열 레이아웃이 혼동될 수 있습니다. 이 세 개의 열에는 구텐베르크 편집기, 관리 메뉴 및 구텐베르크 사이드바가 포함됩니다. 화면 크기가 12인치 이하인 경우 특히 그렇습니다.
  • 편집기 옆과 아래에 메타 상자가 확장 설정에서 표시되지 않습니다.

단락에 단축 코드가 없습니다.

  • 현재로서는 단락 블록이나 텍스트 열에서 단축 코드를 실행할 가능성이 없습니다.
  • 그것들을 작동시키려면 단축 코드 블록에 통합되어야 합니다.
  • 단축 코드가 연도 또는 인라인 클릭 유도문안과 같은 인라인 콘텐츠를 생성하는 경우 몇 가지 문제가 발생할 수 있습니다.
  • 게시물/페이지의 단축 코드는 Gutenberg가 기존 사이트에 통합된 경우에도 계속 작동할 수 있습니다. 개발자는 현재 플랫폼이 중단되지 않도록 더 잘 수행했습니다.

단락에 다른 삽입 또는 이미지 없음

  • 구텐베르크에서 이미지에는 블록이 필요합니다. 따라서 이미지 주위에 텍스트를 줄 바꿈할 수 없습니다.
  • 유사하게, 비디오나 오디오와 같은 임베딩에도 블록이 필요합니다. 그렇지 않으면 Vimeo, YouTube 등의 삽입이 Gutenberg의 텍스트 열이나 단락에서 더 이상 작동하지 않을 수 있습니다.

주요 접근성 문제(적어도 현재로서는)

  • 현재 구텐베르크는 접근성 문제에 직면해 있습니다. 편집기의 백엔드를 사용하여 액세스하는 데 몇 가지 중요한 문제가 있을 수 있습니다. 이는 프론트엔드(즉, 인라인 CSS)의 콘텐츠 출력에도 적용됩니다.
  • 최종 릴리스 전에 WP 접근성 팀에서 이러한 문제를 해결할 수 있습니다.
    - 일반적으로 워드프레스는 접근성이 우선입니다.
    - 인라인 CSS는 현재 프론트엔드에서 렌더링하기 전에 HTML 주석에 보존되어 있기 때문에 개발자가 이 문제를 해결하는 방법은 이제 큰 문제입니다.

이전 테마는 HTML 5 출력을 다루지 않습니다.

  • 편집기는 그림 및 섹션과 같은 HTML 5 태그를 사용하여 출력 내용을 차단합니다.
  • 많은 오래된 테마에는 태그 스타일 지정을 위한 CSS가 없습니다. 따라서 이러한 태그에 대한 패딩 또는 여백이 없을 수 있습니다.
  • 구텐베르크 자체에는 이를 설명하는 스타일시트가 없습니다.
구텐베르그로 아직 해결되지 않은 것이 많다

테마와 구텐베르크 편집자의 관계:

  • 앞서 언급했듯이 구텐베르크는 전체 스타일이 아니라 내용에 중점을 둡니다. 여전히 블록에 배경색을 추가할 수 있지만 이는 인라인 스타일에 더 가깝습니다.
  • 지금은 여백과 블록 패딩이 처리되지 않습니다.
  • 다른 WordPress 페이지 빌더를 사용하면 열, 행, 간격 등에 대한 제어를 쉽게 미세 조정할 수 있습니다. 현재 Gutenberg는 이에 대한 테마에 의존하고 있습니다.
  • Gutenberg 테마 지원과 관련하여 문서에는 정보가 거의 없습니다. 여기에는 광범위한 이미지 지원, 블록 지원 및 색상 팔레트 지원도 포함됩니다.
  • 구텐베르크 편집기에 스타일을 적용하고 스타일시트를 사용하는 것과 관련된 약간의 정보가 문서에 있습니다.
  • 가장 큰 문제는 구텐베르크가 아직 웹 개발/디자인 초보자를 위한 문제를 해결하지 못했다는 것입니다. 그들은 Gutenberg가 돕고자 하는 청중이지만, 이 사람들의 대부분은 테마와 WordPress 시스템 간의 관계가 어떻게 작동하는지 전혀 모릅니다.

Gutenberg는 WordPress의 핵심에 어떻게 통합될 것입니까?

지금까지 구텐베르그가 워드프레스 코어의 일부가 될 것이라는 징후가 보입니다. 워드프레스 버전 5.0은 2018년에 출시될 예정입니다.
편집기가 기본적으로 활성화되어 있는지 아니면 선택에 따라 비활성화할 수 있는지 궁금한 경우 이 질문에 대한 답변은 아직 없습니다. 이 시점에서 어떤 것도 확실하게 말할 수 없습니다. 아마도 편집기는 REST API와 같은 방식으로 실행될 것입니다(기본적으로 켜져 있음). 또한 단일 목적 플러그인이나 iThemes Security와 같은 다른 보안 플러그인을 사용하여 쉽게 비활성화할 수 있습니다.

대부분의 사람들은 'Disable Gutenberg' 플러그인이나 코드 블록이 함께 제공될 것이라고 생각합니다. 유명한 페이지 빌더는 설정에서 Gutenberg를 비활성화하는 옵션을 포함할 수 있습니다. 한 가지 인기 있는 제안은 Jetpack에서 제공하고 사용자가 해당 플랫폼을 사용하여 활성화하도록 하는 것입니다.

구텐베르크 워드프레스 에디터 출시일

현재까지 공식적인 출시일은 발표되지 않았습니다.

그러나 Matt Mullenweg는 다음과 같이 말했습니다. "구텐베르크 팀은 한 발 물러서고 있습니다. 그들은 다른 라이브러리를 사용하여 구텐베르크를 다시 작성하기 위해 수행하고 있습니다. 이로 인해 구텐베르크 릴리스가 지연될 수 있습니다. 최소 몇 주 지연됩니다. 이것이 바로 그 이유입니다. 구텐베르크의 출시가 2018년으로 미뤄졌다"고 말했다.

이 특정 발언에 대해 많은 강한 반응이 있었습니다. 예를 들어 Yoast 는 다음과 같이 말했습니다.

"Yoast에서 우리는 이 단어에 대해 꽤 충격을 받았습니다. 현재 형태에서 Gutenberg는 주류 사용을 위한 준비가 전혀 되어 있지 않습니다. 사실, 우리는 그것이 2018년 상반기에 출시될 준비가 되어 있지 않다고 봅니다. 또한 출시 준비가 되었다는 것은 커뮤니티가 모든 통합을 수정할 충분한 시간이 있음을 의미합니다. 그러나 현시점에서 플러그인을 Gutenberg와 통합하는 것은 전혀 불가능합니다. 플러그인 작성자는 도대체 어떻게 할 수 있습니까? 몇 개월 안에 통합을 구축하려면? 그건 불가능합니다. 최소한 문제를 해결하지 않고는 말입니다."

Yoast는 Gutenberg를 위한 대체 코스를 추천합니다.

"우리는 블록에 대한 아이디어에 매우 열광합니다. 그러나 우리는 일부 기술적인 선택에 대해 강한 우려를 가지고 있습니다. 또한 구현 프로세스의 속도에 대해서도 우려하고 있습니다. 게다가, 우리는 액세스 가능성 문제에 우선 순위가 부여되지 않는 것에 대해 걱정하고 있습니다. 그래도 플러그인이 새 편집기와 통합되지 않는다는 사실에 대해 매우 우려하고 있습니다."

Yoast는 플러그인을 Gutenberg와 통합하는 개념에 대해 논의했습니다.

"우리는 모든 기능을 분해하는 것부터 시작했습니다. 게다가 우리는 그것들을 구텐베르그에 통합할 수 있는 위치를 알아보기 시작했습니다. 그러나 우리는 편집기 아래에 있는 하나의 거대한 상자를 유지하는 것이 고객에게 가장 잘 봉사할 것이라고 생각하지 않습니다. 따라서, 우리는 행동이 일어나는 바로 그곳에 통합하는 편이 훨씬 낫습니다. 구텐베르그는 우리에게 그런 기회를 제공합니다."

구텐베르크에 대해 어떻게 생각하십니까?

이에 대한 답을 얻으려면 Gutenberg를 꼭 시도해 보십시오. 또한 테스트 사이트에서 구텐베르그 워드프레스 에디터를 사용해 살펴보세요. 그 후, 당신이 그것에 대해 좋아하거나 싫어하는 것을 알려주십시오.

그래도 Gutenberg 팀에 직접 피드백을 제출할 수 있습니다. Gutenberg의 사이드바 메뉴에서 피드백 섹션으로 이동하십시오. 구텐베르그와 함께 일한 경험에 대해 이야기하십시오. 결과적으로, 당신은 이 프로젝트를 성공적으로 만드는 데 일부가 될 것입니다.