HTML에 PDF 삽입

꽤 오래 전에 HTML 내에 PDF를 삽입할 수 있는지에 대한 질문이 올라온 적이 있다. 당연한 이야기지만 가능하다. 그러나 이 방법의 단점은 일단 방문한 사람의 컴퓨터에 Adobe Acrobat Reader가 설치되어 있어야만 가능하다. PDF 파일은 현재 출력 문서의 표준처럼 사용되고 있다. 또 많은 전자북이 PDF 형태로 되어 있기 때문에 컴퓨터에 하나씩은 설치되어 있을 가능성이 많다. 그러나 문제는 Adobe Acrobat Reader가 설치되어 있지 않을 수도 있고 요즘 주 브라우저로 사용하는 '크롬에서는 이런 문서는 볼 수 없다'는 점이다.

목차

HTML에 PDF 삽입

꽤 오래 전에 HTML 내에 PDF를 삽입할 수 있는지에 대한 질문이 올라온 적이 있다. 당연한 이야기지만 가능하다. 그러나 이 방법의 단점은 일단 방문한 사람의 컴퓨터에 Adobe Acrobat Reader가 설치되어 있어야만 가능하다. PDF 파일은 현재 출력 문서의 표준처럼 사용되고 있다. 또 많은 전자북이 PDF 형태로 되어 있기 때문에 컴퓨터에 하나씩은 설치되어 있을 가능성이 많다. 그러나 문제는 Adobe Acrobat Reader가 설치되어 있지 않을 수도 있고 요즘 주 브라우저로 사용하는 '에서는 이런 문서는 볼 수 없다'는 점이다.

따라서 오늘은 이런 PDF 문서를 쉽게 다른 사람과 공유할 수 있는 사이트를 소개하겠다. 일단 다음의 PDF 파일은 현재 사용하고 있는 메인보드인 'GA-965DS3'의 보드 매뉴얼을 Scribd에 올린 뒤 공유한 것이다. 기능을 확인해 보면 알 수 있지만 페이지를 넘기는 것 부터 글자를 검색하는 것 까지 간단한 PDF 리더로 손색이 없다는 것을 알 수 있다.

기가바이트 GA-965P-DS3 매뉴얼 by on Scribd

가입하기

이 사이트를 이용해서 문서를 공유하려면 먼저 사이트에 가입해야 한다. 그러나 가입하는 절차는 외국 사이트 답게 정말 간단하다. 너무 간단해서 웃음이 나올 정도이다. 절차는 다음과 같다.

  1. Scribd를 클릭한 뒤 오른쪽 위의 'Sign Up'링크를 클릭한다.
  2. 'Email'에 ID로 사용할 전자우편 주소, 'Password'에 로그인할 때 사용할 암호, 'Username'에 화면에 출력한 자신의 별명(별명으로도 로그인 가능)을 입력하고 Sign Up 단추를 클릭한다.
  3. 이어지는 창에 적당한 정보를 입력한 뒤 'Save' 단추를 누르거나 'Skip' 링크를 클릭한다. 정보를 입력하기 귀찮은 사람은 'Skip' 링클를 클릭해도 된다.
  4. 승인 코드가 전자우편으로 전송되므로 위에서 입력한 전자우편을 확인하고 '승인 링크'를 클릭한다.
  5. '승인 링크'를 클릭하면 그림처럼 로그인된 상태가 된다. 아울러 한글 별명으로 잘 로그인된다.

파일 올리기

이제 적당한 PDF 파일을 올리면 된다. 올리는 방법도 간단하다. 파일을 선택해서 올린 뒤 몇가지 정보만 입력하면 된다.

  1. 페이지 가운데 부분의 'Upload' 단추를 클릭하고 'Click to Choose Files' 단추를 클릭한다. 올릴 수 있는 파일 형식은 'Microsoft Office'(doc, ppt, xls), 'Adobe'(pdf, ps), 'Open Office'(odt, odp, sxw, sxi 등)과 '텍스트'(txt, rtf)이다.
  2. 파일을 선택하고 '열기' 단추를 클릭한다.
  3. 오른쪽 창에서 'Uploads Docs'단추를 클릭한다. 'Mark Private'를 선택하면 자신만 볼 수 있으므로 이 부분은 알아서 선택하기 바란다.
  4. 'Upload Docs' 단추를 클릭하면 그림과같은 진행 창이 나타나며 업로드가 진행된다.
  5. 업로드가 완료되면 다음 그림처럼 문서에 대한 추가 정보를 입력하는 창이 표시된다. 여기에 필요한 정보를 입력하고 'Save Changes' 단추를 클릭한다.
  6. 페이지 아래 쪽의 'Embed Code'의 'Copy' 단추를 클릭한다.

