WordPress가 테마를 저장하는 곳에서 편집하는 블록 테마
테마는 템플릿, 템플릿 파트, 스타일 변형을 담당하고, 플러그인은 블록 라이브러리, 빌더, 폼, SEO 및 성능 레이어, 데모 가져오기 도구를 담당합니다. 템플릿과 전역 스타일은 사이트 편집기에 그대로 남아 있으므로, 사이트의 어떤 부분도 저희 설정 패널 안에 숨겨지지 않습니다.
- 블록 템플릿 173개와 템플릿 파트 5개를 모두 사이트 편집기에서 편집할 수 있습니다
- 사이트 편집기에서 전환할 수 있는 스타일 변형 4개(다크와 미드나이트 포함)
- 색상과 타이포그래피는 theme.json을 통해 적용되므로, 편집기에서도 프런트엔드와 같은 서체가 표시됩니다
- 183개의 블록 패턴, 마크업의 일회용 복사본으로 삽입
- 페이지가 열릴 때 편집 중인 콘텐츠를 둘러싼 전체 템플릿이 함께 표시됩니다.
데이터베이스에 최종적으로 저장되는 것은 블록 마크업입니다
블록 테마를 선택해야 하는 이유는 기능 목록이 아닙니다. 5년 뒤 나에게 남는 것이 무엇인지가 핵심입니다.
독점 포맷 없음
Canvas 테마는 고유한 형식 없이 표준 WordPress 블록을 편집하므로, 테마를 바꾸더라도 글과 페이지의 콘텐츠가 그대로 유지됩니다. 외워야 할 쇼트코드도 없고 열어야 할 코드 보기도 없습니다.
코드 조각이 아닌 설정
방문자가 보는 모든 요소는 블록 설정 패널에서 조정할 수 있습니다. 데모에 블록으로 표현할 수 없는 기능이 필요했을 때는 블록에 설정이 추가되었고, 페이지에 직접 입력한 HTML이 추가된 적은 없습니다.
모든 블록의 고급 패널
애니메이션, 표시 조건, 사용자 정의 클래스, 사용자 정의 속성, 블록별 사용자 정의 CSS가 코어 블록과 서드파티 블록을 포함해 편집기의 모든 블록에 추가됩니다.
에셋은 페이지를 따라갑니다
페이지는 포함된 블록의 CSS와 자바스크립트만 불러오므로, 가격 페이지에서 슬라이더 스크립트가 로드되는 일은 없습니다. 그 밖의 35개 최적화는 스위치 형태로 제공되며, 따로 설치할 플러그인이 필요 없습니다.
다른 테마에서 옮겨 오시나요? Elementor와 Divi는 자체 편집기로 페이지를 만들기 때문에 빌더를 떠나면 레이아웃도 함께 사라집니다. Elementor 사이트를 이전할 때 유지되는 항목과 Divi Builder와의 비교를 확인하세요. Kadence와 GeneratePress도 블록 편집기에서 작업하며, 블록은 무료 플러그인으로 제공됩니다(Canvas 대 Kadence, Canvas 대 GeneratePress). Blocksy는 헤더 빌더를 커스터마이저에 둡니다.
헤더 및 푸터 빌더는 템플릿 파트로 렌더링됩니다
헤더, 푸터, 상단 바, 메가 메뉴, 사이드 패널, 페이지 제목은 블록으로 구성된 레코드이며, 테마의 고유 템플릿 파트를 통해 프런트엔드에 표시됩니다. 헤더 파트는 페이지에 지정된 헤더를 렌더링하고, 푸터 파트는 지정된 푸터 레코드를 렌더링합니다. 이렇게 하면 사이트 편집기에서 이들을 확인할 수 있고, 블록 설정도 다른 곳과 동일하게 유지됩니다.
- 헤더 빌더 뒤에 있는 헤더 블록 22개와 헤더 옵션 94개
- 헤더를 사이트 전체에 지정하거나 개별 페이지에서 재정의할 수 있으며, 푸터, 상단 바, 메가 메뉴, 사이드 패널, 페이지 제목도 같은 방식으로 설정할 수 있습니다.
- Hero와 슬라이더도 레코드이며, 템플릿에 놓인 슬롯 블록으로 배치됩니다.
- 두 슬롯 블록 모두 편집 영역에 렌더링되므로, 페이지를 열면 방문자가 보게 될 섹션이 그대로 보입니다.
스토어 블록 24개와 스토어 템플릿 18개
WooCommerce는 선택 사항이며, 설치하면 블록과 템플릿으로 제공되어 동기화해야 할 템플릿 재정의가 없습니다.
스토어 블록
상품 페이지, 상품 그리드, 장바구니, 결제 페이지를 위한 블록과 색상 스와치, 페이지 새로고침 없는 장바구니 담기 기능.
스토어 템플릿
쇼핑몰, 상품, 장바구니, 결제, 계정 화면용 템플릿으로, 다른 템플릿과 마찬가지로 사이트 편집기에서 편집합니다.
데모 스토어
전체 88개 데모 웹사이트 중 21개는 상품, 카테고리, 속성, 결제가 모두 갖춰진 완전한 스토어로 가져올 수 있습니다.
스토어 블록과 템플릿으로 작동하는 21개 데모 스토어 중 2개.
원하신다면 설정 마법사가 자식 테마를 생성합니다
Canvas 템플릿 파일을 직접 수정할 계획이 있을 때만 차일드 테마를 만드세요. 업데이트 후에도 그런 수정 내용이 안전하게 유지되도록 하기 위해서입니다. 설정 마법사는 데모를 가져오기 전에 별도 단계에서 이를 제공하며, 테마 폴더에 차일드 테마를 만들고 활성화합니다. 이후에도 사이트 모습은 그대로 유지됩니다. 대부분의 사이트는 차일드 테마가 필요하지 않습니다. 과거에 이를 쓰던 이유는 이제 설정으로 해결할 수 있기 때문입니다.
- 테마 옵션의 기타 섹션에서 사이트 전체 Custom CSS와 헤더 및 푸터용 Custom JavaScript 설정
- 블록별 사용자 지정 CSS, 선택자 없이 속성과 값의 쌍으로 작성
- 블록별 사용자 지정 속성을 한 줄에 하나씩 키와 값으로 입력하며, data 및 aria 속성을 지원합니다
- 타이포그래피 섹션에서 원하는 선택자에 적용할 수 있는 사용자 지정 타이포그래피 규칙
- 기본 제공 팩 4개가 사용하는 것과 같은 인터페이스를 통해 직접 만든 아이콘 팩을 등록하세요
- 테마 옵션 구성 전체를 파일로 내보낸 뒤 다음 사이트에서 가져옵니다.
Canvas가 필요로 하는 것과 설치 시 수행하는 작업
최소 요구 사항은 권장 사항이 아니라 실제 기준입니다. Canvas가 호스트 환경을 직접 확인하므로, 가져오기가 실패했다는 소식을 처음으로 듣는 일은 없습니다.
- Canvas Core는 별도로 다운로드하지 않습니다. 라이선스가 활성화되면 WordPress 안에서 바로 설치되므로 버전을 맞춰 관리할 필요가 없습니다
- 업데이트는 WordPress 업데이트 화면에서 제공되며, 유지 보수 모드, 임시 백업, WordPress 자체를 통한 롤백을 지원합니다
- 자동 업데이트는 패치 릴리스에만 적용되며 기본적으로 켜져 있고 스위치로 끌 수 있습니다. 사용자가 커스터마이징한 템플릿을 변경하는 릴리스에는 이 사실이 명시됩니다
- Health Check 화면은 실제 호스트를 기준으로 서버 요구 사항을 확인하고 주의가 필요한 항목을 보고합니다. 같은 점검 항목은 WordPress 사이트 상태에도 표시됩니다
- 모든 문자열은 번역할 수 있으며, 테마와 플러그인용 번역 템플릿은 릴리스마다 다시 생성되고, 플러그인에는 WPML 설정 파일이 포함됩니다.
- 기술적 SEO, XML 사이트맵, 16개의 스키마 유형이 렌더링 시점에 콘텐츠를 기반으로 생성됩니다
기술 질문에 대한 답변
개발자가 프로젝트를 확정하기 전에 확인하는 다섯 가지 사항이며, 여기에는 Canvas가 하지 않는 항목도 포함됩니다.
Canvas는 블록 테마인가요, 아니면 페이지 빌더 테마인가요?
Canvas는 전적으로 블록으로 만들어진 WordPress 테마이며, WordPress에서는 이를 블록 테마라고 부릅니다. 템플릿은 WordPress 블록 템플릿이고, 템플릿 파트도 WordPress 템플릿 파트입니다. 색상과 타이포그래피는 theme.json을 통해 적용되며, 모든 편집은 WordPress에 포함된 블록 편집기와 사이트 편집기에서 이루어집니다. 별도로 설치할 빌더도, 익혀야 할 두 번째 편집기도, 갱신해야 할 빌더 구독도 없습니다.
마크업은 나중에 사이트 테마를 바꾸면 어떻게 되나요?
Canvas가 저장하는 형식이 표준 WordPress 블록 마크업이므로 이 형식을 그대로 유지합니다. 다른 테마가 인식하지 못하는 Canvas 블록은 디자인 렌더링이 멈추지만, 제목, 문단, 이미지, 목록은 코어 블록이므로 어디서나 정상적으로 읽힙니다. 숏코드나 독점 레이아웃 형식으로 저장되는 항목은 없습니다.
헤더와 푸터는 실제로 어디에 표시되나요?
Canvas가 등록하는 템플릿 파트를 통해 제공되며, 파트는 5개입니다: 헤더, 푸터, 페이지 제목, 사이드바, 보조 사이드바. 헤더 파트는 페이지에 지정된 헤더 기록을, 푸터 파트는 지정된 푸터 기록을 렌더링하며, 페이지 제목 파트는 페이지의 페이지 제목 설정이 결정한 내용을 렌더링합니다. 파트는 기반 구조이고, 디자인은 직접 만드는 22개의 헤더 블록 기록입니다.
차일드 테마가 필요한가요?
Canvas 템플릿 파일을 직접 편집하려는 경우에만 필요합니다. 차일드 테마는 바로 이런 파일을 업데이트로부터 보호합니다. 설정 마법사의 선택 사항인 차일드 테마 단계에서 차일드 테마를 자동으로 만들고 사이트를 해당 테마로 전환하거나, Canvas 안에 들어 있는 차일드 테마 폴더를 직접 테마 폴더에 복사할 수 있습니다. 대부분의 사이트에는 필요하지 않습니다. 테마 옵션에서 사이트 전체 설정을 관리하고, 블록별 Custom CSS와 Custom Attributes로 블록 수준을 다루며, 사이트 전체 Custom CSS와 JavaScript 필드는 테마 옵션의 Misc 섹션에 있습니다.
Canvas는 오른쪽에서 왼쪽으로 쓰는(RTL) 테마인가요?
네, 모든 Canvas 스타일시트에는 좌우 반전(RTL) 버전이 있으며, 사이트가 아랍어, 히브리어, 페르시아어 등 RTL 언어로 실행되면 WordPress가 이를 자동으로 불러옵니다. 데모 88개 중 88개는 출시 전에 RTL 방식으로 점검되어 메뉴, 그리드, 양식이 올바른 쪽에 놓입니다. 번역은 별개 문제이며 이 역시 완료되어 있습니다. 제품의 두 부분 모두 번역 템플릿을 제공하고, WPML 설정 파일도 플러그인과 함께 제공됩니다.