WordPress 6.0에서 블록 테마 패턴을 만드는 방법
- Christopher Nolan원래의
- 2025-03-13 10:02:09871검색
WordPress 5.5는 사용자가 사전 정의 된 블록 레이아웃을 생성하고 공유 할 수있는 블록 모드 (일반적으로 "블록"이라고도 함)를 소개합니다. 이 레이아웃은 스키마 디렉토리에 저장되며 WordPress 커뮤니티에서 설계 한 다양한 스키마를 포함합니다. 이 모드는 코딩 지식없이 간단한 사본-페이스트 형식을 사용하여 사용자의 시간을 크게 절약 할 수 있습니다.
패턴에 대한 많은 기사가 있지만 최신 개선 사항을 다루는 포괄적이고 최신 패턴 제작 기사가 부족합니다. 이 기사는이 격차를 메우는 것을 목표로하며 등록없이 패턴을 만드는 것과 같은 최근의 향상을 강조하고, 새롭고 숙련 된 저자에게 특히 블록 주제에서 패턴 만들기 및 사용에 대한 단계별 안내서를 제공합니다.
WordPress 5.9 및 TT2 (Twenty Twenty-Two) 기본 테마가 릴리스 된 이후 블록 테마에서 블록 모드의 사용이 급증했습니다. 나는 항상 블록 패턴의 열렬한 팬이었으며 블록 테마에서 만들어 사용했습니다.
WordPress 6.0은 저자에게 세 가지 주요 모드 기능 향상을 제공합니다.
- /패턴 폴더 ( /parts, /템플릿 및 /스타일과 유사)를 통해 등록 모드를 허용합니다.
- Theme.json을 사용하여 공개 모드 디렉토리에서 스키마를 등록하십시오.
- 새 페이지를 만들 때 사용자에게 제공 할 수있는 패턴을 추가합니다.
소개 비디오 "WordPress 6.0 탐색"에서 Automattic Product Liaison Ann McCathy는 새로운 향상된 모드 기능 (15:00에서 시작)을 강조하고 섹션 요소로 모드를 포함하여 모드, 통합 모드 디렉토리 검색 등을 포함하여 미래 모드 향상 계획을 논의했습니다.
전제 조건
이 기사는 독자가 WordPress 사이트 전체 편집 (FSE) 인터페이스에 대한 기본 지식을 가지고 있다고 가정합니다. 블록 편집 매뉴얼 및 사이트 전체 편집 웹 사이트는이 기사에서 논의 된 블록 주제 및 패턴을 포함하여 모든 FSE 기능을 학습하기위한 최신 튜토리얼 가이드를 제공합니다.
섹션 1 : 블록 패턴 생성을위한 진화 방법
블록 패턴을 생성하는 초기 방법을 사용하려면 블록 패턴 API를 사용해야합니다. 블록 플러그인으로 사용되거나 Functions.php 파일에 직접 등록되어 블록 테마와 함께 번들이 필요합니다. 새로 출시 된 WordPress 6.0은 /패턴 폴더 등록 모드 및 페이지 생성 모드 모드를 포함하여 패턴 및 테마와 함께 사용할 수있는 몇 가지 새롭고 향상된 기능을 소개합니다.
배경으로 스키마 등록 워크 플로가 등록없이 직접로드하기 위해 직접로드하여 어떻게 진화했는지에 대한 간단한 개요로 시작하겠습니다.
유스 케이스 예 1 : 21 개
기본 21 명의 테마 (TT1)와 TT1 블록 테마 (TT1 자매 테마)는 테마 functions.php에서 블록 모드를 등록하는 방법을 보여줍니다. TT1 블록 실험 주제에서, 8 개의 블록 패턴을 포함하는 단일 블록 패터 른 .php 파일은 아래와 같이 포함 파일로 functions.php에 추가됩니다.
register_block_pattern 함수를 사용하여 사용자 정의 블록 패턴을 등록해야합니다. 이는 두 개의 매개 변수 (패턴의 이름)와 속성 (패턴 속성을 설명하는 배열)을 수신합니다.
다음은 테마 셰이퍼 기사에 따라 등록 된 간단한 "Hello World"단락 패턴의 예입니다.
register_block_pattern (
'my-plugin/hello-world',
정렬(
'제목'=> __ ( 'Hello World', 'my-plugin'),
'내용'=> "\ n<p> 안녕하세요 세계</p> \N",
))
);
등록 후, register_block_pattern () 함수는 아래 설명 된대로 Init Hook에 첨부 된 핸들러에서 호출되어야합니다.
함수 my_plugin_register_my_patterns () {
register_block_pattern (...);
}
add_action ( 'init', 'my_plugin_register_my_patterns');
블록 모드를 등록한 후 블록 편집기에서 볼 수 있습니다. 더 자세한 문서는 블록 모드 등록에서 찾을 수 있습니다.
블록 모드 속성
필수 제목 및 컨텐츠 속성 외에도 블록 편집기 설명서에는 다음과 같은 선택 모드 속성이 나와 있습니다.
- 제목 (필수) : 패턴에 대한 사람이 읽을 수있는 제목.
- 내용 (필수) : 패턴의 HTML 태그를 차단합니다.
- 설명 (선택 사항) : 인서터의 패턴을 설명하는 데 사용되는 시각적으로 숨겨진 텍스트. 설명은 선택 사항이지만 제목이 모드의 기능을 완전히 설명하지 않을 때 사용하는 것이 좋습니다. 설명은 사용자가 검색하는 동안 패턴을 발견하는 데 도움이됩니다.
- 카테고리 (선택 사항) : 블록 스키마를 그룹화하는 데 사용되는 등록 된 스키마 범주 배열. 블록 모드는 여러 범주로 표시 될 수 있습니다. 여기에서 사용하려면 범주를 별도로 등록해야합니다.
- 키워드 (선택 사항) : 사용자가 검색 할 때 해당 패턴의 별명 또는 키워드 배열을 발견 할 수 있도록 도와줍니다.
- viewportWidth (선택 사항) : 모드의 예상 너비의 정수를 지정하여 인서터의 모드를 비례 적으로 미리 볼 수 있습니다.
- BlockTecepes (선택 사항) : 패턴이 사용하기를 기대하는 블록 유형의 배열. 각 값은 선언 된 블록의 이름이어야합니다.
- Inserter (선택 사항) : 기본적으로 모든 모드가 삽입기에 나타납니다. 프로그래밍 방식으로 삽입 할 수 있도록 모드를 숨기려면 인서터를 False로 설정하십시오.
다음은 WordPress 블로그에서 가져온 참조 패턴 플러그인 코드 스 니펫의 예입니다.
/*
플러그인 이름 : 견적 패턴 예제 플러그인
*/
register_block_pattern (
'my-plugin/my-quote-pattern',
정렬(
'title'=> __ ( '아바타와 함께 인용', 'my-plugin'),
'범주'=> 배열 ( 'text'),
'설명'=> _x ( '아바타가있는 큰 인용문'. ','블록 패턴 설명 ','내 플러그 인 '),
'내용'=> ' <div><div>
<hr>
<div><img src="/static/imghwm/default1.png" data-src="https://img.php.cn/upload/article/000/000/000/174183133237166.jpg" class="lazy" alt="" style="max-width:90%" style="max-width:90%"></div>
<blockquote>
<p> "기여는 지구에 유용하다고 느끼게합니다."</p> <cite>- Anna Wong, <em>자원 봉사자</em></cite>
</blockquote>
<hr>
</div></div> ',
))
);
템플릿 파일에서 패턴 사용
패턴을 만든 후 다음 블록 태그를 사용하여 테마 템플릿 파일에서 사용할 수 있습니다.
이 GitHub 리포지토리의 예는 TT2 Gopher 블록 테마에서 "TT2Gopher"접두사와 함께 "바닥 쟁이-팩터"패턴 슬러그의 사용을 보여줍니다.
블록 테마와 Gutenberg 플러그인의 얼리 어답터도 고전적인 테마의 패턴을 활용했습니다. 기본 20 개 20 개와 내가 좋아하는 Eksell 테마 (여기서 데모 사이트)는 스키마 기능을 클래식 테마에 추가하는 방법을 보여주는 좋은 예입니다.
유스 케이스 예제 2 : 2122
주제에 적은 수의 패턴 만 포함 된 경우 개발 및 유지 보수는 관리하기 쉽습니다. 그러나 블록 테마에 TT2 테마와 같은 많은 패턴이 포함되어 있으면 Pattern.php 파일이 매우 커지고 읽기가 어렵습니다. 기본 TT2 테마는 60 개가 넘는 스키마로 번들로 번들로 읽고 유지 관리하기 쉬운 리팩토링 된 스키마 등록 워크 플로우 구조를 보여줍니다.
TT2 주제를 예로 들어,이 단순화 된 워크 플로우가 어떻게 작동하는지 간단히 설명해 봅시다.
2.1 : 등록 모드 카테고리
데모 목적으로 TT2 하위 주제를 만들어 일부 가상 컨텐츠를 사용하여 로컬 테스트 사이트에 설정했습니다. TT2의 방법에 따라 Block-Patterns.php 파일에 바닥 글을 등록하고 다음 스키마 카테고리 배열에 추가했습니다.
/**
* 블록 패턴 및 카테고리를 등록합니다.
*/
함수 twentytwentytwentytwo_register_block_patterns () {
$ block_pattern_categories = 배열 (
'바닥다'=> 배열 ( 'label'=> __ ( '바닥기', '스물 틀 스토 워')),
'머리카
'pages'=> array ( 'label'=> __ ( 'pages', 'twentytwentytwo')),
// ...
);
/**
* 테마 블록 패턴 범주를 필터링합니다.
*/
$ block_pattern_categories = apply_filters ( 'twentytwentytwo_block_pattern_categories', $ block_pattern_categories);
foreach ($ block_pattern_categories as $ name => $ properties) {
if (!
register_block_pattern_category ($ name, $ properties);
}
}
$ block_patterns = 배열 (
'바닥다-디퍼 런',
'바닥 글',
'바닥 글씨가있는 바닥 글',
// ...
'헤더-디폴트',
'헤더 레이지 어두운',
'헤더 스몰 어크',
'Hidden-404',
'숨겨진 버드',
// ...
);
/**
* 테마 블록 패턴을 필터링합니다.
*/
$ block_patterns = apply_filters ( 'twentytwentytwo_block_patterns', $ block_patterns);
foreach ($ block_patterns as $ block_pattern) {
$ pattern_file = get_theme_file_path ( '/inc/patterns/'. $ block_pattern. '.php');
register_block_pattern (
'Twentytwentytwo/', $ block_pattern.
$ Pattern_File이 필요합니다
);
}
}
add_action ( 'init', 'twentytwentytwo_register_block_patterns', 9);
이 코드 예제에서 $ block_patterns = array ()에 나열된 각 패턴은 foreach () 함수에 의해 호출되며, 여기에는 배열에 나열된 스키마 이름이 포함 된 스키마 디렉토리 파일이 필요합니다.
2.2 : /inc /패턴 폴더에 패턴 파일을 추가합니다
다음으로 $ block_patterns = array ()에 나열된 모든 스키마 파일이 있어야합니다. 다음은 스키마 파일 바닥 글 buter-background.php의 예입니다.
/**
* 다크 바닥 글 WTIH 제목 및 인용
*/
반환 배열 (
'title'=> __ ( '배경이있는 바닥 글', 'Twentytwentytwo'),
'카테고리'=> 배열 ( '바닥기'),
'BlockTepes'=> 배열 ( 'Core/Template-Part/Footer'),
'내용'=> '
<div style="padding-top:var(--wp--custom--spacing--small, 1.25rem);padding-bottom:var(--wp--custom--spacing--small, 1.25rem)">
<p>'.
Sprintf (
/ * 번역기 : WordPress 링크.
esc_html __ ( '자랑스럽게 %s', 'twentytwentytwo'),
' <a href="'%20.%20esc_url(%20__(%20'https://wordpress.org',%20'twentytwentytwo'%20)%20)%20.%20'" rel="nofollow">WordPress</a> |. 수정 된 TT2 테마.'
). ''</p>
</div>
',
);
바닥 글의 패턴을 참조 해 봅시다. html 템플릿 부분 :
이것은 템플릿 파일에 제목 또는 바닥 글 부분을 추가하는 것과 유사합니다.
테마 패턴 파일의 슬러그를 참조하기 위해 수정하여 Parts/Footer.html 템플릿에 패턴을 추가 할 수 있습니다.
이제 블록 편집기 모드 삽입기에 액세스하면 "배경으로 바닥 글"을 사용할 수 있습니다.
다음 스크린 샷은 프론트 엔드에 배경으로 새로 생성 된 바닥 글 패턴을 보여줍니다.
이제 패턴이 블록 테마의 필수 부분이되었으므로 대부분은 블록 테마에 묶여 있으며,이 중 많은 부분이 사분면, 씨앗, Mayland, 동물 학자, 지질 학자와 같은 위의 워크 플로우를 팔로우하십시오. 이것은 블록 패턴 등록 파일과 컨텐츠 소스를 포함하는 일련의 파일과 return array () 함수에 필요한 패턴 제목을 포함하는 일련의 파일을 포함하는 Quadrat 테마 /Inc /Patterns 폴더의 예입니다.
섹션 2 : 등록없이 패턴을 생성 및로드합니다
이 기능에는 사이트에 설치하려면 WordPress 6.0 또는 Gutenberg 플러그인 13.0 이상이 필요합니다.
이 새로운 WordPress 6.0 기능을 사용하면 표준 파일 및 폴더 등록 모드가 허용되어 /부품, /템플릿 및 /스타일과 유사한 규칙을 가져옵니다.
이 기사에 설명 된 바와 같이이 과정은 다음과 같은 세 단계를 포함합니다.
- 테마의 루트 디렉토리에서 패턴 폴더 만들기
- 플러그인 스타일 패턴 제목을 추가하십시오
- 모드 소스 컨텐츠
기사에서 얻은 일반적인 패턴 제목 태그는 다음과 같습니다.
php /** * 제목 : 패턴 제목 * 슬러그 : 네임 스페이스/슬러그 * 설명 : 인간 친화적 인 설명. * 뷰포트 너비 : 1024 * 카테고리 : 쉼표, 분리, 값 * 키워드 : 쉼표, 분리, 값 * 블록 유형 : 쉼표, 분리, 값 * 삽입기 : 예 | 아니오 */ ??>
이전 섹션에서 언급했듯이 제목과 슬러그 필드 만 필요하며 다른 필드는 선택 사항입니다.
최근에 발표 된 주제의 예제를 언급하면 CSS- 트릭에 대한 이전 기사에서 준비한 TT2 Gopher Blocks 데모 주제의 스키마 등록을 리팩토링했습니다.
다음 단계에서는 PHP에 등록되어 바닥 글 템플릿에 사용 된 바닥 글을 비추는 방법을 살펴 보겠습니다.
2.1 : 테마의 루트 디렉토리에서 /패턴 폴더 작성
첫 번째 단계는 TT2 GoPher 테마의 루트 디렉토리에 /패턴 폴더를 작성하고 바닥 글을 background.php 패턴 파일을 /패턴 폴더로 이동하여 리팩터링하는 것입니다.
2.2 : 파일 제목에 스키마 데이터를 추가하십시오
그런 다음 다음 스키마 제목 등록 필드를 만듭니다.
php /** * 제목 : 배경이있는 바닥 글 * 슬러그 : TT2Gopher/바닥 글러리 * 카테고리 : tt2gopher-footer * 뷰포트 너비 : 1280 * 블록 유형 : 코어/부품/바닥 글 * 삽입 자 : 예 */ ??>
스키마 파일에는 PHP 댓글로 탑 제목 필드가 작성되었습니다. HTML 형식으로 작성된 블록 컨텐츠가 이어집니다.
2.3 : 파일에 스키마 컨텐츠를 추가하십시오
컨텐츠 부분의 경우 코드 스 니펫을 단일 따옴표 (예 : '...')로 복사하고 바닥 글러리의 컨텐츠 부분부터 시작하여 다음을 대체하십시오.
<div style="padding-top:35px;padding-bottom:30px">
<p>WordPress에 의해 구동 |</p>
</div>
GitHub에서 Patterns/with-background.php 파일의 전체 코드 스 니펫을 볼 수 있습니다.
/Inc /Patterns 및 Block-Patterns.php는 엑스트라 이며 WordPress 6.0에는 필요하지 않으며 데모 목적으로 만 포함됩니다.
2.4 : 템플릿의 참조 패턴 슬러그
위의 재 refactored 바닥 글의 바닥 글 buter-with-background.php 템플릿의 바닥 글을 추가하는 것은 이전 섹션에서 설명한 것과 정확히 동일합니다 (섹션 1, 2.2).
이제 블록 편집기 또는 브라우저에서 사이트의 바닥 글 부분을 보면 바닥 글 부분이 표시됩니다.
패턴 카테고리 및 유형 등록 (선택 사항)
블록 패턴을 분류하려면 주제의 functions.php 파일에 스키마 범주 및 유형을 등록해야합니다.
TT2 Gopher 주제에서 블록 패턴 범주를 등록하는 예를 고려해 봅시다.
등록 후 모드가 코어 기본 모드와 함께 모드 인서트에 표시됩니다. Pattern Inserter에 주제 별 카테고리 태그를 추가하려면 주제 네임 스페이스를 추가하여 이전 코드 스 니펫을 수정해야합니다.
/**
* 블록 카테고리를 등록하고 입력합니다.
*/
함수 tt2gopher_register_block_pattern_categories () {
$ block_pattern_categories = 배열 (
'tt2gopher -header'=> array ( 'label'=> __ ( 'tt2 Gopher- 헤더', 'tt2gopher')),
'tt2gopher -footer'=> array ( 'label'=> __ ( 'tt2 Gopher -Footers', 'tt2gopher')),
'tt2gopher -page'=> array ( 'label'=> __ ( 'tt2 gopher - page', 'tt2gopher')),
// ...
);
/**
* 테마 블록 패턴 범주를 필터링합니다.
*/
$ block_pattern_categories = apply_filters ( 'tt2gopher_block_pattern_categories', $ block_pattern_categories);
foreach ($ block_pattern_categories as $ name => $ properties) {
if (!
register_block_pattern_category ($ name, $ properties);
}
}
add_action ( 'init', 'tt2gopher_register_block_pattern_categories', 9);
바닥 글은 모드 삽입기를 사용하여 미리보기 (선택한 경우)에 표시됩니다.
이 프로세스는 블록 테마에서 블록 패턴을 작성하고 표시하는 프로세스를 크게 단순화합니다. Gutenberg 플러그인없이 WordPress 6.0에서 사용할 수 있습니다.
모드 등록이없는 샘플 주제
얼리 어답터는 블록 테마 에서이 기능을 사용하기 시작했습니다. 등록없이 패턴을로드 할 수있는 주제 디렉토리에 제공된 주제 예제 중 일부는 다음과 같습니다.
- Archeo - 12 모드
- 펜던트 - 13 모드
- 원격 - 11 모드
- SkatePark - 10 모드
- 스튜어트 - 17 개 모드
- Livro - 16 모드
- 아방가르드-14 모드
섹션 3 : 코드가 낮은 패턴 생성 및 사용
공식 스키마 카탈로그에는 커뮤니티가 제공하는 창의적인 디자인이 포함되어 있으며 컨텐츠를 만들기 위해 필요에 따라 복사 및 사용자 정의 할 수 있습니다. 블록 편집기에서 패턴을 사용하는 것은 결코 쉬운 일이 아닙니다!
성장하는 디렉토리의 모든 패턴 은 단순히 "복사 및 붙여 넣기"를 통해 블록 테마에 추가 할 수 있습니다. 다음으로 매우 제한된 코드로 쉽게 구현하는 방법을 간략하게 설명하겠습니다.
스키마 디렉토리에서 스키마를 추가하고 사용자 정의하십시오
3.1 : 디렉토리에서 페이지로 모드를 복사합니다.
여기서는 스키마 디렉토리에서 바닥 글 패턴에 대해 일제webgeek를 사용하고 있습니다. 복사 모드 버튼을 선택하여 복사 모드를 새 페이지에 직접 붙여 넣습니다.
3.2 : 필요한 사용자 정의를 만듭니다
글꼴과 버튼 배경의 색상을 약간 변경했습니다. 그런 다음 코드 편집기 에서 클립 보드로 전체 코드를 복사하십시오.
코드 편집기를 처음 사용하는 경우 옵션 (3 개의 점, 오른쪽 상단)으로 이동하여 코드 편집기 버튼을 클릭하고 여기에서 전체 코드를 복사하십시오.
3.3 : /패턴 폴더에서 새 파일을 만듭니다
먼저 새 /patterns/footer-pattern-test.php 파일을 만들고 필요한 스키마 제목 섹션을 추가하겠습니다. 그런 다음 전체 코드를 붙여 넣습니다 (위 3 단계, 위). 패턴은 바닥 글 영역 (5 행)에서 분류되며 패턴 삽입물에서 새로 추가 된 패턴을 볼 수 있습니다.
php /** * 제목 : 패턴 라이브러리의 바닥 글 패턴 * 슬러그 : TT2Gopher/바닥 글씨 * 카테고리 : tt2gopher-footer * 뷰포트 너비 : 1280 * 블록 유형 : 코어/템플릿-파트/바닥 글 * 삽입 자 : 예 */ ??><div style="padding-top:100px;padding-right:30px;padding-bottom:70px;padding-left:30px"> <div> <div> <h2 style="font-style:normal;font-weight:700;text-transform:uppercase">로렘</h2> <p style="font-size:16px">Lorem Ipsum을 사용하는 주요 이점 중 하나는 쉽게 생성 될 수 있으며, 대신에 의미있는 텍스트를 만드는 데 압력을 가할 수 있다는 것입니다.</p> <ul></ul> </div> <div> <h4 style="font-size:30px;font-style:normal;font-weight:700;text-transform:capitalize">저희에게 연락하십시오</h4> <p style="font-size:16px;line-height:1.2">123 Bd Lorem, Ipsum<br><br> 123-456-7890</p> <p style="font-size:16px;line-height:1">[이메일 보호]</p> <p style="font-size:16px;line-height:1">개막 시간 : 10:00-18:00</p> </div> <div> <h4 style="font-size:30px;font-style:normal;font-weight:700;text-transform:capitalize">회람 신문</h4> <p style="font-size:16px">LOREM IPSUM DOLOR SIT AMET, CENLESTUR UT LABORER et DOLORE MAGNA ALIQUA IPSUM DOLOR SIT</p> </div> </div> </div>
3.4 : 인서터에서 새 모드를 봅니다
패턴 라이브러리에서 새로 추가 된 바닥 글 모드를 보려면 모든 게시물이나 페이지로 이동하여 삽입 아이콘 (왼쪽 상단 코너의 파란색 플러스 부호)을 선택하고 TT2 GoPher - 바닥 글라스 카테고리를 선택하십시오. 새로 추가 된 모드는 왼쪽 패널과 다른 바닥 글 모드와 오른쪽으로 미리보기 (선택한 경우)에 나타납니다.
Theme.json 파일에 모드를 직접 등록하십시오
WordPress 6.0에서는 다음 구문을 사용하여 Theme.json 파일의 스키마 디렉토리에서 필요한 스키마를 등록 할 수 있습니다. 6.0 개발 노트는 "패턴 필드는 스키마 디렉토리의 [ 스키마 슬러그 ] 배열입니다. 패턴 슬러그는 스키마 디렉토리의 단일 스키마보기에서 [URL]에서 추출 할 수 있습니다."
{
"버전": 2,
"패턴": [ "짧은 텍스트", "Patterns-Slug"]]]
}
이 짧은 WordPress 6.0 기능 비디오는 /패턴 폴더 (3:53)에 패턴을 등록하는 방법과 Theme.json 파일 (3:13)의 모드 디렉토리에 패턴을 등록하는 방법을 보여줍니다.
그런 다음 등록 모드를 모드 삽입 검색 상자에서 사용할 수 있으며 테마 바운드 모드 라이브러리처럼 사용할 수 있습니다.
{
"버전": 2,
"Patterns": [ "Directory-from-directory", "바닥 글로 디자인 -3-column-description-scription-media-ontact and-newsletter"]]]]
}
이 예에서, 이전 예제의 패턴 슬러그 바닥 글로 디자인-3 열-서사-사회-미디어-접촉 및 뉴스 레터는 teme.json을 통해 등록됩니다.
페이지 생성 패턴 모델
Patterns 프로그램을 사용하여 빌드의 일부로 WordPress 6.0은 테마 저자에게 주제를 차단하기 위해 페이지 레이아웃 모드를 추가 할 수있는 모달 모달 옵션을 제공하여 페이지를 만들 때 사이트 사용자가 페이지 레이아웃 모드 (예 : 페이지, 연락처 페이지, 팀 페이지 등)를 선택할 수 있습니다. 다음은 개발 지침에서 가져온 예입니다.
register_block_pattern (
'내 플러그 인/about-page',
정렬(
'title'=> __ ( '정보', 'my-plugin'),
'blockTepes'=> 배열 ( '코어/사후 콘텐츠'),
'내용'=> '
<p>여기에 페이지에 대해 작성하고 언제든지 사용하십시오.</p>
',
))
);
이 기능은 현재 Page Post 유형으로 제한되며 "Post Post 유형"에는 적용 할 수 없습니다.
또한 모든 모드에 대한 컨텐츠 후 블록 유형을 제거하여 페이지 생성 모드 모드를 완전히 비활성화 할 수 있습니다. 샘플 샘플 코드가 여기에 제공됩니다.
GitHub의 토론에 따르고 참여할 수 있으며 토론 링크는 아래 리소스 섹션에 나열되어 있습니다.
스키마 디렉토리를 사용하여 페이지를 작성하십시오
페이지 빌더와 유사하게 디렉토리의 패턴을 사용하여 원하는 게시물 또는 페이지 레이아웃을 만들 수도 있습니다. Gutenberghub 팀은 스키마 디렉토리의 Schemas를 사용하여 실험적인 온라인 페이지 빌더 응용 프로그램 (소개 비디오)을 만들었습니다. 그런 다음 애플리케이션의 코드를 사이트에 복사하여 붙여 넣을 수 있으므로 코딩없이 복잡한 페이지 레이아웃을 구축하는 프로세스를 크게 단순화합니다.
이 짧은 비디오에서 Jamie Marsland는 응용 프로그램을 사용하여 디렉토리의 필요한 페이지 섹션을 사용하여 페이지 빌더와 유사한 전체 페이지 레이아웃을 만드는 방법을 보여줍니다 (1:30).
요약
모드를 통해 사용자는 일반적으로 사용되는 콘텐츠 레이아웃 (예 : 영웅 페이지, Call to Action 등)을 모든 페이지에서 재현하고 코딩 기술없이 스타일 컨텐츠를 제시 할 수없는 장벽을 줄일 수 있습니다. 플러그인 및 테마 디렉토리와 마찬가지로 새로운 Schema 디렉토리는 사용자에게 스키마 디렉토리에서 다양한 스키마를 선택하고 스타일로 컨텐츠를 쓰고 표시 할 수있는 옵션을 제공합니다.
실제로 블록 모드는 모든 것을 변경하며, 이는 의심 할 여지없이 WordPress 테마 필드의 변형 기능입니다. "Pattern Build 사용"작업의 잠재력을 최대한 발휘할 수있게되면, 코드가 낮은 지식만으로도 블록 테마를 디자인하고 아름다운 콘텐츠를 만드는 방식이 변경됩니다. 많은 창의적인 디자이너에게 패턴 카탈로그는 창의성을 보여주는 적절한 방법을 제공 할 수 있습니다.
의지
WordPress 6.0
- WordPress 6.0 도메인 안내서 (WordPress Core)
- WordPress 6.0 탐색 : 스타일 변형, 블록 잠금 UI, 개선 작성 —22 분 비디오 (Anne McCarthy)
- WordPress 6.0 4 분 안에 기능 (Dave Smith)
- WordPress 6.0의 새로운 새로운 블록, 스타일 스위칭, 템플릿 편집, WebFonts API 등 (Kinsta)
패턴을 만듭니다
- 블록 모드 소개 (사이트에서 편집)
- 블록 모드 소개 비디오, 14 분 (WordPress 학습)
- 블록 모드 (블록 편집기 매뉴얼)
- 그래서 블록 패턴을 만들고 싶습니까? (WordPress 블로그)
- WordPress (Godaddy)에서 낮은 코드 블록 모드를 생성하고 공유하는 방법
모드 향상 (GitHub)
- 패턴 빌딩 #38529를 사용하십시오
- 섹션 요소 #39281로 패턴
- 추가 : 페이지 생성시 모드를 선택하는 옵션. #40034
- 페이지 생성에 사용되는 블록 모드. #38787
- 추가 : 페이지 시작 옵션 (템플릿 및 패턴) #39147
블로그 게시물
- Gutenberg Mode : WordPress의 Page Building의 미래 (Rich Tabor)
- 블록 모드 (Godaddy)를 사용하여 WordPress 사이트 빌딩 속도 향상
- 블록 모드는 모든 것을 변경합니다 (WP Tavern)
위 내용은 WordPress 6.0에서 블록 테마 패턴을 만드는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!