'Embed Code'의 'Copy' 단추를 클릭하면 OBJECT 코드[1]가 클립보드로 복사된다. 따라서 이 코드를 HTML의 적당한 곳에 붙여 넣으면 위의 예처럼 PDF나 기타 다른 문서를 자신의 웹 페이지에 삽입할 수 있다. 다음은 위의 예에서 사용한 코드이다.

<object codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0" id="doc_555695718219320" name="doc_555695718219320" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" align="middle"  height="500" width="100%">
    <param name="movie" value="http://documents.scribd.com/ScribdViewer.swf?document_id=6378209&access_key=key-1dqnr70jv9qcd5cok9da&page=&version=1&auto_size=true&viewMode="> 
    <param name="quality" value="high"> 
    <param name="play" value="true">
    <param name="loop" value="true"> 
    <param name="scale" value="showall">
    <param name="wmode" value="opaque"> 
    <param name="devicefont" value="false">
    <param name="bgcolor" value="#ffffff"> 
    <param name="menu" value="true">
    <param name="allowFullScreen" value="true"> 
    <param name="allowScriptAccess" value="always"> 
    <param name="salign" value="">    
    <embed src="http://documents.scribd.com/ScribdViewer.swf?document_id=6378209&access_key=key-1dqnr70jv9qcd5cok9da&page=&version=1&auto_size=true&viewMode=" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" play="true" loop="true" scale="showall" wmode="opaque" devicefont="false" bgcolor="#ffffff" name="doc_555695718219320_object" menu="true" allowfullscreen="true" allowscriptaccess="always" salign="" type="application/x-shockwave-flash" align="middle"  height="500" width="100%"></embed>
</object>
<div style="font-size:10px;text-align:center;width:100%"><a href="http://www.scribd.com/doc/6378563/-GA965PDS3-">기가바이트 GA-965P-DS3 매뉴얼</a> - <a href="http://www.scribd.com/upload">문서 올리기</a></div>

관련 글타래


  1. 과거에는 OBJECT 코드를 사용했지만 요즘은 CSS와 스크립트를 이용한다. 
2008/10/04 14:37 2008/10/04 14:37
글쓴이
author image
운영체제의 모든 것을 운영하고 있는 IT 블로거. IT 블로거라는 이름은 현재 시국때문에 시사 블로거로 바뀐 상태다. 그러나 나는 아직도 시사와 사회에 관심이 많은 IT 블로거일 뿐이다. 컴퓨터, 운영체제, 시사, 가족, 여행, 맛집, 리뷰등과 살면서 느끼는 소소한 일상이 블로그의 주제이다. 왼쪽의 아이콘은 둘째 딸 다예가 그린 내 모습이다.
오늘의 글
인기있는 글
조회수 많은 글 | 베오베
댓글 많은 글 | 베오베

Trackback

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

  1. Subject : JW Player 도우미 업뎃: PDF/PPT 임베딩 기능 추가!

    Tracked from BLUEnLIVE's ZocKrWorld 2009/09/28 02:10 del.

    1. JW Player 도우미 JW Player 도우미 플러그인은 JW Player라는 걸출한 웹 임베디드 미디어플레이어를 간편하게 사용할 수 있게 도와준다. 그런데, 사소한(이라고 쓰고 거대한이라 읽는...) 버그가 하?

Facebook

