블로그

워드프레스에 PDF를 삽입하는 방법

마지막 업데이트 날짜: 
워드프레스에 PDF를 삽입하는 방법

워드프레스(WordPress) 웹사이트를 운영하다 보면 신청서나 계약서, 브로셔, 메뉴판 같은 문서를 방문자에게 PDF 파일로 공유해야 할 때가 있습니다. 다행히 워드프레스에 PDF를 삽입하는 방법은 생각보다 다양하며, 플러그인을 쓰지 않고도 충분히 해결할 수 있습니다.

이번 글에서는 워드프레스에 PDF를 넣는 간단하고 확실한 네 가지 방법과 각 방법이 어떤 상황에 가장 잘 맞는지 알아보겠습니다. 끝까지 읽고 나면 내 사이트에 딱 맞는 방식을 골라 바로 PDF를 게시하실 수 있을 겁니다.

첫 번째 방법, 구텐베르크 블록 편집기로 워드프레스에 PDF 삽입하기

워드프레스에 PDF를 넣기 위해 굳이 별도의 플러그인을 설치할 필요는 없습니다. 워드프레스에 기본으로 탑재된 레이아웃 도구인 구텐베르크(Gutenberg) 블록 편집기만으로도 충분하거든요. 워드프레스 사용법에 아직 익숙하지 않더라도 누구나 직관적이고 쉽게 따라 할 수 있는 방법입니다. 

다만 한 가지 아쉬운 점은 PDF가 화면에 보이는 방식을 세밀하게 조정하기 어렵고, 방문자의 브라우저 종류나 설정에 따라 미리보기 화면이 다르게 보일 수 있다는 것입니다. 따라서 화면 구성이나 열람 환경이 아주 중요하지 않은 경우에 쓰기 좋습니다.

적용하는 순서는 다음과 같습니다.

  1. 워드프레스를 열고 PDF를 넣고 싶은 글이나 페이지 편집 화면으로 이동합니다.
  2. + 블록 삽입기를 누른 뒤 파일(File) 블록을 검색해 선택합니다. 이어서 업로드(Upload)를 눌러 내 컴퓨터에 있는 PDF 파일을 올리거나, 미디어 라이브러리(Media Library)에서 원하는 파일을 불러옵니다.
  3. WordPress interface with arrows pointing to the + Block Inserter and File options in the left-hand menu
  1. 파일을 선택하면 구텐베르크 블록 편집기가 워드프레스 화면에 PDF를 자동으로 넣어주며, 방문자가 파일을 내려받을 수 있는 다운로드 링크까지 함께 만들어 줍니다.
  2. WordPress interface showing a PDF embedded via the Gutenberg Block Editor

두 번째 방법, 플러그인을 활용해 워드프레스에 PDF 삽입하기

플러그인은 워드프레스의 기능을 넓혀주는 도구로, 웹사이트에 PDF를 훨씬 깔끔하고 편리하게 넣을 수 있도록 도와주는 플러그인도 여럿 나와 있습니다. 

단순히 문서만 띄워두는 수준을 넘어 방문자가 보기에 세련되고 읽기 편한 환경을 만들고 싶다면 플러그인을 쓰는 것이 좋은 선택입니다. 다만 워드프레스닷컴(WordPress.com)을 이용 중이라면 유료 요금제를 써야 플러그인을 설치하고 설정할 수 있다는 점은 미리 염두에 두셔야 합니다.

많이 쓰이는 대표적인 플러그인 몇 가지를 소개해 드립니다.

  • PDF Embedder 플러그인을 사용하면 문서가 보이는 모양을 자유롭게 다듬을 수 있어, 뷰어의 가로세로 크기와 기기별 반응형 화면을 세밀하게 조정하기 좋습니다.
  • 평범한 PDF 문서를 실제 책장을 넘기는 듯한 생생한 2D나 3D 플립북 형태로 보여주고 싶다면 Dear Flipbook 플러그인이 제격입니다. 
  • 반응형 디자인은 기본이고 PDF 문서 내 검색과 필터링, 정렬 같은 부가 기능까지 갖춘 도구를 찾는다면 Document Embedder 플러그인을 추천합니다.

Pro Tip

기본적인 PDF 삽입 기능을 넘어설 때 꼭 플러그인만 써야 하는 것은 아닙니다. Jform을 활용하면 작성 가능한 PDF 양식을 온라인 양식으로 간편하게 변환해 워드프레스 웹사이트에 그대로 넣을 수 있습니다. 또한 Jform의 PDF 임베더 위젯을 사용해 PDF 문서를 업로드한 뒤 양식 화면 안에 바로 띄워줄 수도 있습니다.

An example form embedded into a WordPress website alongside a PDF

세 번째 방법, iFrame 코드로 워드프레스에 PDF 삽입하기

워드프레스 양식이나 계약서, 각종 PDF 문서를 사이트에 넣을 때 iFrame 코드를 쓰는 방법도 있습니다. 

인라인 프레임(inline frame)의 줄임말인 iFrame 코드를 사용하면 외부 웹페이지에 있는 콘텐츠를 현재 페이지 안에 자연스럽게 불러올 수 있습니다. PDF 파일이 다른 서버에 올라가 있거나, 뷰어 화면을 복잡하게 꾸밀 필요가 없을 때, 혹은 플러그인 설치를 피하고 싶을 때 아주 유용합니다.

