Gutenberg FSE: 2026년 워드프레스 디자인의 미래

전체 사이트 편집(Full Site Editing, FSE)은 워드프레스 5.9에 도입되었습니다. 3년이 지난 지금도 대부분의 에이전시는 이를 제대로 활용하지 못하고 있으며, 사용하는 곳은 상당한 경쟁 우위를 확보하고 있습니다.

FSE가 실제로 의미하는 것

FSE 이전에는 워드프레스 테마가 PHP 템플릿을 통해 헤더, 푸터, 전역 레이아웃을 제어했습니다. 구텐베르크는 콘텐츠 영역만 처리했습니다. 블록으로 블로그 게시물을 편집할 수는 있었지만, 탐색 메뉴는 PHP 파일에 고정되어 있었습니다.

FSE는 이를 바꿉니다. 블록 테마를 사용하면 헤더, 푸터, 사이드바, 아카이브 템플릿, 단일 게시물 레이아웃 등 사이트의 모든 부분이 블록을 사용하여 구텐베르크 편집기에서 편집 가능합니다. 레이아웃 변경을 위해 PHP가 필요하지 않습니다.

이는 전체 사이트를 블록 JSON으로 표현할 수 있다는 점에서 AI 생성에 중요합니다. 일부는 PHP 템플릿이고 일부는 블록인 하이브리드 시스템이 없습니다. 모든 것이 블록이고, 모든 것이 JSON이며, 모든 것이 프로그래밍 방식으로 생성 및 편집될 수 있습니다.

PAGEnza는 FSE를 어떻게 사용하는가

PAGEnza가 사이트를 생성할 때 홈페이지만 만드는 것이 아닙니다. 다음과 같은 완전한 블록 테마를 생성합니다.

• templates/index.html — 기본 템플릿
• templates/single.html — 단일 게시물 레이아웃
• templates/archive.html — 블로그/카테고리 목록
• templates/404.html — 오류 페이지
• parts/header.html — 재사용 가능한 헤더 블록
• parts/footer.html — 재사용 가능한 푸터 블록
• theme.json — 전역 스타일 (색상, 타이포그래피, 간격)

이 모든 것은 동일한 디자인 지침(Design Mandate)에서 생성됩니다. 홈페이지에 정의된 색상 팔레트는 theme.json 전역 스타일에 사용된 것과 동일합니다. 히어로 섹션에 선택된 글꼴 트리오는 블록 테마의 스타일시트에 로드된 것과 동일합니다.

이것이 AI 생성에 있어 FSE의 핵심 이점입니다: 일관성은 시스템에 의해 강제되며, 디자이너가 모든 곳에 동일한 글꼴을 적용하는 것을 기억하기를 바라는 것이 아닙니다.

theme.json — 편집해 본 적 없는 가장 중요한 파일

theme.json은 블록 테마의 전역 디자인 시스템을 정의하는 구성 파일입니다. 다음을 제어합니다.

• 색상 팔레트 — 편집기 색상 선택기에 표시되는 명명된 색상
• 타이포그래피 — 글꼴 모음, 크기, 줄 높이
• 간격 — 패딩 및 마진 컨트롤에 사용되는 간격 축척
• 테두리 반경 — 기본 모서리 반경 값
• 레이아웃 — 콘텐츠 너비, 넓은 너비

PAGEnza가 사이트를 생성할 때 theme.json은 디자인 지침에서 프로그래밍 방식으로 구축됩니다. ink, bg1, bg2, accent 색상은 명명된 팔레트 색상으로 등록됩니다. 글꼴 트리오가 올바른 Google Fonts @import URL과 함께 글꼴 모음으로 등록됩니다.

결과적으로 클라이언트가 텍스트를 변경하기 위해 구텐베르크 편집기를 열 때, 색상 선택기에는 다른 것은 없고 정확히 네 가지 브랜드 색상만 표시됩니다. 글꼴 선택기에는 선택된 세 가지 글꼴만 표시됩니다. 간격 컨트롤은 시스템 축척을 사용합니다. 디자인 시스템은 편집기 수준에서 강제됩니다.

"구텐베르크에서 실시간 편집"의 실제 의미

PAGEnza에서 생성된 모든 사이트는 구텐베르크 FSE가 활성화된 라이브 워드프레스 설치입니다. 클라이언트는 다음을 수행할 수 있습니다.

• 모든 텍스트를 클릭하여 직접 편집
• 섹션 배경을 클릭하고 브랜드 색상 팔레트에서 선택하여 변경
• 블록을 드래그하여 섹션 순서 변경
• 블록 삽입기에서 새 섹션 추가
• 자리 표시자를 클릭하여 이미지 변경

오프 브랜드 색상을 선택하여 디자인 시스템을 실수로 망가뜨릴 수 없습니다. 브랜드 색상 네 가지만 사용할 수 있기 때문입니다. 세 가지 브랜드 글꼴만 등록되어 있으므로 일치하지 않는 글꼴을 선택할 수 없습니다.

이것이 AI 생성 사이트를 실제 클라이언트에게 실용적으로 만드는 이유입니다. 디자인을 작동하게 만드는 제약 조건이 인계 후에도 유지됩니다.

블록 적용 범위 문제

FSE는 강력하지만 적용 범위 문제가 있습니다. 모든 디자인 패턴을 핵심 구텐베르크 블록으로 깔끔하게 표현할 수는 없습니다. 복잡한 레이아웃, 대화형 구성 요소, 사용자 정의 데이터 표시는 종종 사용자 정의 블록이나 타사 플러그인을 필요로 합니다.

PAGEnza는 이를 두 가지 방법으로 처리합니다.

레이아웃의 경우: Group, Cover, Columns, Media & Text 블록을 신중하게 제어된 속성과 함께 사용합니다. 마케팅 페이지 레이아웃의 약 95%는 이 네 가지 블록 유형만으로 달성할 수 있습니다.

대화형 구성 요소의 경우: Plugin Builder는 PHP 플러그인으로 사용자 정의 구텐베르크 블록을 생성합니다. 가격표, 예약 양식, 추천 슬라이더 등은 숏코드만 붙이는 것이 아니라 FSE 편집기와 통합되는 제대로 등록된 블록으로 생성됩니다.

클라이언트가 코드를 건드리지 않고 시각적 편집기에서 편집해야 하는 모든 것이 편집 가능하도록 하는 것이 목표입니다.