Comments

  1. goohwan 2008/10/04 17:58

    예전에 qaos.com에 소개 드린 http://pdfmenot.com 하고 비교하면 성능의 차이가 있나요?
    pdfmenot의 경우 회원가입도 필요 없는데^^;

    perm. |  mod/del. reply.
    • 도아 2008/10/05 05:48

      성능차이가 있는지는 저도 모릅니다. 제가 시험할 때에 저 사이트는 동작하지 않았습니다. 오늘 다시 확인해 보니 여전히 동작하지 않는군요.

    • goohwan 2008/10/05 15:11

      아직 베타 테스트 중이어서 오락가락 하나봐요
      메인화면 제목위에 beta라고 적혀있거든요^^;
      그런데 희한하게도 제가 파일을 올릴땐..정말 잘되는데요^^;ㅋ
      용량이 큰파일도 무리없이...

    • 도아 2008/10/05 15:43

      저는 지금도 안되더군요... 집에서도 안되고 사무실도 안되고,,, 혹시나 해서 XP로 시험하고 있습니다.

    • 도아 2008/10/05 15:46

      파일이 너무 커서 발생한 일입니다. 15M짜리는 업로드가 안되고 오류 메시지도 뜨지 않아 몰랐는데 1.5M짜리를 업로드하니 잘 되는군요. 다만 리더의 기능은 역시 Scribd가 더 낫군요.

  2. The Darkness 2008/10/04 18:47

    pdfmemot.com 에서 해보니 좋더군요.
    가입필요없이 해서 더 나을 듯 싶습니다.

    perm. |  mod/del. reply.
    • 도아 2008/10/05 05:49

      가입이 필요없기 때문에 편하긴 한데,,, 오늘도 그렇고 예전에 사용할 때에도 업로드하면 동작하지 않더군요.

  3. Mr.Dust 2008/10/04 18:57

    요즘 PDF 문서를 많이 접하고 있는데, 유용한 사이트네요. :)

    perm. |  mod/del. reply.
    • 도아 2008/10/05 05:50

      예. PDF를 웹에서 공유할 때는 딱인 것 같습니다.

  4. 아크몬드 2008/10/04 19:10

    유용한 사이트군요^^

    perm. |  mod/del. reply.
  5. 이정일 2008/10/04 21:16

    그러니까 pdf문서를 플래시형태로 변환해 주는 거군요.

    perm. |  mod/del. reply.
    • 도아 2008/10/05 05:52

      변환한다기 보다는 플래시 리더를 사용하는 것입니다. PDF 파일은 원본 그대로 유지하고요.

  6. Rinforzando! 2008/10/05 02:03

    맥에서 사파리를 주로 쓰는 편이라 PDF 리더가 따로 필요 없어 불편함이나 무거움을 생각하지 못 했었습니다.
    저도 가끔 PDF 첨부할 일이 있으면 이런식으로 활용해야겠군요. ^^
    그림파일로 변환하는 것보다 훨씬 낫겠어요 ㅎㅎ

    perm. |  mod/del. reply.
    • 도아 2008/10/05 05:53

      사파리에서는 바로 보이는 모양이군요... 당연히 그림으로 바꾸는 것 보다는 훨씬 편합니다.

  7. bluenlive 2008/10/05 19:57

    오호~ 고맙습니다.
    집에 가면 시스템을 정비해야겠습니다.

    휴... 귀가 10일전... ㅠ.ㅠ

    perm. |  mod/del. reply.
  8. 댕글댕글파파 2008/10/06 11:29

    언젠가 써먹을 일이 있겠네요 :-)
    예전에 도아님 강좌는 어려워서 패스했거든요 ㅋㅋ

    perm. |  mod/del. reply.
  9. 공상플러스 2008/10/06 14:32

    장..난아니군요

    perm. |  mod/del. reply.
  10. Prime's 2008/10/07 00:23

    pdf파일로 제공할거리라도 있었으면 좋겠습니다. :D

    perm. |  mod/del. reply.
    • 도아 2008/10/14 19:55

      하나 만들어 올리시면... 아님 저처럼 매뉴얼이라도.

  11. 루치냥 2009/05/18 19:20

    비슷하게 www.synap.co.kr 에서도 할 수 있네요~!
    한글 사이트라서 그런지 조금 더 쉬워 보이는 느낌입니다~!! ^^;;

    perm. |  mod/del. reply.
    • 도아 2009/05/20 07:27

      영어를 보면 머리에 쥐가 나는 사람이 아니라면 이 사이트를 더 쉽게 볼 사람은 없습니다. 가입 정보도 훨씬 많고 문서 공유 사이트라기 보다는 리포트 공유 사이트로 보이는군요.

  12. ㅇ,ㅇ 2010/05/28 21:20

    감사합니다...!

    정말 찾고 있던 거였는데...

    10메가 이상 파일도 올리고 싶은데
    자꾸 에러나던데 크흑...ㅠㅠ

    아무튼
    좋은 기능이군요...


    P.S
    그런데
    1. IO error streaming document 라고 뜨던데..
    해결법은없을까요...ㅠㅠ

    2. 어떤건잘올라가고 어떤건 잘안올라가는데..ㅠㅠ
    IO error streaming document <-이게 문제에요..

    perm. |  mod/del. reply.
    • 도아 2010/05/30 04:27

      해당 사이트에 직접 문의하시기 바랍니다.

댓글로 기쁨을 나눠요!

(옵션: 없으면 생략)

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