블로그에 PDF 저장 단추를 달자!

PDF 저장 단추 달기

오늘은 블로그에 PDF 저장 단추를 다는 방법을 설명하겠다. 웹으로 접속이 가능하고 필요하면 인쇄해서 가지고 다니면 되기 때문에 블로그의 내용을 PDF로 저장하는 단추는 따로 필요없을 듯 하다. 그러나 자신이 방문한 페이지를 PDF로 저장하는 사람도 있고 MHT 파일로 저장하는 사람도 있다. 또 PDF 저장 서비스를 유료로 제공하는 사이트도 있기 때문에 나름대로 유용한 기능이라고 생각한다.

설치형의 가장 큰 잇점은 역시 '자신이 필요로 하는 기능을 언제든지 추가할 수 있다'는 점이다. 매번 일일전송량 부족등의 문제, '호스팅 비용 문제'[1]를 겪지만 계속해서 설치형을 사용하는 가장 큰 이유이기도 하다. 이 블로그도 마찬가지다. 이 필요하면 플러그인을 만들어 추가한다. 플러그인을 사용할 필요가 없으면 스킨을 약간 바꿈으로서 기능을 추가할 수 있다.

오늘은 블로그에 PDF 저장 단추를 다는 방법을 설명하겠다. 웹으로 접속이 가능하고 필요하면 인쇄해서 가지고 다니면 되기 때문에 블로그의 내용을 PDF로 저장하는 단추는 따로 필요없을 듯 하다. 그러나 자신이 방문한 페이지를 PDF로 저장하는 사람도 있고 MHT 파일로 저장하는 사람도 있다. 또 PDF 저장 서비스를 유료로 제공하는 사이트도 있기 때문에 나름대로 유용한 기능이라고 생각한다.

또 PDF 저장 기능은 설치형만 사용할 수 있는 것이 아니라 티스토리처럼 스킨을 바꿀 수 있는 블로그에서도 아주 간단하게 달 수 있다. 따라서 자신의 블로그의 글을 PDF로 제공하고 싶은 사람은 다음 방법으로 PDF 저장 단추를 달기 바란다. 다는 방법은 아주 간단하다.

  1. 좋아하는 편집기(예: Editplus)로 현재 자신이 사용하고 있는 스킨 파일('skin.html')을 연다. 라면 '관리도구/스킨/HTML/CSS 편집' 메뉴를 통해 편집할 수 있다.
  2. 'PDF 저장'이라는 단추를 달 적당한 위치에 다음 코드를 추가한다.

    <a href="http://savepageaspdf.pdfonline.com/pdfonline/testSettings.asp?&age=0&top=0.5&bottom=0.5&left=0.5&right=0.5&cURL=https://offree.net[##_article_rep_link_##]">PDF 저장</a>
    

    여기서 https://offree.net는 자신의 블로그 주소로 바꿔야 한다.

주의할 점은 스킨의 구조가 복잡한 경우 PDF 저장을 이용하지 못할 수 있다. 또 이 블로그는 예전에 배포한 인쇄 플러그인의 페이지를 PDF로 저장한다. 따라서 블로그 페이지와는 달리 블로그의 부속 메뉴와 광고가 제거된 깔끔한 페이지가 PDF로 저장된다.

PDF 저장 단추
크롬에서 볼 수 있는 PDF

저장 단추를 클릭한 뒤 잠시 기다리면 PDF 파일을 저장할 수 있다. 또 아크로뱃 리더가 설치되어 있으면 그림처럼 PDF 파일의 내용이 화면에 보인다. 다만 크롬에서도 보이는 것은 조금 의외였다.

관련 글타래


  1. 하루 전송량이 얼마되지 않으면 호스팅 비용 부담이 없지만 전송량이 많아지면 호스팅 비용 부담도 크다. 나는 년 4~50만원 정도가 든다. 
글쓴이
author image
운영체제의 모든 것을 운영하고 있는 IT 블로거. IT 블로거라는 이름은 현재 시국때문에 시사 블로거로 바뀐 상태다. 그러나 나는 아직도 시사와 사회에 관심이 많은 IT 블로거일 뿐이다. 컴퓨터, 운영체제, 시사, 가족, 여행, 맛집, 리뷰등과 살면서 느끼는 소소한 일상이 블로그의 주제이다. 왼쪽의 아이콘은 둘째 딸 다예가 그린 내 모습이다.
2009/03/31 10:37 2009/03/31 10:37
오늘의 글
인기있는 글
조회수 많은 글 | 베오베
댓글 많은 글 | 베오베

