전체 사이트 편집 기능이 포함된 10가지 WordPress 블록 테마

WordPress는 블로깅 솔루션으로만 여겨지던 것에서 먼 길을 왔습니다. Gutenberg Editor의 출시 이후 – 플랫폼은 블록 개념을 사용하여 사용자에게 디자인 선택에 더 많은 자유를 주기 위해 지속적으로 추진해 왔습니다.

Blocks의 궁극적인 목표는 WordPress를 웹사이트 빌더로 바꾸는 것입니다. 플러그인을 사용하여 이미 어느 정도 가능하고 최근에는 전체 사이트 편집 기능이 추가되었습니다. FSE는 WordPress 사용자가 프런트 엔드에서 직접 사이트 디자인의 스타일을 지정할 수 있는 새로운 종류의 웹 사이트 구축 경험입니다.

전체 사이트 편집이란 무엇입니까?

간단히 말해서 전체 사이트 편집 기능을 사용하면 WordPress 사용자가 코드를 작성하지 않고도 (블록) 테마의 디자인을 변경할 수 있습니다. 이 새로운 기능은 Blocks의 기반 위에 구축된 테마에만 사용할 수 있으므로 블록 테마에 중점을 둡니다.

WordPress 사용자는 이미 Gutenberg Editor를 사용하여 블록을 사용하여 블로그 게시물을 작성하는 데 익숙합니다. FSE에 대한 아이디어는 동일합니다. 블로그 게시물을 작성하는 것처럼 전체 사이트 편집기를 사용하여 블록을 사용하여 사이트 디자인을 편집할 수도 있습니다.

차단 테마(예: Twenty Twenty-Two)를 활성화하면 관리 대시보드의 모양 탭 아래에 새로운 옵션이 표시됩니다. 에디터 라고 합니다.

편집기 를 클릭하면 즉시 새로운 전체 사이트 편집 대시보드로 이동합니다. 열리는 기본 페이지는 홈페이지입니다. 그러나 테마에서 지원하는 모든 페이지를 선택하고 사용자 정의를 시작할 수 있습니다. 다음은 예입니다.

위의 데모에는 다음이 있습니다.

1. 바닥글 블록을 전체 섹션으로 선택했습니다.
2. 블록 편집기를 사용하여 배경색을 변경했습니다.

커스텀 CSS를 작성할 필요가 없었습니다. 또한 단일 플러그인을 사용하지 않았습니다. 모든 변경 사항은 테마 자체에 직접 저장됩니다. 무엇보다도 이 방법으로 전체 웹사이트의 스타일을 지정할 수 있습니다.

페이지 매김 및 개별 탐색 항목을 포함하여 가장 작은 요소를 선택할 수 있습니다. WordPress 자체 내부의 기본 웹 사이트 구축 경험입니다. 그리고 상상할 수 있듯이 시간이 지남에 따라 개선될 것입니다.

WordPress의 새로운 시대를 열다

FSE의 개념은 모든 사람의 눈에 여전히 매우 신선합니다.

당분간 FSE는 Elementor 및 Visual Composer와 같은 세련된 웹 사이트 빌더와 경쟁하기 위해 고군분투할 것이라고 말하는 것이 안전하다고 생각합니다. 하지만 WordPress 6.0 및 그 이후 버전이 출시되면 상황이 극적으로 바뀔 것이라고 확신합니다.

블록 테마의 경우 개발자는 이미 이 영역에서 작업을 시작했습니다. WordPress 저장소에는 60개 이상의 테마가 있습니다. 그리고 아마도 또 다른 50개는 프리미엄 디자인과 오픈 소스 프로젝트를 통해 퍼질 것입니다.

따라서 모든 말과 완료를 통해 최고의 전체 사이트 편집 테마를 자세히 살펴볼 때라고 생각합니다. 새로운 테마가 나오면 포함하도록 자주 업데이트됩니다!

와비

