이미지로 내보내기
가장 많이 쓰는 내보내기입니다. 섹션 하나가 이미지 파일 하나가 됩니다.
이 문서가 다루는 도구는 블록 에디터 입니다 — 제목·이미지·표·그래프를 세로로 쌓아 상세페이지를 만들고 PNG 나 HTML 파일로 내려받습니다. 옆에 열어 두고 따라 하시면 빠릅니다. 다른 도구는 도구 목록에 있습니다.
전부 한 번에
오른쪽 위 Export → 이미지로 내보내기 (PNG) 입니다. 「전체 N개 섹션을 PNG 이미지로 내보냅니다. 계속할까요?」 라는 확인 창이 먼저 뜨고, 승낙하면 진행 상황이 화면 아래에 「내보내는 중... (3/7)」 처럼 표시됩니다.
파일은 Section-01.png · Section-02.png … 순서로 저장됩니다. 캔버스 위에서 위에 있는 섹션이 01 입니다. 가로폭은 860px 입니다.
섹션 수만큼 파일이 한꺼번에 내려옵니다. 브라우저가 「여러 파일을 다운로드하시겠습니까」를 물으면 허용해야 전부 저장됩니다.
하나만, 또는 다른 형식으로
캔버스에서 섹션을 클릭해 고르면 오른쪽 속성 패널에 Export 항목이 생깁니다. 여기서 세 가지를 정합니다.
| 고르는 것 | 선택지 | 기준 |
|---|---|---|
| 형식 | PNG · JPG · GIF(정적) · GIF(애니메이션) | 기본은 PNG. 사진이 크게 들어가 용량을 줄여야 하면 JPG |
| 너비 | 860px (기본) · 780px (쿠팡) | 올릴 곳이 정한 폭에 맞춥니다 |
| 실행 | 「이 섹션 내보내기」 | 고른 섹션 하나만 저장됩니다 |
고른 너비는 결과 파일에 그대로 반영됩니다. 780px 을 고르면 실제로 가로 780픽셀짜리 파일이 나옵니다. 세로 길이는 섹션 내용에 따라 자동으로 정해집니다.
요소가 잘려 나올 때
가장 자주 들어오는 문제입니다. 원인은 거의 하나입니다.
내보낸 이미지는 언제나 섹션 크기에 맞춰 잘립니다. 편집 화면에서 섹션 경계 밖으로 삐져나온 것은 파일에 담기지 않습니다. 편집기의 섹션 속성에도 「내보내기 PNG는 항상 섹션 크기로 잘림」이라고 적혀 있습니다.
스티커·도형·형광펜처럼 자유롭게 움직이는 요소를 섹션 위쪽이나 아래쪽으로 살짝 빼 놓으면 화면에서는 멀쩡한데 파일에서만 사라집니다. 해결은 잘리는 요소를 옮기는 게 아니라 섹션을 키우는 것입니다.
- 그 섹션을 고르고 오른쪽 패널의 아래 패딩 을 늘립니다.
- 또는 섹션 안 맨 아래에 여백(갭) 블록을 하나 넣습니다 — G.
- 그런 다음 삐져나갔던 요소를 새로 생긴 공간 안으로 들여놓습니다.
섹션 속성의 「섹션 밖 보이기 (미리보기)」 를 켜면 경계 밖 요소가 편집 화면에서 보이게 됩니다. 다만 이건 보기 옵션일 뿐이라, 켜 놓아도 내보낸 파일에서는 여전히 잘립니다. 무엇이 밖에 나가 있는지 확인하는 용도로 쓰세요.
그 밖에 확인할 것
- 글자가 흐리게 나온다 — 화면 배율(오른쪽 위 − +)은 결과와 무관합니다. 내보내기 폭이 860px 인데 훨씬 큰 화면에 띄워 보고 있다면 원본이 흐린 게 아니라 늘려 본 것입니다.
- 배경색이 안 나온다 — 배경은 페이지 층과 섹션 층 두 곳에 있습니다. 섹션 배경이 투명이면 페이지 배경이 비칩니다. 간격과 정렬의 「세 층」 표를 보세요.
- 일부 섹션만 실패한다 — 전체 내보내기는 실패한 섹션이 있으면 「⚠️ N/전체개 실패」 로 알려 줍니다. 그 섹션만 골라 다시 내보내 보세요.
- 글자를 복사할 수 있어야 한다 — 이미지 안의 글자는 그림입니다. HTML로 내보내기를 쓰세요.