패턴을 사용하면 사용자 정의한 블록을 저장하여 사이트 전체에서 다시 사용할 수 있습니다. 동일한 블록 그룹을 새 페이지에 반복적으로 추가하는 경우 패턴이 있으면 시간이 많이 절약됩니다. 이 가이드에서는 패턴을 생성하고 사용하는 방법을 알아봅니다.
💡
워드프레스닷컴 디자인 팀에서 만든 패턴 모음 에서 영감을 받아 필요한 페이지를 정확하게 제작하세요.
이 가이드에서
먼저 재사용할 콘텐츠를 생성합니다. 패턴은 단일 블록 또는 여러 블록 그룹일 수 있습니다. 이 예에서는 다음과 같은 모양의 이미지, 헤더, 텍스트 및 행동 유도 문구 버튼을 사용합니다.
콘텐츠를 만들었으면 다음 단계에 따라 사이트의 모든 위치에서 사용할 수 있는 패턴으로 전환하세요.
- 재사용하려는 모든 블록을 선택합니다. 블록을 선택하는 방법은 여러 가지입니다.
- 마우스로 여러 블록을 나란히 강조 표시할 수 있습니다.
- 목록 보기를 사용하여 첫 번째 블록을 클릭하고 키보드의 Shift 키를 누른 채 최종 블록을 클릭합니다. 그러면 첫 번째 블록과 마지막 블록 사이의 모든 블록이 선택됩니다.
- 블록 도구 모음에 표시되는 점 3개를 클릭합니다.
- “패턴 생성” 옵션을 클릭합니다.
- 패턴의 용도를 기억할 수 있도록 이름을 지정합니다. 이 메모는 본인에게만 표시됩니다.
- 원하는 경우 패턴을 카테고리에 지정합니다. 패턴을 정리하려는 패턴이 많은 경우에 유용합니다.
- “동기화됨” 옵션을 켜거나 끕니다.
- 동기화됨: 패턴을 편집한 내용이 패턴이 삽입된 모든 위치에 적용됩니다. 블록 재사용에 이상적입니다.
- 동기화되지 않음: 패턴을 편집한 내용이 해당 패턴의 한 인스턴스에만 적용됩니다. 여러 페이지에서 동일한 레이아웃을 사용하면서 각 페이지의 패턴에 있는 콘텐츠를 변경하려는 경우에 적합합니다.
- “생성” 버튼을 클릭합니다.
패턴을 만들었으면 아래 단계에 따라 콘텐츠에 삽입합니다.
- + 블록 삽입기 아이콘을 클릭합니다.
- 패턴 탭을 선택합니다.
- 다음 중에서 선택합니다.
- 모든 패턴: 워드프레스닷컴에서 제공되는 패턴을 포함하여 모든 패턴을 찾아봅니다.
- 내 패턴: 직접 생성한 패턴만 찾아봅니다.
- 소개, 배너, 양식, 서비스 등과 같은 카테고리별로 샘플 패턴을 찾아봅니다.
- 패턴을 한 번 클릭하여 페이지에 추가합니다.
💡
키보드를 사용하여 슬래시(/) 및 패턴 이름을 새 줄에 입력하고 Enter 키를 눌러 생성한 패턴을 빠르게 추가할 수도 있습니다.
패턴을 추가한 후 다음과 같은 두 가지 방법으로 편집할 수 있습니다.
- 이전 섹션에서 설명한 대로 사이트에 패턴을 추가합니다.
- 블록을 선택하고 블록 도구 모음에서 “원본 편집” 옵션을 클릭합니다.
- 새 텍스트 입력, 블록 재정렬, 새 블록 추가 또는 블록 제거가 포함될 수 있는 변경 사항을 적용합니다.
- 변경 사항을 완료하면 오른쪽 상단의 저장/업데이트/발행 버튼을 클릭합니다.
- 변경 사항을 저장하기 전에 사이트에 적용한 변경 사항 요약이 표시됩니다. 동기화된 패턴을 편집한 경우 여기에 강조 표시됩니다.
- “저장” 버튼을 다시 클릭하여 변경 사항을 확인하거나 저장하지 않을 변경 사항 옆의 상자를 선택 해제합니다.
동기화된 패턴을 즉시 원래 콘텐츠로 다시 복원하려면 도구 모음에서 “초기화” 옵션을 클릭합니다.
- 알림판을 방문합니다.
- 디자인 → 편집기로 이동합니다.
- “패턴” 옵션을 클릭합니다.
- 패턴을 선택하고 연필 아이콘을 클릭하여 해당 패턴을 편집합니다.
- 편집을 마치면 “저장” 버튼을 클릭합니다.
디자인 → 편집기에 접근할 수 없는 경우 사이트에서 블록 테마를 사용하고 있지 않은 것입니다. 사이트 편집기에 접근하지 않고 패턴을 편집하는 방법:
- 알림판을 방문합니다.
- 디자인 → 패턴으로 이동합니다.
- 패턴 제목을 클릭하여 해당 패턴을 편집합니다.
- 편집을 마치면 “업데이트” 버튼을 클릭합니다.
패턴을 생성할 때 동기화되거나 동기화되지 않은 패턴으로 만들 수 있습니다. 여기에서는 각 옵션과 두 가지 유형의 패턴으로 작업하는 방법을 설명합니다.
동기화된 패턴은 사이트에서 사용하는 모든 위치에 동일하게 유지되는 패턴입니다. 사이트의 한 곳에서 동기화된 패턴을 편집하면 패턴이 사용되는 모든 곳에 해당 변경 사항이 적용됩니다. 예를 들어 영업 시간에 동기화된 패턴을 생성하는 경우 패턴의 한 인스턴스에서 해당 시간을 변경하면 사이트 전체에서 업데이트됩니다.
동기화된 패턴은 뒤에 다른 다이아몬드가 있는 다이아몬드처럼 보이는 패턴 기호로 식별됩니다. 편집기의 다음 위치에도 패턴 이름이 표시됩니다.
- 블록 도구 모음.
- 블록 설정 사이드바.
- 목록 보기.
- 화면 하단의 이동 경로.
패턴이 사용되는 모든 위치에서 동기화된 패턴을 변경할 수 있습니다. 변경 사항을 저장하면 해당 패턴을 사용하는 모든 페이지와 글에 적용됩니다.
동기화된 패턴을 분리하면 해당 페이지 또는 글의 패턴에서 콘텐츠를 편집할 수 있습니다. 삽입한 패턴이 동기화되지 않은 패턴으로 바뀌며 기존 동기화된 패턴은 그대로 유지됩니다.
동기화된 패턴을 동기화되지 않은 패턴으로 전환하는 방법은 다음과 같습니다.
- 이전 섹션에서 설명한 대로 사이트에 패턴을 추가합니다.
- 패턴을 클릭하면 도구 모음이 위 또는 아래에 표시됩니다.
- 도구 모음 끝의 생략 부호(점 3개)를 클릭하고 “분리” 옵션을 선택합니다.
나머지 콘텐츠 구조는 동일하게 유지하면서 동기화된 패턴 내의 콘텐츠를 재정의할 수 있습니다. 그러면 전체 레이아웃을 그대로 유지하면서 개별 인스턴스의 콘텐츠를 사용자 정의하는 기능을 블록별로 설정할 수 있습니다. 패턴 재정의에 대해 자세히 알아보세요.
동기화되지 않은 패턴은 직접 디자인한 블록 컬렉션으로, 재사용을 원하는 동시에 블록을 페이지 또는 글에 추가한 후 블록의 콘텐츠를 자유롭게 변경하고 싶은 경우 사용합니다. 예를 들어 블로그 글의 이미지와 텍스트가 포함된 일관된 레이아웃이 있을 수 있습니다. 패턴을 만들고 동기화 옵션을 끄고 각 블로그 글에서 같은 레이아웃을 사용하여 이미지와 텍스트를 수정할 수 있습니다.
동기화된 패턴과 달리 동기화되지 않은 패턴이 페이지에 추가되면 일반 블록 모음처럼 작동합니다. 동기화되지 않은 패턴의 콘텐츠를 변경할 수 있으며 이는 해당 단일 페이지 또는 글에만 적용됩니다.
패턴을 변경하면 이전 버전으로 되돌려야 하는 경우에 대비하여 블록의 이전 버전이 저장됩니다. 패턴의 리비전에 접근하려면 다음 단계를 따르세요.
- 알림판을 방문합니다.
- 디자인 → 편집기로 이동합니다.
- 패턴을 선택합니다.
- “내 패턴 모두 관리” 옵션을 클릭합니다.
- 페이지 제목 위에 마우스 커서를 놓고 편집을 선택합니다.
- 오른쪽의 페이지 설정 사이드바를 엽니다. 이 아이콘은 고르지 않은 두 개의 열이 있는 정사각형 모양���니다.
- 패턴 탭에서 리비전을 클릭합니다. “리비전”이 표시되지 않으면 저장된 리비전이 아직 없는 것입니다.
디자인 → 편집기에 접근할 수 없는 경우 사이트에서 블록 테마를 사용하고 있지 않은 것입니다. 사이트 편집기에 접근하지 않고 패턴 리비전에 접근하는 방법:
- 알림판을 방문합니다.
- 디자인 → 패턴으로 이동합니다.
- 리비전을 표시하려는 패턴의 제목을 클릭합니다.
- 오른쪽의 페이지 설정 사이드바를 엽니다. 이 아이콘은 고르지 않은 두 개의 열이 있는 정사각형 모양입니다.
- 패턴 탭에서 리비전을 클릭합니다. “리비전”이 표시되지 않으면 저장된 리비전이 아직 없는 것입니다.
리비전에서는 이전에 저장한 패턴 버전이 모두 표시됩니다. 페이지 및 글의 리비전과 마찬가지로 필요하면 여기에서 이전 버전의 패턴을 로드할 수 있습니다.
사이트에서 패턴을 삭제하는 방법은 다음과 같습니다.
- 알림판을 방문하여 디자인 → 편집기로 이동합니다.
- 패턴 → 내 패턴을 선택합니다.
- 패턴 이름 옆의 점 3개를 클릭하고 “삭제” 옵션을 선택하여 패턴을 삭제합니다.
디자인 → 편집기에 접근할 수 없는 경우 사이트에서 블록 테마를 사용하고 있지 않은 것입니다. 사이트 편집기에 접근하지 않고 패턴 리비전을 삭제하는 방법:
- 알림판을 방문합니다.
- 디자인 → 패턴으로 이동합니다.
- 삭제하려는 패턴의 제목 위로 마우스 커서를 이동합니다.
- 제목 아래에서 “휴지통” 옵션을 선택합니다.
한 사이트에 다른 사이트로 이동하려는 패턴이 있는 경우 블록을 내보내고 JSON 파일로 가져오는 방법은 다음과 같습니다.
- 알림판을 방문합니다.
- 디자인 → 편집기로 이동합니다.
- 패턴을 선택합니다.
- “내 패턴 모두 관리“를 클릭하여 다음 작업을 수행할 수 있습니다.
- 패턴 내보내기: 패턴 제목 위에 마우스 커서를 놓고 “JSON으로 내보내기” 옵션을 클릭합니다. 그러면 컴퓨터에 파일이 저장됩니다. 패턴을 생성한 경우 체크 상자를 사용하여 이러한 패턴을 대량 선택하고 그룹으로 내보낼 수 있습니다.
- 패턴 가져오기: 패턴 관리 화면 상단의 “JSON에서 가져오기” 버튼을 클릭합니다.
디자인 → 편집기에 접근할 수 없는 경우 사이트에서 블록 테마를 사용하고 있지 않은 것입니다. 사이트 편집기에 접근하지 않고 패턴을 가져오는 방법:
- 알림판을 방문합니다.
- 디자인 → 패턴으로 이동합니다.
- 패턴 화면 상단의 “JSON에서 가져오기” 버튼을 클릭합니다.
- “파일 선택“을 클릭하고 업로드할 파일을 선택합니다.
- “가져오기” 클릭합니다.
사이트 편집기에 접근하지 않고 패턴을 내보내는 방법:
- 알림판을 방문합니다.
- 디자인 → 패턴으로 이동합니다.
- 내보내려는 패턴의 제목 위로 마우스 커서를 이동합니다.
- 제목 아래에서 “JSON으로 내보내기” 옵션을 선택합니다.