Rich Tabor는 10년 넘게 WordPress 제품을 만들어 왔습니다. CoBlocks와 같은 플러그인뿐만 아니라 테마 회사인 ThemeBeans에서도 그를 알 수 있습니다. 결과적으로 Rich는 새로운 WordPress 기능의 열렬한 팬일 뿐만 아니라 전체 사이트 편집 테마를 직접 구축했습니다. 와비 테마.

내가 좋아하는 Tabor 테마와 마찬가지로 Wabi는 스토리텔러, 블로거 및 자세한 콘텐츠 게시에 관심이 있는 모든 사람을 위해 제작되었습니다. 또한 포트폴리오 사이트를 위한 탁월한 선택이며 Rich는 자신의 웹사이트에서 테마를 사용합니다.

Wabi 의 주요 기능 중 하나는 클릭 한 번으로 스타일을 전환할 수 있다는 점입니다. 밝고 어두운 테마와 여러 동적 색상 변형이 있습니다. 이렇게 하면 각 게시물에 독립적으로 스타일을 지정할 수 있는 창의적인 자유가 주어집니다.

아래 링크를 사용하여 주제에 대해 자세히 읽고 실제 작동하는 모습을 확인하십시오.

* 사용자 정의 스타일에는 구텐베르크 플러그인이 필요합니다.

토베

Anders Noren이 발표한 새로운 테마를 보는 것은 언제나 즐거운 일입니다. 세련된 디자인 접근 방식의 팬이라면 Tove 테마가 인상적일 것입니다! 그러나 디자인뿐만이 아닙니다.

테마는 전체 사이트 편집의 시작점으로 처음부터 만들어졌습니다. Anders는 독창적인 요소를 즉시 제공하기 위해 많은 노력을 기울였습니다. 그러나 디자인 외에도 테마는 작은 발자국을 남깁니다. JavaScript 또는 프런트 엔드 이미지를 사용하지 않습니다.

데모 사이트( 아래 링크 )는 레스토랑 사이트용으로 제작되었습니다. 그러나 테마의 전반적인 느낌이 마음에 들면 필요에 따라 자유롭게 조정할 수 있습니다. 전체적으로 토베 스타일 가이드에는 약 40개의 블록 패턴이 포함되어 있습니다. 이를 사용하여 WordPress 사이트 페이지에 대해 원하는 수의 디자인을 결합할 수 있습니다.

블록프레스

Blockpress는 전체 사이트 편집을 지원하는 최초의 올인원 블록 테마 중 하나인 것 같습니다. 그리고 모범 사례를 염두에 두고 구축되었습니다.

특히 Blockpress는 자산 사용에 최적화되어 있습니다. 각 페이지는 필요한 자산의 작은 공간만 사용하고 나머지는 모든 페이지에서 사용하는 블록을 기반으로 로드됩니다. 또한 테마는 jQuery 또는 외부 라이브러리를 사용하지 않습니다.

그 결과 매우 우수한 핵심 성능 평가 점수가 나옵니다. 또 다른 흥미로운 기능은 애니메이션의 포함입니다. 앞서 말했듯이 테마의 이 새로운 패러다임은 무엇에 관한 것입니다. Blockpress를 사용하면 블록 편집기에서 직접 Lottie Animations 프레임워크 기능을 사용할 수 있습니다. 성능 병목 현상도 없습니다.

아르케오

Automattic 자체가 FSE 테마를 생성한다는 것은 의미가 있습니다. 이 목록에는 몇 가지가 있으며 첫 번째는 Archeo입니다. 이 테마는 큰 타이포그래피와 함께 단순한 레이아웃을 좋아하는 작가들이 사용하도록 제작되었습니다.

디자인의 주요 개념은 영웅 섹션, 블로그 게시물의 중간 섹션 및 전용 바닥글로 큰 사진을 갖는 것입니다. 블로그 게시물 내에서 레이아웃 구조는 동일하게 유지됩니다. 물론, 당신은 주변을 바꿀 수 있는 많은 자유가 있습니다.

브릭시

