결론
WordPress.org에서 설치하고 활성화하면 즉시 블록 편집기에서 사용할 수 있습니다. 중단점 사용자 정의는 선택 사항이지만 사이트 디자인에 맞게 조정하면 보다 정확하고 반응이 뛰어납니다.
설치 방법
WordPress 관리 화면에서 설치(권장)
- WordPress 관리 화면에서 플러그인 > 새로 추가 열기
- 검색란에 ‘ZenBlocks‘을 입력합니다.
- ZenBlocks이 표시되면 지금 설치를 클릭하십시오.
- 설치가 완료되면 활성화를 클릭합니다.
포인트: WordPress.org의 공식 디렉토리에서 배포하고 있기 때문에 보안 심사를 통과한 안전한 플러그인입니다.
ZIP 파일에서 설치
- WordPress.org의 ZenBlocks 페이지에서 ZIP 파일 다운로드
- WordPress 관리 화면에서 플러그인 > 새로 추가 > 플러그인 업로드 열기
- 다운로드한 ZIP 파일을 선택하여 업로드
- 플러그인 사용을 클릭합니다.
활성화 확인
활성화가 완료되면 블록 편집기의 삽입 패널에 ZenBlocks Elements 범주가 표시됩니다.
- 모든 게시물 또는 고정 페이지 편집 화면 열기
- 왼쪽 상단의 + 버튼을 클릭하여 블록 삽입 패널 열기
- ZenBlocks에서 검색하거나 카테고리 목록에서 ZenBlocks Elements를 찾습니다.
- Button Basic 블록이 표시되면 설치 성공
설정 화면 개요
설정 > ZenBlocks에서 플러그인의 일반 설정에 액세스할 수 있습니다.
| 품목 | 설명 |
|---|---|
| 중단점 설정 | 기기별 화면 너비 임계값 변경 |
| CSS 캐시 클리어 | 프런트 엔드 스타일 캐시를 수동으로 지우기 |
| 라이센스 관리 | Pro판의 라이센스 키 입력·상태 확인 |
중단점 사용자 정의
ZenBlocks을 사용하면 반응형 디자인을 위해 4개의 중단점을 사용자 정의할 수 있습니다.
기본값
| 장치 | 표시 이름 | 화면 폭 |
|---|---|---|
| PC | 데스크탑 | 1141px 이상 |
| MD | 중간 화면 | 841px ~ 1140px |
| TB | 태블릿 | 541px ~ 840px |
| SP | 스마트폰 | 540px 이하 |
변경 방법
- 설정 > ZenBlocks 열기
- 중단점 설정 섹션에서 값 변경
- 저장을 클릭합니다.
주석: 중단점을 변경하면 모든 ZenBlocks 블록의 반응형 CSS이 재생성됩니다. 기존 페이지에서 스타일이 무너지면 CSS 캐시를 지웁니다.
다음 단계
설정이 완료되면 처음 버튼 작성에서 실제로 블록을 사용해 봅시다.