페이지 빌더에서 WordPress Gutenberg 블록 편집기로 전환하는 문제

시간이 왔습니다. WordPress Gutenberg 블록 편집기는 기존 웹사이트를 지원하기에 충분히 안정적입니다. 이제 네이티브 콘텐츠 편집기를 위해 오래된 페이지 빌더 플러그인을 피할 수 있습니다.

이것이 내가 처한 상황입니다. 수년 동안 번들로 제공되는 구식 페이지 빌더를 사용해 온 클라이언트는 변화할 준비가 되어 있습니다. 따라서 저는 기존 레이아웃과 기능을 블록으로 변환하는 일을 도와야 합니다.

매우 흥미로운 과정이었습니다. 그리고 그것은 우리가 직면하고 있는 다른 웹 디자이너들에게 내기를 걸고 있습니다.

그것으로, 제가 그 과정에서 배운 몇 가지를 공유하고 싶습니다(힌트: 많은 도전 과제가 있습니다.) 그러나 문제점을 조기에 식별함으로써 도로에서 이러한 충돌을 부드럽게 할 수 있습니다. 여기 우리가 간다!

왜 구텐베르크로 전환합니까?

모든 핵심을 파헤치기 전에 다룰 단계를 설정해 보겠습니다. 이 중 일부는 내 특정 프로젝트에만 해당되지만 상당히 일반적인 상황을 나타내는 것이기도 합니다.

시간이 멈춘 페이지 빌더

페이지 빌더 플러그인은 장기간 유지하기로 약속하는 한 사용하기에 좋습니다. 그러나 너무 자주 테마의 일부로 번들로 제공되고 단순히 최신 상태로 유지되지 않습니다.

이 경우 플러그인은 여전히 ​​잘 작동합니다. 그러나 WordPress 자체에 대한 임박한 변경은 그 날짜를 계산할 수 있음을 의미합니다.

또 다른 장애물은 페이지 빌더에 클라이언트별 기능을 수행하기 위한 몇 가지 사용자 정의 확장이 있다는 것입니다. 따라서 편집 도구를 변경할 때는 이를 고려해야 합니다.

네이티브로 가기로 한 결정

물론, 페이지 빌더에 대한 새 라이센스를 얻고 소프트웨어를 업데이트할 수 있습니다. 그러나 다시 말하지만 이러한 도구를 사용하는 데는 장기적인 약속이 있습니다. 이는 라이선스를 준수할 뿐만 아니라 콘텐츠 생성의 제3자 방법에 자신을 가두는 것을 의미합니다.

반면에 Gutenberg는 기본 솔루션입니다. WordPress 코어의 일부이기 때문에 유지 관리 체인에 하나의 링크가 적습니다. 또한 달성하려는 거의 모든 작업을 수행하도록 사용자 지정할 수 있습니다.

즉, 블록 편집기에는 상상할 수 있는 모든 기능이 포함되어 있지 않습니다. 즉, 필요한 것을 구축하거나 이를 수행할 타사 플러그인을 찾는 것입니다.

그러나 결국 (비교적으로) 가장 지속 가능한 경로를 제공합니다. 따라서 스위치를 사용하는 것이 좋습니다.

레이아웃 복제는 비교적 쉽습니다.

페이지 빌더를 사용하는 가장 큰 이유 중 하나는 복잡한 레이아웃을 만드는 것이 간단하기 때문입니다. 여러 행, 열 또는 둘의 조합이 필요한지 여부에 관계없이 모두 손이 닿는 곳에 있습니다. 몇 번의 클릭, 드래그 앤 드롭으로 원하는 레이아웃을 얻을 수 있습니다.

어떤 경우에는 이것이 페이지 빌더가 사용되는 기본 작업일 수 있습니다. 그렇다면 구텐베르크 블록 편집기로의 전환은 그리 어렵지 않을 것입니다.

물론 블록으로 레이아웃을 만들 때는 처음부터 시작해야 합니다. 그러나 포함된 열 및 그룹 블록의 조합은 프로세스를 단순화할 수 있습니다. 특정 레이아웃을 반복해야 하는 경우 사용자 지정 블록 패턴이 큰 도움이 됩니다.

단점? 블록 편집기의 UI는 일부 페이지 빌더만큼 많은 제어를 허용하지 않을 수 있습니다. 따라서 레이아웃을 근사화하거나 CSS를 사용하여 추가 작업을 수행하는 것 중에서 선택해야 할 수 있습니다.

유사한 기능을 원하십니까? 히트 오어 미스입니다.