Anariel Design의 Bricksy는 블록 관리의 다목적 접근 방식에 초점을 맞춘 또 다른 주제입니다. 특히, Bricksy는 달성하고자 하는 사이트 디자인의 기초 역할을 하는 다양한 블록 패턴을 포함하도록 설계되었습니다.

현재 Bricksy에는 음식, 결혼식 및 패션 블로그에 대한 데모가 있습니다. 그러나 모든 패턴을 자세히 살펴보면 이 테마를 거의 모든 프로젝트에 통합할 수 있다고 말할 수 있습니다. 템플릿 라이브러리에 대한 소개 동영상이 이 테마에 포함되어 있는 아래 웹 사이트 링크를 확인할 수 있습니다.

 패턴에 관해서는 WP Tavern의 Justin Tadlock이 작성한 이 기사를 확인하세요. WordPress는 기존 테마에 복사하여 붙여넣을 수 있는 커뮤니티 제작 블록 패턴이 있는 Patterns 디렉토리를 추가했습니다. 모든 WordPress 테마와 완벽하게 호환됩니다.

스케이트파크

Skatepark 테마는 WordPress로 구축하려는 모든 미디어 관련 웹사이트를 위한 환상적인 출발점이 될 것입니다. 전체 사이트 편집 테마로 - 귀하 가 사용자 정의할 수 있도록 제작되었습니다.

지질학자

