JSON 파일 페이지 추가는 엘리멘토(Elementor)에서 제작된 페이지 디자인을 JSON 파일로 불러와 새 페이지에 적용하는 기능입니다.
페이지를 처음부터 직접 디자인하지 않고, JSON 파일 하나로 완성된 레이아웃을 빠르게 사이트에 적용할 수 있습니다.
세팅 완료 시, 공개 상태의 페이지에 JSON 파일의 디자인이 그대로 적용된 상태가 됩니다.
1. 준비물 #
☐ 적용할 엘리멘토 JSON 파일
2. 전체 진행 흐름 요약 #
3. 단계별 진행 #
Step 1. JSON 파일 다운로드
페이지에 적용할 엘리멘토 디자인이 담긴 JSON 파일을 내 컴퓨터에 저장합니다.
제공받은 경로에서 JSON 파일 다운로드
Step 2. 새 페이지 생성
웹사이트 관리자에서 빈 페이지를 새로 만들고 공개 상태로 저장한 뒤 엘리멘토 편집기로 진입합니다.
📂 경로: 사이트 디자인 → 페이지 추가
1. 제목 란에 페이지 이름 입력
2. 우측 패널에서 상태를 공개 클릭 (페이지 저장)
3. 엘리멘토로 편집 클릭
⚠️ 엘리멘토로 편집 버튼이 보이지 않으면 페이지를 먼저 저장하면 버튼이 활성화됩니다.
Step 3. JSON 템플릿 가져오기
엘리멘토 편집기의 빈 캔버스에서 폴더 아이콘을 클릭해 템플릿 라이브러리를 열고, JSON 파일을 가져와 페이지에 삽입합니다.
1. 빈 캔버스 우측 폴더 아이콘 클릭
2. 상단 템플릿 가져오기 아이콘 클릭
3. 다운로드한 JSON 파일 선택
4. 계속 클릭
5. 추가된 템플릿 삽입 클
⚠️ 폴더 아이콘은 캔버스가 비어 있을 때만 표시됩니다. 이미 섹션이 추가된 경우 기존 섹션을 모두 삭제 후 진행합니다.
Step 4. 페이지 공개
엘리멘토 편집기에서 공개 버튼을 클릭해 변경 내용을 저장하고 페이지를 활성화합니다.
페이지 편집 후 우측 상단 공개 버튼 클릭
4. 완료 체크 #
☐ 새 페이지가 공개 상태로 저장됨
☐ 엘리멘토 편집기 캔버스에 JSON 파일 디자인이 정상 적용됨
☐ 공개된 페이지 URL로 접속 시 디자인이 그대로 노출됨
5. 자주 막히는 문제 #
01. JSON 파일 가져오기가 실패함
원인: 파일 형식이 올바르지 않거나 엘리멘토에서 내보낸 JSON이 아닌 경우
해결 방법:
파일 확장자가 .json인지 확인
02. 엘리멘토로 편집 버튼이 보이지 않음
원인: 페이지가 저장되지 않은 상태이거나 엘리멘토 플러그인이 비활성화된 경우
해결 방법:
페이지를 먼저 저장한 뒤 다시 확인
03. 가져온 디자인이 깨져 보임
원인: JSON 파일에 포함된 이미지가 현재 사이트의 미디어 라이브러리에 없는 경우
해결 방법:
1. 원본 이미지 파일을 미디어 → 새로 추가에서 업로드
2. 엘리멘토 편집기에서 깨진 이미지 위젯 클릭 → 이미지 교체