전체적인 진행 순서는 아래와 같습니다.

  1. 워드프레스의 미디어 라이브러리(Media Library)에 PDF 파일을 올립니다.
  2. 파일 URL을 복사한 뒤 편집 화면에 사용자 정의 HTML(Custom HTML) 블록을 추가합니다.
  3. 복사해 둔 PDF URL을 넣은 iFrame 임베드 코드를 워드프레스 블록에 붙여넣습니다.

다만 평소 코드를 다루는 데 익숙하지 않다면 이 과정이 다소 까다롭게 느껴질 수 있습니다.

Pro Tip

Jform의 PDF 임베드 위젯을 사용해 워드프레스 페이지에 바로 PDF를 띄워보는 것도 좋습니다. 방문자가 새 탭을 열지 않고도 그 자리에서 편하게 문서를 읽을 수 있거든요. 뷰어 크기나 화면 확대 방식, 다운로드 허용 여부까지 입맛대로 조절한 뒤 코딩 한 줄 없이 사이트에 바로 추가할 수 있습니다. 웹사이트에 코딩 없이 더할 수 있는 다양한 양방향 기능이 궁금하다면 Jform 웹사이트 위젯도 함께 둘러보세요.

네 번째 방법, 구글 드라이브나 스크리브드에서 워드프레스로 PDF 불러오기

워드프레스에 넣으려는 PDF 파일이 구글 드라이브(Google Drive) 같은 클라우드 저장소나 스크리브드(Scribd) 같은 문서 발행 플랫폼에 올라가 있다면 이 방식이 잘 맞습니다. 특히 PDF 파일 용량이 크거나, 방문자가 어떤 브라우저로 접속하든 문서가 깨지지 않고 깔끔하게 보이도록 하고 싶을 때 좋은 대안이 됩니다.

물론 코딩이 낯선 분들에게는 과정이 조금 복잡하게 느껴질 수 있습니다. 구글 드라이브나 스크리브드에서 직접 임베드 코드를 발급받은 뒤, 워드프레스의 사용자 정의 HTML 블록을 통해 코드를 넣어야 하기 때문입니다. 이렇게 하면 워드프레스 페이지 안에 외부 문서 뷰어가 그대로 자리 잡아, 화면이 깨지는 문제 없이 매끄럽고 쾌적한 열람 환경을 만들어 줍니다.

Scribd site showing instructions on how to embed Scribd documents in WordPress

내 워드프레스 사이트에는 어떤 방법으로 PDF를 넣을까요?

지금까지 워드프레스 기본 기능부터 플러그인, 코드 활용법까지 워드프레스에 PDF를 삽입하는 여러 가지 방법을 살펴보았습니다. 

만약 워드프레스에 올리려는 문서가 입력 양식 형태라면 Jform을 쓰는 것이 가장 간편합니다. Jform 양식 빌더에서 임베드 코드를 받아 워드프레스에 그대로 붙여넣기만 하면 끝납니다. Jform의 워드프레스 플러그인을 활용하면 이 과정이 한결 더 수월해집니다. 

지금 바로 Jform을 시작해 보세요. 워드프레스에 내 양식을 얼마나 쉽고 빠르게 넣을 수 있는지 직접 경험하실 수 있습니다.

워드프레스 PDF 삽입 관련 자주 묻는 질문(FAQ)

네, 가능합니다. 기본 탑재된 구텐베르크 블록 편집기나 별도의 플러그인을 사용해 워드프레스에 PDF를 넣을 수 있습니다. 코드 다루기에 익숙하신 분들은 iFrame이나 임베드 코드를 복사해 붙여넣는 방식으로도 직접 추가하실 수 있습니다.

플러그인을 설치하지 않고 워드프레스에 PDF를 넣는 가장 쉬운 방법은 워드프레스에 기본으로 들어 있는 구텐베르크 블록 편집기를 사용하는 것입니다.

일반 웹페이지에 PDF를 띄우려면 HTML의 embed 태그나 iFrame 태그를 직접 작성하거나, 외부 문서 뷰어 도구를 연동해 넣을 수 있습니다.

iFrame 코드를 활용해 워드프레스에 PDF를 넣으려면 먼저 해당 PDF 파일의 URL 주소를 확보해야 합니다. 그다음 구텐베르크 블록 편집기에서 사용자 정의 HTML 블록을 열고 파일 URL이 담긴 iFrame 코드를 입력하시면 됩니다.

이 글은 웹사이트에 PDF 문서를 올려야 하는 워드프레스 사이트 운영자, 콘텐츠 관리자, 소상공인이 온라인에서 문서를 가장 간편하고 효과적으로 보여주는 방법을 고를 수 있도록 돕기 위해 작성되었습니다.

코멘트 보내기:

Jform Avatar
이 사이트는 reCAPTCHA로 보호되며 Google 개인정보처리방침 및 서비스 약관이 적용됩니다.

Podo Comment 첫 번째 댓글을 남겨주세요.