PDF에 페이지 번호, 날짜, 제목을 자동으로 넣는 법
단순히 요리법을 저장하는 거라면 스크린샷으로도 충분합니다.
하지만 법적 증거, 학술 연구, 비즈니스 아카이빙을 위해 웹페이지를 저장한다면 단순한 그림 파일로는 부족합니다. 맥락(Context)이 필요합니다. 정확히 언제 저장했는지, 어디서 가져왔는지, 그리고 페이지 번호가 명시되어야 합니다.
저희 도구에는 전문적인 "머리글 및 바닥글(Header & Footer)" 엔진이 내장되어 있어, PDF의 모든 페이지에 이러한 정보를 자동으로 삽입할 수 있습니다.
사용 방법과 즉시 복사해서 쓸 수 있는 템플릿을 소개합니다.
작동 원리
"Advanced Settings(고급 설정)" 섹션에 두 개의 입력창이 있습니다:
- Header HTML (모든 페이지 상단에 표시)
- Footer HTML (모든 페이지 하단에 표시)
여기에 표준 HTML을 입력하면 되지만, 핵심은 **특수 CSS 클래스(Special CSS Classes)**를 사용하는 것입니다. 이 클래스 이름을 사용하면 변환기가 자동으로 데이터를 채워줍니다:
<span class='date'></span>→ 현재 인쇄 날짜 삽입<span class='title'></span>→ 웹페이지 제목 삽입<span class='url'></span>→ 원본 소스 URL 삽입<span class='pageNumber'></span>→ 현재 페이지 번호 삽입<span class='totalPages'></span>→ 전체 페이지 수 삽입
바로 쓰는 3가지 템플릿 (복사-붙여넣기)
외부 스타일시트 없이도 PDF 엔진에서 완벽하게 작동하도록, 안정적인 인라인 CSS(style="...")를 사용하여 만든 템플릿입니다.
1. "심플 페이지 번호" (바닥글용)
가장 일반적인 스타일입니다. 모든 페이지 하단 중앙에 깔끔하게 페이지 번호를 표시합니다.
"Footer HTML"에 붙여넣으세요:
<div style="font-size: 10px; text-align: center; width: 100%; padding-top: 5px;">
<span class="pageNumber"></span> / <span class="totalPages"></span> 페이지
</div>
2. "아카이브/증빙용" (바닥글용)
법적 증거 자료나 연구용으로 완벽합니다. 왼쪽에는 출처 URL을, 오른쪽에는 저장된 날짜를 표시합니다.
"Footer HTML"에 붙여넣으세요:
<div style="font-size: 8px; width: 100%; border-top: 1px solid #ccc; padding-top: 5px; overflow: hidden;">
<span style="float: left; max-width: 70%;">출처: <span class="url"></span></span>
<span style="float: right;">저장일: <span class="date"></span></span>
</div>
3. "전문 보고서 스타일" (머리글용)
웹 캡처를 정식 문서처럼 보이게 만듭니다. 왼쪽에는 제목을 굵게, 오른쪽에는 날짜를 배치합니다.
"Header HTML"에 붙여넣으세요:
<div style="font-size: 10px; width: 100%; margin-bottom: 10px; overflow: hidden;">
<span style="float: left; font-weight: bold; max-width: 75%;" class="title"></span>
<span style="float: right;" class="date"></span>
</div>
중요한 팁
- ⚠️ 여백(Margins) 확보 필수: 머리글과 바닥글은 페이지 여백 안쪽에 들어갑니다. 여백이 "0"이면 머리글이 잘려서 안 보입니다! 이 템플릿들을 사용하려면 상단(Top)과 하단(Bottom) 여백을 최소
0.4in(또는10mm)로 설정하세요. - 글꼴 크기: PDF 엔진의 글꼴 크기는 화면과 다르게 느껴질 수 있습니다.
8px에서10px정도가 적당합니다. 그보다 작으면 인쇄 시 뭉개질 수 있습니다.
더 전문적인 문서가 필요하신가요? 머리글 설정은 시작일 뿐입니다. 전문적인 PDF 생성을 위한 더 많은 팁을 완벽한 웹페이지 PDF 생성을 위한 궁극의 가이드에서 확인하세요.
