구텐베르크 워드프레스 에디터: 당신이 알아야 할 10가지

게시 됨: 2020-10-23

WordPress 블록 편집기라고도 하는 Gutenberg WordPress 편집기는 이제 WordPress 핵심의 일부입니다. WordPress 편집기에 대한 이 새로운 접근 방식은 무엇을 의미합니까? 이미 WordPress 페이지 빌더를 사용하고 있다면?

이 가이드에서는 새로운 WordPress용 Gutenberg 편집기의 기본 사항과 알아야 할 사항을 안내합니다.

이 가이드에서

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

    WordPress 블록 편집기라고도 하는 Gutenberg WordPress 편집기는 WordPress 5.0+에 포함된 새로운 페이지 빌더입니다. Gutenberg 편집기는 모든 최신 WordPress 웹 사이트에 콘텐츠 블록 및 페이지 빌더와 유사한 기능을 추가합니다.

    Gutenberg는 TinyMCE(WYSIWYG)를 게시물 및 페이지의 기본 콘텐츠 편집기로 사용했던 이전 WordPress 클래식 편집기를 대체합니다. Gutenberg를 사용하면 콘텐츠가 하나의 더 큰 콘텐츠 영역이 아닌 개별 "블록"에 추가됩니다.

    새로운 WordPress 블록에는 단락, 제목, 목록, 이미지, 갤러리, 포함 등의 모든 것이 포함됩니다.

    구텐베르크 워드프레스 편집기

    Gutenberg는 WordPress 5.0과 함께 출시되었으며, 이는 몇 년 만에 WordPress에 대한 가장 큰 업데이트였습니다. Gutenberg가 출시된 후 WordPress로 웹 사이트를 개발, 사용 및 디자인하는 많은 사람들이 참여하는 새로운 WordPress 편집기에 대한 건전한 논쟁이 계속되고 있습니다.

    구텐베르크의 목적

    Gutenberg 편집기의 주요 목표는 사용자가 보다 유연하게 게시물과 페이지를 만들 수 있도록 돕는 것이었습니다. Gutenberg는 WordPress가 다른 페이지 구축 웹 사이트 플랫폼과 보다 직접적으로 경쟁할 수 있도록 돕기 위한 것이라고 추측할 수도 있습니다.

    문맥상 새로운 구텐베르크 워드프레스 편집기의 목적에 대한 몇 가지 인용문이 있습니다.

    • "블록 편집기의 목표는 WordPress에 풍부한 콘텐츠를 간단하고 즐겁게 추가하는 것입니다." – WordPress.org의 Gutenberg 플러그인 설명에서.
    • “구텐베르그는 워드프레스의 중요한 발전입니다. Gutenberg는 WordPress가 단순히 기사를 작성하는 것이 아니라 콘텐츠 레이아웃을 구축할 수 있도록 합니다. 이는 WordPress에서 보다 단순화된 사용자 경험을 위해 일어나는 많은 전환 중 하나입니다.” – Zack Katz, WordCamp Denver 2017에서 연설

    구텐베르크가 워드프레스로 나아가는 이유는 무엇입니까? WordPress 비주얼 편집기는 수년 동안 정체되었습니다. 그것은 예측할 수 있었지만 정확히 환상적인 경험은 아니었습니다. 목표는 Wix 및 Squarespace에서 제공하는 것과 같은 신규 사용자에게 보다 직관적인 인터페이스를 제공하는 것입니다.

    1. WordPress 설립자 Matt Mullenweg는 Gutenberg를 완전히 뒤졌습니다.

    • The State of the Word 2016에서 Mullenweg는 비주얼 편집기가 2017년의 세 가지 핵심 초점 중 하나가 될 것이라고 발표했습니다.
    • Matt는 올해 초 Gutenberg의 프로젝트 리더를 맡았고 Automattic 직원인 Matias Ventura와 Joen Asmussen에게 개발을 이끌도록 할당했습니다.
    • 여기에서 Matt의 Gutenberg에 대한 견해를 읽어보십시오. 우리는 그것을 구텐베르그라고 부르는 이유가 있습니다.
    • 또한 Gutenberg는 REACT 자바스크립트를 사용하여 작성되었습니다. 최근 페이스북이 MIT 라이선스에 따라 프로젝트를 재라이센스하기로 한 움직임에 따라 Matt Mullenweg는 WordPress.com과 Gutenberg가 다른 라이브러리를 사용하여 다시 작성될 것이라고 발표했습니다. 다음은 REACT 및 WordPress에 대한 추가 정보입니다.

    2. Gutenberg는 아직 활발히 개발되고 있는 최초의 별도 플러그인이었습니다.

    구텐베르그가 워드프레스의 핵심 버전으로 롤링되기 전에 구텐베르크는 사용자가 그것을 테스트하고 워드프레스 내에서 콘텐츠를 작성하고 편집하는 방식이 어떻게 변경되는지 확인할 수 있는 별도의 플러그인으로 먼저 개발되었습니다.

    구텐베르크
    • 오늘날에도 Gutenberg 플러그인은 매주 업데이트를 통해 활발하게 개발되고 있습니다.
    • Gutenberg 플러그인은 일반적으로 핵심 WordPress보다 앞서 여러 버전이 릴리스되므로 WordPress 블록 편집기의 새로운 기능이 WordPress 코어에 도입되기 전에 미리 볼 수 있습니다.
    • Gutenberg 플러그인을 실행하면 WordPress 블록 편집기의 최신 새 기능을 얻을 수 있습니다. 또한 개발자와 클라이언트와 함께 작업하는 사람들이 블록 편집기의 미래에 대해 아는 데 매우 유용합니다.

    3. 구텐베르크는 기본 콘텐츠 편집기로 WordPress 5.0에 추가되었습니다.

    2018년 12월 16일 워드프레스 5.0이 출시되었습니다. WordPress의 이 주요 버전 릴리스에는 게시물 및 페이지 편집기에 대한 대대적인 점검이 포함되어 Gutenberg를 기본 WordPress 편집기로 도입했습니다.

    eBook 다운로드: Gutenberg WordPress Editor에 대한 궁극적인 가이드
    PDF 다운로드

    WordPress 역사상 가장 기대되고 뜨거운 논쟁이 된 릴리스인 Gutenberg 편집기는 WordPress가 시작된 이후로 사용되었던 이전의 클래식 편집기에서 극적인 출발을 나타냈습니다. 일부 사용자는 5.0 릴리스 이후 WordPress 편집기의 급격한 차이에 당황했을 수 있습니다.

    4. 구텐베르크는 일반적으로 WordPress 블록 편집기라고도 합니다.

    시간이 지남에 따라 새로운 WordPress 편집기를 무엇이라고 불러야 할지에 대해 여전히 약간의 혼란이 있습니다. 프로젝트 이름은 구텐베르크였으므로 일부 사람들은 여전히 ​​그것을 구텐베르크 편집기 및 그 "블록" 구텐베르크 블록이라고 부릅니다.

    워드프레스 블록 편집기

    반면에 새 편집기는 WordPress 사용자 인터페이스 내에서 블록 편집기라고 합니다. WordPress.org의 문서에서는 단순히 WordPress 편집기라고 부릅니다.

    5. 구텐베르크는 버전마다 계속 발전하고 개선합니다.

    2018년 12월부터 모든 주요 WordPress 코어 버전에는 Gutenberg Editor의 새로운 기능, 개선 사항 및 버그 수정이 포함되었습니다. 편집 경험은 계속해서 좋은 방향으로 발전해 왔습니다.

    예를 들어, WordPress 5.5의 주요 새 기능 및 개선 사항은 주로 블록 편집기와 관련이 있습니다. 사용자 인터페이스, 접근성, 끌어서 놓기 및 기타 사용성 문제에 대한 개선 사항은 계속해서 해결됩니다.

    참고: 주요 버전의 WordPress 또는 Gutenberg 플러그인을 실행하기 전에 BackupBuddy와 같은 WordPress 백업 플러그인을 사용하여 WordPress 웹사이트를 백업하는 것이 좋습니다.

    6. 계속해서 확장되고 개선되는 구텐베르그 블록

    Gutenberg의 주요 목표는 WordPress 내에서 게시물과 페이지가 구성되고 편집되는 방식과 관련하여 더 우수하고 풍부한 콘텐츠 편집 환경을 만드는 것이었습니다. 그 외에도 구텐베르크의 비전은 포스트/페이지 편집기를 넘어 위젯과 사이드바, 심지어 웹사이트의 머리글과 바닥글까지 확장됩니다.

    기본적으로 Gutenberg를 사용하면 게시물이나 페이지를 가져오고 콘텐츠를 다양한 "블록"으로 나눌 수 있습니다. 예를 들어, WordPress 블록에는 이미지 블록, 단락 블록, 인용 블록, 헤드라인 블록, 심지어 버튼 블록도 포함됩니다. WordPress 블록: 구텐베르그 블록에 대한 궁극적인 가이드 에서 자세히 읽어보세요.

    다음은 구텐베르크 편집기에 포함된 몇 가지 기본 WordPress 블록입니다.

    워드프레스 블록 설명
    오디오 간단한 오디오 플레이어를 포함합니다.
    버튼 아름다운 버튼으로 전환을 유도하세요.
    카테고리 모든 범주의 목록을 표시합니다.
    권위 있는 클래식 WordPress 편집기 사용
    암호 간격과 탭을 준수하는 코드 조각을 표시합니다.
    여러 열에 콘텐츠를 표시하는 블록을 추가한 다음 원하는 콘텐츠 블록을 추가합니다.
    씌우다 텍스트 오버레이로 이미지 또는 비디오를 추가하세요. 헤더에 적합합니다.
    포함시키다 외부 소스의 비디오, 이미지, 트윗, 오디오 및 기타 콘텐츠를 포함합니다.
    파일 다운로드 가능한 파일에 대한 링크를 추가합니다.
    갤러리 풍부한 갤러리에 여러 이미지를 표시합니다.
    표제 방문자(및 검색 엔진)가 콘텐츠 구조를 이해하는 데 도움이 되도록 새 섹션을 도입하고 콘텐츠를 구성하세요.
    영상 시각적 진술을 만들기 위해 이미지를 삽입하십시오.
    최신 우편물 가장 최근 게시물 목록을 표시합니다.
    목록 글머리 기호 또는 번호 매기기 목록을 만듭니다.
    모든 내러티브의 빌딩 블록.
    인용문 가져오기 텍스트의 인용문에 특별한 시각적 관심을 주십시오.
    인용하다 인용된 텍스트를 시각적으로 강조합니다.
    "더 읽기" 요소 추가
    분리 기호 가로 구분 기호를 사용하여 아이디어 또는 섹션 사이에 구분선을 만듭니다.
    짧은 코드 WordPress 단축 코드로 추가 사용자 정의 요소를 삽입하십시오.
    스페이서 블록 사이에 공백을 추가하고 높이를 사용자 지정합니다.

    7. 구텐베르크를 비활성화할 수 있지만 영원히는 아닐 수도 있습니다.

    구텐베르크 편집자가 마음에 들지 않습니까? 새 블록 편집기가 사이트를 실행하는 기존 테마 또는 플러그인과 정확히 호환되지 않는다는 것을 알게 되는 경우가 있습니다. 좋은 소식은 ... 라는 플러그인을 사용하여 클래식 편집기로 돌아갈 수 있다는 것입니다.

    클래식 편집기

    Classic Editor는 이전("클래식") WordPress 편집기와 "게시물 편집" 화면을 복원하는 WordPress 팀에서 유지 관리하는 공식 플러그인입니다. 해당 화면을 확장하거나, 구식 메타 상자를 추가하거나, 이전 편집기에 의존하는 플러그인을 사용할 수 있습니다.

    WordPress 팀에 따르면 Classic Editor는 최소 2022년까지만 완전히 지원되고 유지 관리되는 공식 WordPress 플러그인입니다. 최근에 "또는 필요한 만큼"을 추가했지만.

    WordPress에서 클래식 편집기를 사용하는 방법에 대한 자세한 내용은 다음과 같습니다.

    8. 구텐베르크는 이제 제3자 블록 디렉토리를 갖게 되었습니다.

    WordPress 블록 디렉토리는 WordPress 사용자가 WordPress 블록 편집기 내에서 타사 WordPress 블록을 검색, 설치 및 테스트할 수 있는 새로운 방법입니다. WordPress 5.5에 도입된 WordPress 블록 디렉토리를 사용하면 필요에 가장 잘 맞는 WordPress 블록을 더 쉽게 찾을 수 있습니다.

    검색 워드프레스 블록

    WordPress.org 플러그인 디렉토리에서 블록 플러그인을 다른 플러그인과 어떻게 구별해야 하는지에 대한 논의를 기반으로 단일 블록 플러그인만 포함하는 플러그인 디렉토리 내의 섹션으로 새로운 블록 디렉토리가 생성 되었습니다. 새로운 WordPress 블록 디렉토리는 기본 플러그인 디렉토리와 분리되어 있으므로 일반 WordPress 플러그인 또는 단일 블록 플러그인을 탐색하고 있습니다.

    단일 블록 플러그인은 단일 구텐베르크 블록을 제공하는 비교적 작고 간단한 플러그인이므로 플러그인 블록입니다.

    이제 WordPress 5.5에서는 필요한 블록을 그 어느 때보다 쉽게 ​​찾을 수 있습니다. 새로운 WordPress 블록 디렉토리는 블록 편집기에 바로 내장되어 있으므로 편집기를 종료하지 않고도 사이트에 새 블록 유형을 설치할 수 있습니다.

    페이지 왼쪽 상단에 있는 "+" 아이콘을 사용하여 새 블록 삽입기를 사용하고 사용 가능한 블록을 검색하기만 하면 됩니다. 블록 디렉토리는 여전히 상당히 새롭기 때문에(여전히 옵션이 많지 않고 리뷰가 거의 없음) 미래에 실제로 이륙할 것입니다.

    9. 완전한 페이지 구축을 위한 새로운 블록 패턴

    WordPress 5.5에서 블록 편집기는 블록 패턴 이라는 새로운 개념을 도입했습니다 . 이제 블록 패턴을 사용하여 미리 정의된 블록 레이아웃을 만들고 공유할 수 있습니다. 블록 패턴은 블록 편집기가 페이지 빌더가 될 수 있는 진정한 길을 열어줍니다. 블록 편집기가 이 방향으로 계속 발전함에 따라 블록 패턴이 이륙할 수 있는지 확인하십시오.

    워드프레스 블록 패턴

    등록된 블록 패턴은 화면 좌측 상단의 “+” 아이콘을 이용하여 찾을 수 있습니다. 이제 블록 및 패턴 탭 (있는 경우 재사용 가능)이 모두 표시되므로 이러한 옵션 간에 전환할 수 있습니다. 그런 다음 다른 블록과 마찬가지로 게시물/페이지에 블록 패턴을 추가할 수 있습니다.

    새로운 블록 패턴을 사용하면 혼합하고 일치시킬 수 있는 블록 조합을 사용하여 복잡하고 아름다운 페이지 및 게시물 레이아웃을 간단하게 만들 수 있습니다. 또한 다양한 플러그인과 테마에서 블록 패턴을 찾을 수 있으며 계속 추가됩니다.

    워드프레스 5.5 출시 화면

    WordPress 5.5에는 여러 블록 패턴이 내장되어 있지만 타사 플러그인 및 테마가 추가 블록 패턴을 등록하거나 기존 패턴을 제거하는 것도 가능합니다. 작동 중인 블록 패턴을 보려면 Twenty Twenty 기본 테마를 확인하세요. Twenty Twenty는 최신 버전의 WordPress로 가능한 것을 실제로 강조하므로 개발 서버에 설치하는 것이 항상 좋은 테마입니다.

    10. 구텐베르크는 워드프레스 단축 코드의 필요성을 변경합니다.

    WordPress 블록 편집기 이전에 WordPress 단축 코드는 WordPress 웹 사이트의 페이지, 게시물 및 기타 섹션에 플러그인 및 테마 기능을 더 쉽게 추가할 수 있도록 WordPress 편집기를 사용하는 가장 좋은 방법 중 하나였습니다.

    블록 편집기로 이동하면 여전히 단축 코드로 가득 찬 대부분의 이전 플러그인 및 웹 사이트에 이것이 의미하는 바는 무엇입니까? WordPress 단축 코드가 계속 작동합니까? WordPress 단축 코드를 사용하여 WordPress 블록으로 쉽게 이동할 수 있는 방법이 있습니까?

    간단히 말해서 WordPress 블록 편집기는 단축 코드에 중요한 의미를 갖습니다. WordPress 블록 편집기는 대부분의 플러그인 및 테마에 대한 단축 코드의 필요성과 목적을 근본적으로 변경합니다. 블록 기반 편집 시스템을 사용하면 페이지의 각 "요소"에는 편집 가능한 WYSIWYG 편집기 하나에 포함되지 않고 자체 블록이 있습니다.

    구텐베르크 WordPress Editor에 대한 참고 사항

    이것은 내가 지금까지 읽은 구텐베르크에 관한 최고의 기사 모음입니다.

    Chris Lema는 구텐베르크에 대해 이야기합니다.

    http://chrislema.com/misunderstanding-goal-gutenberg-writing-experience/

    발췌:

    • “이 플러그인의 문제를 해결하려면 사람들이 한 인터페이스에서 편집하고 자신의 작업 결과물이 생각한 것처럼 보이지 않는 다른 인터페이스에 나타나는 것을 볼 때 인지 부조화가 있어야 하지 않을까요? 일 것이다?"

    구텐베르크에 대한 비버 빌더의 반응

    8월 업데이트 – 2.0, Themer 및 Gutenberg, Oh My!

    발췌:

    • “요컨대, 우리는 구텐베르크를 정말 흥분하고 지지합니다! 우리의 희망은 프로젝트가 Beaver Builder가 수용하고 확장할 수 있는 것으로 계속 발전하는 것입니다. 우리는 프로젝트의 핵심 팀과 협력해 왔으며, 우리 비즈니스와 WordPress 공간 전반에 대한 Gutenberg의 잠재적 영향에 대해 낙관적이고 조심스럽게 추측해 왔습니다. Gutenberg가 "Blocks"를 Beaver Builder 모듈과 상호 교환할 수 있거나 저장된 행을 Gutenberg 페이지로 끌어다 놓을 수 있다고 상상해 보십시오. 또는 Gutenberg의 텍스트 편집기를 Beaver Builder에서 인라인으로 사용할 수 있습니다. 재미있는 가능성이 많죠!?”

    우아한 테마

    WordPress는 Gutenberg 편집기에 응답합니다 – 검토 정리

    발췌:

    • “토론을 볼 때 모든 변경은 약간의 관성과 저항을 가져올 것임을 기억하는 것이 중요합니다. 워드프레스는 변화하는 환경에서 경쟁하기 위해 앞으로 나아가야 합니다. 그러나 이것이 제기된 우려가 유효하지 않고 해결될 필요가 없다는 것을 의미하지는 않습니다. 고맙게도 개발자들은 그렇게 하기 위해 최선을 다하고 있습니다. 하지만 얼마나 많은 사람들이 걱정하고 소외감을 느끼는지 보면 추가적인 소통이 필요할 것 같다”고 말했다.

    WPMU에 대한 다소 가혹한 리뷰

    이것은 펀치를 당기지 않습니다.

    https://premium.wpmudev.org/blog/gutenberg-editor-wordpress/

    발췌:

    • “Gutenberg 편집기 플러그인을 작업하는 개발자들은 분명히 플러그인을 만드는 데 많은 노력을 기울였으며 지금까지의 노력을 칭찬하지만 사실은 이 플러그인이 WordPress에 포함될 준비가 거의 되지 않았으며 많은 작업이 필요하다는 것입니다. 더 많은 작업, 특히 UX 작업이 필요합니다.”

    Yoast는 Gutenberg를 위한 대체 과정을 제안합니다.

    몇 가지 중요한 문제가 표시되고 솔루션이 제안됩니다.

    구텐베르크에 대한 대안적 접근

    발췌:

    • “우리는 블록에 대한 아이디어에 매우 열광하지만 일부 기술적 선택과 구현 프로세스의 속도에 대해 강한 우려를 가지고 있습니다. 우리는 또한 프로젝트에서 접근성 문제에 우선 순위가 부여되지 않은 것에 대해 걱정합니다. 그러나 가장 중요한 것은 플러그인을 새 편집기와 통합할 수 없다는 사실에 대해 매우 우려하고 있다는 것입니다.”

    Yoast는 그의 플러그인을 Gutenberg와 통합하기 위한 개념에 대해 이야기합니다.

    다음은 다른 플러그인 개발자가 따를 수 있는 리드입니다.

    https://yoast.com/gutenberg-integration/

    발췌:

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

    Caldera Forms의 조시 폴록

    그가 구텐베르그에 대해 틀렸다는 것을 증명하고자 하는 다섯 가지 방법:

    내가 구텐베르크에 대해 틀렸다는 것을 증명하고 싶은 5가지 방법

    발췌:

    • “이것은 WordPress의 미래에 대한 중대한 결정입니다. 저는 커뮤니티로서 우리가 이것을 바로잡을 것이라고 믿습니다. 그러나 그것을 올바르게 하기 위해서는 많은 테스트, 반복 및 토론이 필요할 것입니다.”

    마무리: 구텐베르크에 대해 어떻게 해야 합니까?

    • 시도 해봐. 구텐베르크에 대해 알아보세요. 테스트 사이트나 실제 사이트에서 사용해 보십시오(예, 충분히 안정적입니다). 당신이 그것에 대해 좋아하는 것과 싫어하는 것을보십시오.
    • 피드백을 제출하십시오. Gutenberg 플러그인은 최근 사이드바 메뉴 항목 아래에 피드백 링크를 추가했습니다. 시간을 내어 Gutenberg를 사용한 경험에 대해 잘 고려한 관찰을 제공하십시오. "너희들은 바보야"는 그들이 찾고 있는 것이 아닙니다.
    • 당황하지 마세요. 이에 대해 많은 좋은 사람들이 사려 깊은 토론을 하고 있습니다. 블록 편집기는 계속해서 개선되고 있으며 익숙해지는 데 시간이 걸리기는 하지만 이제 새 편집기를 완전히 채택한 것이 좋은 조치였다는 데 동의합니다.

    더 많은 WordPress 블록 편집기(구텐베르크 편집기) 리소스

    WordPress 재사용 가능 블록: 최고의 가이드

    WordPress 재사용 가능 블록은 WordPress 블록 편집기의 강력한 기능입니다. 재사용 가능한 블록을 사용하면 자주 사용하는 WordPress 블록을 빠르게 저장할 수 있습니다. 더 읽기…

    워드프레스 블록 디렉토리

    WordPress 블록 디렉토리: 필수 가이드

    WordPress 5.5에 도입된 WordPress 블록 디렉토리를 사용하면 필요에 가장 잘 맞는 WordPress 블록을 더 쉽게 찾을 수 있습니다. 더 읽기…

    워드프레스 블록

    WordPress 블록: 구텐베르크 블록에 대한 궁극적인 가이드

    구텐베르크 블록이라고도 하는 워드프레스 블록을 사용하면 사용자는 게시물과 페이지에 풍부한 콘텐츠를 보다 쉽게 ​​시각적인 방식으로 생성할 수 있습니다. 더 읽기…

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