워드프레스 패턴: 재사용 가능 블록 생성 및 사용

워드프레스 패턴은 블록 에디터로 글과 페이지에서 콘텐츠를 작성할 때 특정 블록을 ‘나만의 스타일’로 조립 한 후에 재사용이 필요한 경우 불러와서 사용할 수 있는 기능입니다.

워드프레스로 지속적인 콘텐츠를 제작하는 블로거에게는 콘텐츠 작성 시 속도와 피로도를 줄임으로써 더 좋은 콘텐츠를 만들기 위한 기능으로 볼 수 있습니다. 다른 목적의 워드프레스 사이트에서 역시 특정 패턴을 동기화하여, 각각의 페이지에 동일하게 배치하여, 콘텐츠의 통일성 등의 목적을 달성할 수 있습니다.

1️⃣ 워드프레스 패턴 만들기

예를 들어 자주 사용하는 패턴을 만드는 방법은 다음과 같습니다. 이미지를 중앙 정렬한 상태로 사용하고 싶을 때 이미지를 지정한 후 슬러시(/)로 이미지를 선택합니다.

이미지를 중앙 정렬로 변경해 줍니다.

이제 이미지를 패턴으로 변경합니다.

▼ 블록 편집기 상단 또는 좌측에서 옵션(⋮)에서 [패턴 생성]을 누릅니다.

[패턴 추가]에서 원하는 이름을 정하고 카테고리는 사실 상 태그와 같은 역할을 합니다.

동기화 설정은 패턴을 수정할 때 마다 동기화되어, 여러 페이지에 동기화된 패턴이 삽입되었을 때 사용하는 기능입니다. 저의 경우는 패턴을 만들어 사용하되 필요할 때 패턴을 불러온 후에 수정합니다.

[이미지 중앙정렬(기본값]이라고 만든 패턴을 사용하는 목적은 이미지가 기본값이면 상황에 따라 작은 이미지일 경우 좌측에 배치되어 수시로 손이 가는 작업을 줄이기 위해서입니다.

2️⃣ 워드프레스 패턴 관리

워드프레스 [모양] → [디자인] 메뉴로 이동합니다.(아래 보시는 것처럼 이미지 중앙 설정을 안 한 경우 작은 이미지일 경우 좌측으로 쏠린 것을 확인할 수 있습니다.

워드프레스 디자인 화면입니다. 메인 화면을 보여주고 있습니다.

여기에서 스타일을 클릭하면 “색상, 타이포그래피, 블록 등 웹사이트의 시각적 아이덴티티를 미리 확인할 수 있습니다.”

이제 패턴 화면을 확인해 보겠습니다. 아래 이미지 좌측에서는 내가 설정한 패턴의 카테고리 항목이 나타납니다.

마침 이번에 동기화된 패턴 3개를 삭제할 일이 있어 삭제를 진행하겠습니다.

삭제를 클릭하여 패턴을 삭제 했습니다.

워드프레스 패턴의 우측 상단 톱니바퀴는 패턴의 상태를 설정해서 확인할 수 있습니다.

3️⃣ 워드프레스 패턴 튜토리얼

이제까지 설명한 내용을 한번에 보기 쉽게 튜토리얼을 만들겠습니다.

SSH에 접속해서 필요한 이미지를 출력했습니다.

🔢 추천 콘텐츠

ℹ️ 제휴 안내
본 사이트의 콘텐츠에는 제휴 링크가 포함되어 있습니다. 방문자가 이 링크를 통해 상품 또는 서비스를 구매하면 본 사이트는 판매처로부터 수수료를 지급받습니다. 이 과정에서 구매자가 지불하는 금액^{(이벤트 할인 시 금액이 내려갑니다↓)}은 오르지 않습니다. 게시된 가격·할인·재고 정보는 작성 시점 기준이며 실제와 다를 수 있으므로, 구매 전 판매처에서 최종 확인하시기 바랍니다. 상품 선정과 평가는 자체 기준에 따라 작성되며, 수수료 지급 여부가 소개 순서나 평가 내용에 영향을 주지 않습니다.