Geologist는 또 다른 Automattic 테마입니다( 마지막 테마입니다! 전반적으로 미니멀한 스타일은 실시간 블록 관리에 최적화된 코드베이스 외에는 할 말이 없다는 것을 의미합니다.

오나 미니멀

On 테마는 미니멀 하게 설명되어 있지만 디자인 스타일이 이를 보완하는 데 많은 도움이 된다고 생각합니다. 다시 말하지만 저는 스타일리시한 타이포그래피의 열렬한 팬이며 On은 좋은 인상을 남기기 위해 그런 구조를 가지고 있습니다.

이 테마가 누구를 위한 것인지 말해야 한다면 전문가, 패션 블로거 및 깔끔한 레이아웃을 좋아하는 모든 사람을 위한 것입니다. 나는 또한 세부 사항에 대한 관심을 좋아합니다.

소셜 링크가 있는 깨끗한 구독 양식은 완벽합니다. 다른 패턴에는 포트폴리오 블록, Instagram 피드 및 멋진 전체 너비 블로그 게시물 레이아웃이 포함됩니다.

케멧

Kemet에 대한 제 인상은 일반 테마보다 프레임워크에 가깝다는 것입니다.

고정 컨테이너, 별도의 템플릿 부분 및 사용자 정의 이미지 스타일과 같은 기능으로 가득 차 있으며 번역에 최적화되어 있습니다. 내장 템플릿 패턴은 다중 페이지 웹사이트를 구축할 때 특히 유용합니다. 전체 사이트 편집 기능을 사용하여 비즈니스 또는 대행사 사이트를 만들려는 경우 Kemet을 고려해 볼 가치가 있는 테마입니다.

피난시오

Financio의 기본 디자인은 비즈니스 스타일의 웹사이트를 대상으로 하는 것 같습니다. 전체 너비의 영웅 페이지와 함께 깔끔하게 구성된 탐색 메뉴가 꽤 좋습니다. 기능 카드 및 기타 사이트 요소에 사용되는 모든 아이콘을 클릭 한 번으로 교체할 수 있습니다.

Financio는 Gutenverse에서 개발했습니다. 그리고 그들은 WordPress 블록으로 작업한 경험이 있습니다. 따라서 그들이 제공한 미리 만들어진 템플릿을 기반으로 구축할 수 있는 부드러운 사이트 편집 경험을 기대하십시오.

FSE를 잡아라

Catch는 전체 사이트 편집을 지원하는 최신 WordPress 테마 중 하나입니다. 또한 블로그 디자인 대신 랜딩 페이지로 제작된 몇 안 되는 테마 중 하나입니다. 예상대로 레이아웃에는 비즈니스 랜딩 페이지 구축의 모든 중요한 측면을 다루는 많은 섹션이 포함되어 있습니다. 모두 프런트 엔드에서 직접 편집할 수 있습니다.

웹 사이트에 어두운 모드를 사용하려면 이 테마로 직접 조정할 필요가 없습니다. 기본적으로 다크 모드를 갖도록 설계되었습니다. 그 외에는 무료이며 천천히 활성 사용자를 모으고 있습니다.

구테나

Gutena는 WordPress 저장소에 추가된 최신 FSE 테마 중 하나입니다. 풍부한 크리미한 톤과 세심하게 최적화된 요소가 포함된 이 테마는 에이전시, 비즈니스 및 스타트업 웹사이트에 이상적인 후보입니다.

디자인 관점에서 오버레이 카드의 구현, 상자 그림자 요소의 사용 및 고객 앞에서 비즈니스 미션을 달성하는 데 도움이 되는 많은 이미지를 보고 즐겁게 놀랐습니다.

그리고 새로운 블록 테마 편집기를 통해 각 요소를 자유롭게 수정할 수 있습니다.

웨이

우리가 이 컬렉션에서 본 최초의 FSE 테마는 Rich Tabor의 테마였습니다. 이제 이 기사를 게시한 지 2개월이 조금 넘었습니다. Rich는 Wei 라는 또 다른 전체 사이트 편집 테마를 발표했습니다. 흥미롭게도, 그의 마지막 릴리스 이후 몇 달이 지났음에도 불구하고 시장에 도입된 유사한 테마의 양이 극히 적습니다.

Wei는 실용적인 블로깅 필수품에 사용하도록 설계되었습니다. 여러 스타일과 레이아웃 악센트를 관리하기 위한 다양한 옵션을 제공하도록 설계되었습니다. 데모에서 볼 수 있듯이 각 블로그 게시물은 색상과 사용자 정의 배경 이미지를 포함하여 별도의 스타일을 가질 수 있습니다.

물용암

Gutenverse의 이 스파/미용 중심 테마는 매우 부드러운 방문 페이지 경험을 제공하고 사이트에 많은 고유 기능을 추가합니다. 예를 들어, WaterLava에는 동일한 목적으로 플러그인을 사용하지 않아도 되는 인빌드 양식 빌더가 있습니다.

홈페이지는 전환 애니메이션 효과를 포함하도록 설계되어 방문자가 사이트를 탐색할 때 섹션이 표시됩니다. 이 테마에서는 고유한 모양 구분선도 많이 찾을 수 있으므로 사이트에 현대적인 느낌을 더하려면 물결 모양과 사용자 정의 선을 생각하십시오.

또한 성능을 위해 세심하게 최적화되어 있습니다. 테마는 jQuery에 의존하지 않으며, 패턴/블록은 활발히 사용되는 페이지에만 로드됩니다.

WordPress 테마 개발의 미래

나는 우리가 지금 보고 있는 것이 WordPress의 다음 단계를 위한 느린 진화라고 생각합니다. 당분간은 전통적인 테마와 웹사이트 빌더가 자리를 잡을 것입니다. 그러나 앞으로 WordPress가 본격적인 사이트 빌더로 전환될 것이 분명합니다.

Webflow와 같은 회사가 플러그 앤 플레이 도구만 있으면 시각적으로 매력적인 웹 사이트를 구축할 수 있다는 것을 보여주었기 때문에 저는 또한 매우 확신합니다.

문제는 테마 개발자가 언제 이 다음 단계를 수용하기 시작할 것인가 하는 것입니다. 현재 블록 테마의 가용성은 매우 희박합니다. 일단 편집의 측면에서 진정한 신뢰성을 보기 시작하면 상황이 오히려 빠르게 바뀔 것이라고 생각합니다.

물론 많은 WordPress 사용자는 전통적인 테마를 계속 사용할 것이지만 WordPress를 기본 사이트 빌더로 사용하는 아이디어는 생각해 볼 문제입니다.