기본적으로 Gutenberg는 페이지 빌더와 동일한 기능을 모두 제공하지 않습니다. 확고한 출발점을 제공하는 것을 목표로 합니다. 따라서 페이지 빌더에서 전환하면 거위 추격에 빠질 수 있습니다.

블록 플러그인 형태로 필요한 것을 찾을 수 있습니다. 레이아웃과 마찬가지로 블록에서 사용할 수 있는 기능은 페이지 빌더의 기능과 동일하지 않을 수 있습니다. 그것은 약간의 타협을 하거나 일을 다른 방향으로 취하는 것을 의미할 수 있습니다.

블록 편집기를 차별화하는 다른 옵션은 사용자 정의 블록을 생성하는 기능입니다. 이를 통해 요구 사항에 정확히 맞는 기능을 구축할 수 있습니다.

사용자 정의 블록으로 많은 것이 가능하지만 궁극적으로 개발 기술에 달려 있습니다. 기본적으로 빌드된 블록에는 React에 대한 지식이 필요합니다. 이는 모든 사람(당신을 포함하여)이 가지고 있지 않은 것입니다.

고맙게도 다른 기술이 있습니다. 예를 들어 고급 사용자 정의 필드를 통해 블록을 생성합니다. 프로세스를 훨씬 쉽게 만들어주는 익숙한 도구입니다.

예, 관련 종속성이 있습니다. 그러나 미래에 기본적으로 블록을 다시 빌드해야 하는 경우에는 가능합니다. 그러나 페이지 빌더와 달리 편집기를 완전히 변경할 필요는 없습니다.

구현에는 계획이 필요합니다

새 편집기로 웹사이트 재설계를 시작하는 것이 이상적입니다. 그것은 깨끗한 슬레이트에 대한 기회를 제공합니다. 그러나 기존 사이트에서 전환을 시도한다면 어떻게 될까요?

페이지 빌더 기반 콘텐츠를 블록 편집기로 변환하려면 계획이 필요합니다. 완벽한 세상에서는 한 번에 모든 것을 공개할 것입니다. 그러나 그것이 항상 가능한 것은 아닙니다. 특히 더 큰 웹사이트에서는 더욱 그렇습니다.

그래서, 당신은 무엇을합니까? 우선, 준비 환경이 있으면 도움이 됩니다. 이렇게 하면 프로덕션 웹 사이트의 정확한 복제본을 만들고 필요한 변경 사항을 테스트할 수 있습니다. 커스텀 블록의 일종의 시험장 역할을 할 수 있습니다. 이렇게 하면 예상치 못한 문제가 사용자를 괴롭히는 것을 방지할 수 있습니다.

더 좋은 점은 사이트가 많이 변경되지 않은 경우 이러한 모든 변경 사항을 스테이징에서 프로덕션으로 푸시할 수 있다는 것입니다.

그렇지 않은 경우 단편적인 접근 방식이 적절할 수 있습니다. 여기에는 한 번에 한 페이지를 변환하는 작업이 포함될 수 있습니다.

이를 안전하게 수행하는 한 가지 방법은 새 페이지(공개 보기에서 숨겨짐)를 만든 다음 필요에 맞게 빌드하는 것입니다. 거기에서 준비가 되면 이전 것을 교체할 수 있습니다. Gutenberg의 코드 편집기 보기를 사용하면 해당 블록 데이터를 모두 복사하여 다른 페이지에 붙여넣을 수 있습니다. 영구적으로 변경하기 전에 백업을 만들고 가능한 한 많이 테스트하십시오.

그럼에도 불구하고 웹 사이트의 페이지 빌더 사용에 대해 연구하는 것이 필수적입니다. 그런 다음 블록 편집기로 대체할 계획을 세웁니다.

WordPress의 미래를 위한 블록으로 구축

기존 웹사이트를 페이지 빌더에서 Gutenberg 블록 편집기로 전환하는 것은 어려울 수 있지만 매우 가능합니다. 이전 편집기로 만든 콘텐츠를 풀고 블록으로 다시 만들어야 하는 프로세스입니다.

난이도는 몇 가지 핵심 요소에 따라 다릅니다. 하나는 이전 페이지 빌더를 사용하는 콘텐츠의 양과 유형이 여러분 앞에 놓인 작업량을 결정합니다.

또한 Gutenberg 내에서 모양과 기능을 복제해야 하는 정도도 중요합니다. 요소를 재구성할 수 있다면 실제로 웹사이트를 개선할 수 있는 좋은 기회입니다. 그러나 이전의 방식을 고수할수록 더 어려워집니다.

그럼에도 불구하고 구텐베르크로 이전하는 것이 가장 미래 친화적인 솔루션이 될 수 있습니다. 적절한 상황에서 그것만으로도 노력할 가치가 있습니다.