Trackback

Trackback Address :: https://offree.net/trackback/2423

  1. Subject : 티스토리 인쇄CSS 적용하기

    Tracked from 왕미친세상 2009/04/09 22:17 del.

    GNU 자유 문서 사용 허가 (GFDL / 한국어) : 원저작자표시-사용제한금지-동일조건변경허락 팁텍 티스토리는 인쇄 페이지 기능을 지원하지 않는다. 그러다가 인쇄CSS를 이용하면 어느 정도 자신이 ?

  2. Subject : 블로그 HTML을 PDF로 저장하는 방법

    Tracked from 금메달 아빠 2010/08/17 00:40 del.

    블로그를 PDF로 저장하려면 HTML문서를 PDF(Portable Document File format)로 저장하는 방법이 가끔 블로그에 게시되어 있는 것을 본적이 있습니다. 아마도 MS윈도 사용자들이 필요하니까 연구해 놓은 방?

Facebook

Comments

  1. 날아라뽀 2009/03/31 10:42

    도아님..ㅋ 신기해요.
    도아님 블러그에 오면 참 배울것이 많네요^^
    잘보고 갑니다.!

    perm. |  mod/del. reply.
    • 도아 2009/03/31 11:23

      감사합니다. 달아 두시면 괜찮습니다.

  2. MissFlash 2009/03/31 10:52

    좋은 정보 감사합니다. 저도 예전에 비슷한 서비스를 본 것 같은데 이곳인지는 잘 모르겠네요 :)

    perm. |  mod/del. reply.
  3. MissFlash 2009/03/31 10:55

    제가 지금 찾아보니 같은 곳이네요 ^_^;

    http://pdfonline.com/web2pdf/index.asp

    위 링크에 가시면 자세한 내용을 보실 수 있습니다. :)

    perm. |  mod/del. reply.
    • 도아 2009/03/31 11:23

      예. 같은 곳입니다. 그런데 PDF 저장은 가입을 해야 가능하더군요. 그래서 가입없이 다는 방법을 올린 것입니다.

  4. zinicap 2009/03/31 11:19

    상당히 유용한 서비스군요.
    속도가 느린점이 흠이긴 하지만...
    감사합니다. 유용하게 사용하겠습니다.

    perm. |  mod/del. reply.
    • 도아 2009/03/31 11:24

      예. 속도가 조금 느리지만 사이트를 읽고 파싱한 뒤 변환하는 것을 생각하면 그리 늦다는 느낌은 들지 않더군요.

  5. 럭스구구 2009/03/31 11:22

    항상 좋은 정보 감사합니다.

    perm. |  mod/del. reply.
  6. 빛이드는창 2009/03/31 11:32

    와~ 이런 좋은 기능도 있네요...
    간편하게 만들 수 있구요. 올때마다 늘 좋은 정보를 보게 되는군요.

    perm. |  mod/del. reply.
    • 도아 2009/03/31 16:54

      빛창에도 달아 두면 받아갈 사람이 많을 것 같더군요.

  7. 천사마음 2009/03/31 11:47

    고맙습니다. ^^;;
    정말 유용하게 사용할 수 있을 것 같습니다.

    perm. |  mod/del. reply.
  8. foog 2009/03/31 12:55

    오~ 재밌겠는데요. 바로 적용해봐야겠습니다!

    perm. |  mod/del. reply.
  9. Kael H. 2009/03/31 12:57

    괜찮은 기능이네요.. 저런 기능을 찾아내시는 도아님... 존경스럽습니다~

    perm. |  mod/del. reply.
    • 도아 2009/03/31 16:56

      저는 Kael H.님의 경제지식이 부럽더군요.

  10. 지구별 2009/03/31 13:15

    만일 파이어폭스를 쓰신다면 loop라는 확장기능도 동일한 기능을 합니다.설치하면 주소창 옆에 아이콘이 생기고 누르면 해당 url 혹은 내 컴퓨터상의 문서도 pdf 로 전환해줍니다.물론 기본기능만 사용하면 사이트 가입을 안하셔도 되구요.네이버 같이 말안듣는 사이트의 블로그는 pdf 전환시 오류가 나거나 백지프레임만 변환되는데 이때는 fireshot 확장기능으로 페이지전체를 이미지로 저장한후 이미지를 pdf로 다시변환하면 네이버 블로그도 pdf로 바꿀수는 있습니다.

    perm. |  mod/del. reply.
    • 도아 2009/03/31 16:56

      PDF로 정자하는 프로그램은 많습니다. 물론 네이버는 여전히 문제지만요.

  11. cdmanii 2009/03/31 13:45

    좋은 정보감사해요. pdf 저장이 속도가 좀 빨라진것같네요. 잘쓰겠습니다 ~

    perm. |  mod/del. reply.
  12. 최면 2009/03/31 14:23

    와우~ 내용만 저장이 가능하군요 ^^*

    perm. |  mod/del. reply.
    • 도아 2009/03/31 16:57

      인쇄 플러그인을 이용하면 내용만 저장하는 것도 가능합니다.

  13. 쭌's 2009/03/31 15:35

    좋은 정보 감사합니다!~
    아직은 PDF로 저장 할 만한 컨텐츠는 아니지만 추후에는 꼭 요긴하게 사용할 수 있을 것 같네요..바램이지만..ㅋㅋ

    perm. |  mod/del. reply.
    • 도아 2009/03/31 16:57

      컨텐츠에 대한 판단은 방문자가 하는 것이므로 달아 두셔도 괜찮습니다.

  14. 공상플러스 2009/03/31 15:45

    광고는 깔끔히 떨어지니깐요...
    근데 PDF 리더가 장난아니게 ㅎㄷㄷ해서 좀 두렵습니다

    perm. |  mod/del. reply.
    • 도아 2009/03/31 16:58

      그러면 인쇄 페이지를 이용하면 됩니다.

  15. 랄랄라~ 2009/03/31 16:20

    관리자만 볼 수 있는 댓글입니다.

    perm. |  mod/del. reply.
  16. 턴오버 2009/03/31 19:11

    와~ 정말 신기해요 ㅎㅎ
    저처럼 설치형이 아닌 경우는 불가능한가요?

    perm. |  mod/del. reply.
    • 도아 2009/04/01 07:47

      본문에 있지만 링크를 삽입할 수 있는 블로그면 모두 가능합니다. 네이버도 가능할 것 같군요.

  17. 위상 2009/03/31 20:07

    파이어폭스의 PDF 다운로더 확장기능이랑 비슷한 느낌이군요. 다른 건, 블로그 주인이 다운 받을 수 있도록 만들어 뒀다는 걸까요.

    p.s XP로 왔더니 글자체가 약간 이상하게 보이는군요. 왜이런걸까요. 폰트 문제이려나.

    perm. |  mod/del. reply.
  18. Prime's 2009/03/31 22:15

    후에 블로그를 업그레이드(?)하면 반드시 써보도록 하겠습니다..^^;;

    그런데.. 그전에 html이나 css같은걸 좀 배워놔야 할듯 싶더군요..

    건들기만 하면 날려먹으니...ㅠㅠ

    perm. |  mod/del. reply.
    • 도아 2009/04/01 07:48

      링크를 삽입하는 것이라 삽입하는 위치만 정확히 잡으면 나머지는 쉽습니다.

  19. 초하 2009/03/31 23:55

    우와!! 댓글 폭주네요.
    유용한 정보 공짜로 주시는 고마운 도아님, 거저 얻어갑니다.

    자주 소통은 못해도 이렇게 다녀가는 것이 즐겁긴 합니다.
    건강 유의하시고, 멋진 4월 만드시길 바랍니다~~

    perm. |  mod/del. reply.
    • 도아 2009/04/01 07:48

      초하님도 즐거운 4월 만드시기 바랍니다.

  20. 비트손 2009/04/01 00:41

    이 버튼 삽입 후 이제 PDF로 저장하고 싶은 글을 많이 쓰도록 노력해야 겠네요. :)

    perm. |  mod/del. reply.
  21. 이주일 2009/04/01 04:15

    홈페이지 서체 맑은 고딕 맞나요? 왜 오피스에서 쓰면 이런 느낌이 안나는지... 영문의 경우 예쁜 폰트가 많은데 한글은 이상하게 오피스 공란에 넣으면 괜찮은 폰트가 없으니...

    perm. |  mod/del. reply.
    • 도아 2009/04/01 07:49

      서체는 나눔고딕입니다. 그리고 질문은 님이 누르진 Submit 단추 옆에 있는 QNA를 이용해 주시기 바랍니다.

  22. 레이먼 2009/04/01 10:09

    넘 멋진 정보라서 바로 실행해 봤는데.

    'Server encounter some error. Please try again later'라는 메세지가 뜨네요. 뭐가 잘못된 것일까요?

    perm. |  mod/del. reply.
    • 도아 2009/04/01 12:39

      가끔 오류가 뜨기도 합니다. 그러나 대부분 정상 동작하더군요.

  23. okto 2009/04/01 10:18

    음... 좋아 보이네요. 감사합니다.
    한가지 궁금한게 있는데, 폴딩을 사용한 경우 펼쳐진 상태로 내보내는게 가능할까요? 전부터 한번 여쭤보고 싶었습니다.
    http://mr-ok.com/tc/entry/print-what-you-like
    링크의 서비스 때문에 여기저기 질문을 해봤는데 마땅한 해결방법을 찾기 어렵네요. 본문처럼 ttml.php 파일을 편집해서 기본값을 아예 펼침으로 할 수는 있는데 이게 평소에도 펼침으로 보이면 폴딩을 사용하는 의미가 없어서요... 해당 사이트에서 블로그를 읽어갈때만 펼침으로 보이게 할 방법이 있을지 궁금합니다.

    perm. |  mod/del. reply.
    • 도아 2009/04/01 12:40

      프로그램에서 참조 URL을 검사해서 바꾸면 됩니다. 스크립트로도 가능하고 PHP에서도 가능하지만 PHP에서 바꾸는 것이 조금 더 수월하죠. 다만 저 방식 보다는 인쇄 플러그인을 설치하는 것이 더 나을 것 같군요. 인쇄 기능이 없는 사이트에서 사용하기는 괜찮습니다만.

    • okto 2009/04/01 21:24

      프로그램에서 참조 URL을 검사해서 바꾸면 됩니다. 스크립트로도 가능하고 PHP에서도 가능하지만 PHP에서 바꾸는 것이 조금 더 수월하죠
      PHP에서 바꾸는 것으로 평소에는 접은 상태로 사용하고 저 사이트 이용시에만 펼침으로 하는게 가능하다는 말씀이신가요? 셋 중 하나만 가르쳐주실 수 있나용? 제가 밥한번 시원하게 쏘겠습니다. 바쁘시다면 힌트라도...OTL

      덧. 제가 저 사이트를 사용하는 이유는 원하는 부분을 인쇄할 수 있어서입니다. 저런 플러그인이 나오길 은근히 기다렸는데 나오기 힘들것 같더군요. 구현하기도 어려울것 같고 배보다 배꼽이 커질듯 하기도 하고 말이죠. 물론 추측입니다만...

    • 도아 2009/04/01 23:44

      힌트는 이미 드렸습니다. 프로그램에서 참조 URL을 검사해서 인쇄 사이트에서 요청이 오면 필치고 그렇지 않으면 원래 대로 접어서 표시하도록 코드를 추가하면 됩니다.

    • okto 2009/04/02 14:26

      언어를 쓸 줄 몰라서 좀 난감하지만 힌트 감사합니다. 공부해서 언능 달아봐야겠네요.

    • okto 2009/04/02 20:31

      결국 php파일을 고쳐서 해결했습니다. 뭐 bluenlive님이 해주셨지만요;; 암튼 도움 감사합니다. 으흐흐~

    • 도아 2009/04/03 11:20

      bluenlive님께 고생 많으셨다고 전해 주세요. 참 이번 주말에 시간있으세요?

    • okto 2009/04/03 20:19

      주말에 무슨 좋은일 있나요?
      내일 오전만 아니면 괜찮습니다.

    • 도아 2009/04/04 05:45

      심심해서 놀러나 갈까 싶어서 쓴 글입니다.

    • okto 2009/04/04 13:01

      저는 언제나 환영입니다. 토요일도 좋고 일요일도 좋아요~

  24. koc2000/SALM 2009/04/01 20:31

    고맙습니다. 블로그에 바로 적용했습니다. 도아님처럼 깔끔하게는 안 나오지만, 어쨌든 성공했습니다. 고맙습니다.
    인쇄용 CSS를 연구해서 설정해 봐야겠습니다.

    perm. |  mod/del. reply.
    • 도아 2009/04/01 20:39

      저는 플러그인을 이용하기 때문에 깔끔하게 나올 수 밖에 없습니다. 사용하는 스킨의 구조를 모르겠지만 불필요한 부분에 display: none으로만 지정해도 상당히 깔끔해 집니다. 문제는 PDF 변환 사이트에서 프린트 스타일 시트를 인식할지 어떨지 모르겠군요.

    • koc2000/SALM 2009/04/03 08:35

      고맙습니다. display: none . 간단하면서도 좋은 팁이네요. 여태까지 "어떻게 보일 것인가?"만 생각하다가 스스로 함정에 빠졌네요.
      흠... 현재 pdf 파일 상태로만 보면 다음 두 경우 가운데 하나입니다.
      (1) 아예 스타일시트 설정을 적용하지 않는다.
      (2) 그게 아니면 프린트 스타일시트가 없어서 적용하지 않았다.
      제발 (2)번이기를.... ^^a

    • 도아 2009/04/03 11:19

      전에 확인해 보니 style을 못가져 오는 것 같더군요.

    • koc2000/SALM 2009/04/03 16:06

      그게 아니더라도, 어차피 티스토리는 인쇄 스타일이 제대로 먹히지 않더군요. ^^a 똑같은 스타일인데 w3.org의 상황과 티스토리의 상황이 너무 다릅니다. (w3.org 에서 따온 CSS인데 적용이 안 되네요. 다른 부분은 제가 실수했을지라도 img { border: 0; } 이라는 부분조차 안 먹히네요.)
      PC방에 와서 [인쇄 미리 보기] 결과를 보고 좌절했습니다. 티스토리에서 인쇄 기능과 PDF 저장 기능은 시도는 좋았지만, 장애가 좀 심하네요.

    • 도아 2009/04/04 05:39

      티스토리라고 해서 먹지 않을리는 없습니다. 스킨에서 편집하고, 브라우저가 처리하는 것이기 때문에 티스토리와는 무관합니다.

    • koc2000/SALM 2009/04/04 07:34

      예. 저도 그렇게 생각합니다. 다만 현재로써는 적용이 안 되네요. 제가 검증하지 못한 문제가 좀 더 근본적인 부분에 있어 보입니다. 일단 CSS 파일 내부의 문제가 아니라서 천천히 살펴보고 있습니다.

    • koc2000/SALM 2009/04/06 17:52

      흠. 며칠 동안 동작하지 않았는데, 오늘 다시 동작하는군요. (매일 한 차례씩 달아서 시험해보고 안 되어서 내리기를 반복했지요.)
      (1) 우선 인쇄CSS는 적용하기가 까다로왔지만, 적용에 성공했습니다.
      (2) 아울러 PDF 저장 기능에서 인쇄CSS를 사용한다는 사실을 밝혀냈습니다. 이때 외형만 지원하고 글꼴은 지원하지 않더군요.
      ** 제 블로그에서 잘 되지 않은 이유는 그림이 너무 많아서... 일종의 타임아웃이었습니다. ^^a

  25. Seldon 2009/11/22 20:56

    다른 블로그를 보다가 제 티스토리 블로그 전체를 pdf로 백업받으면 좋겠다는 생각이 들어 검색하다 여기 찾아왔습니다. 더 찾아봐야겠지만 혹시 아시면 알려주시면 고맙겠습니다. 여튼 좋은 정보 잘 봤습니다.

    perm. |  mod/del. reply.
    • 도아 2009/11/23 07:42

      전체를 받는 것은 힘듭니다. 또 받을 필요도 별로 없고요.

    • Seldon 2009/11/23 09:26

      네 그렇군요. 알려주셔서 고맙습니다.

  26. Kata Pro 2010/08/17 00:42

    좋은 정보 감사합니다. 재미있게 읽고 엮인글(http://manofpro.tistory.com/164)을 추가하였습니다.(맞트랙백도 환영합니다.)
    얼마전에도 방문한 기억이 나는데, 다방면에 걸쳐서 재미있는 글이 많아서 재미있습니다.
    앞으로도 좋은 글 기대합니다.
    행복한 하루 되세요.

    perm. |  mod/del. reply.

(옵션: 없으면 생략)

글을 올릴 때 [b], [i], [url], [img]와 같은 BBCode를 사용할 수 있습니다.