HTML PDFファイルの貼り付け方
PDF ファイルを画像ファイルのようにページに貼り付けて表示する方法は、下記 3通りあります
１． <iframe> ～PDFファイル名～ </iframe>
２． <object> ～PDFファイル名～ </object>
３． <embed> ～PDFファイル名～
どの方法を用いても、表示結果、操作感とも同じです
<iframe> 記述例
| <iframe src="https://abhp.net/hp/img/HP_HTML_000002.pdf#page=1&view=Fit&viewrect=0,0,570,0&pagemode=none&scrollbar=0"
width="600" height="332" scrolling="no" marginwidth="0"
marginheight="0" frameborder="0" style="border:none;"></iframe> |
PDFファイルの貼り付け方 解説
各タグの 「 src 」、もしくは、「 data 」属性で指定したファイルを、プラグインソフトに渡します
PDF ファイルの場合、通常、プラグインソフトは、「Acrobat （Reader）」で、実際にPDFファイルを表示するのは、「Acrobat
（Reader）」となります
その為、ページの表示直後、フォーカスはプラグインソフ ト「Acrobat （Reader）」 に渡ってしまうので、マウスホイールを回しても、ページはスクロールしません
<iframe>、<object>、<embed> 表示でないところをクリックして、フォーカスをページに戻してやる必要があります
<embed>
<embed>は、HTML5で、標準仕様となる予定ですが、 もともと、Netscape Navigator独自の仕様で、HTML4.01の仕様に含まれていない為、ホームページビルダーで使用する際は、ビジュアルサイトビュー（サイトの確認）画面で、ページを表す長矢印に「
× 」マークが付きます
Internet Explorerにも実装されており、使用上の問題はありません
「まるごとチェック」にも引っ掛かりません
<object>
HTML4.01仕様に従うならば、<embed>タグではなく、<object>タグを使用することになりますが、ブラウザにより対応していない場合があるため、<embed>タグを使う方が一般的です
<iframe>
それぞれ、一長一短がありますので、ここは間を取って（？）、<iframe>（インラインフレーム）タグを使用しましょう
１． <iframe> によるPDFの表示
表示例
記述例
<iframe src="https://abhp.net/hp/img/HP_HTML_000002.pdf#page=1&scrollbar=0&view=Fit&viewrect=0,0,570,0"
width="600" height="332" scrolling="no" marginwidth="0"
marginheight="0" frameborder="0" style="border:none;"></iframe>
URL 中でのPDFファイルパラメータの指定方法
パラメータを複数指定する際は、アンパサンド（&）、または、パウンド（#）文字のいずれかで、それぞれのパラメータを区切ります
アクションは、URL 文字列のうち、左から右に処理、および、実行されますので、相反する指定をすると、後のアクションが前のアクションの効果をオーバライドすることがあります
移動先を名前で指定する場合を除き、コマンドは大文字と小文字の区別をしません
URL 中にスペースは入れられません
| PDF パラメータ |
説明 |
| nameddest=destination |
PDF 文書内の移動先の名前を指定します |
| page=pagenum |
整数値を使用して文書中のページ番号を指定します
文書の最初のページのpagenum 値は 1 です |
| comment=commentID |
PDF 文書内の指定ページのコメントを指定します
このコマンドの前にpage コマンドを使用してください
例えば、次のとおりです
#page=1&comment=452fde0e-fd22-457c-84aa-2cf5bed5a349 |
| collab=setting |
文書の注釈を読み込んだり、書き込んだりするために使用される注釈レポジトリを設定し、レビュー用のデフォルトの注釈サーバ、または、デフォルトの環境設定をオーバーライドします
setting はstore_type@location の形式で、store_type の有効な値は以下のとおりです
●DAVFDF（WebDAV）
●FSFDF（ネットワークフォルダ）
●DB（ADBC）
例えば、次のようになります #collab=DAVFDF@https://review_server/Collab/user1
注釈レポジトリについて詳しくは、『Acrobat Online Collaboration: Setup and Administration』を参照してください |
zoom=scale
zoom=scale,left,top |
浮動小数点数、または、整数値を用いて、ズームおよびスクロールの倍率を設定します
例えば、scale 値 100 は 100 ％の倍率を示します
スクロール値left およびtop は、文書が回転されているかいないかに関わらず、表示中のページの左上隅を (0,0)とする座標系で表します |
view=Fit
view=FitH
view=FitH,top
view=FitV
view=FitV,left
view=FitB
view=FitBH
view=FitBH,top
view=FitBV
view=FitBV,left |
PDF 言語仕様で定義されたキーワード値を使用して、表示されるページ のビューを設定します
詳しくは、『PDF Reference』を参照してください
スクロール値left およびtop は浮動小数点数、または、整数の座標値であり、文書が回転されているかいないかに関わらず、表示中のページの左上隅を
(0,0)とする座標系で表します
このコマンドの前にpage コマンドを使用してください
注意：このパラメータはコマンドラインではサポートされていません |
| viewrect=left,top,wd,ht |
浮動小数点数、または、整数の座標値を使用して、スクリーンに表示される矩形（元の文書の表示したい範囲）を、pix 値で指定します
それらの座標値は、文書が回転されているかいないかに関わらず、表示中のページの左上隅を (0,0) とする座標系で表します
このコマンドの前にpage コマンドを使用して下さい
注意：このパラメータはコマンドラインではサポートされていません
<iframe>タグで用意した表示エリアの中に表示するPDF文書の、実際に表示したい範囲を指定します
例えば、PDF文書の幅が 820pix で、上下左右にある 10pix 幅の余白をカットしたい場合、「 viewrect=10,10,800,0
」 と指定します
「 ht 」 の値を 「 0 」 にしておくと、PDF文書の高さ全てが表示対象になりますので、実際の表示エリアの高さを、下記の、「 height="pix
値" 」で調整します |
|
left |
表示範囲の左端からの距離 |
| top |
表示範囲の上端からの距離 |
| wd |
表示範囲の幅 |
| ht |
表示範囲の高さ |
pagemode=bookmarks
pagemode=thumbs
pagemode=none （デフォルト） |
しおり（ bookmarks ）、または、サムネイル（ thumbs ）を表示するか、表示しない（ none ）かを指定します
デフォルト値は、pagemode=none （表示しない）ですが、ユーザの使用環境によっては表示されることがありますので、明示的に指定しておくことをおすすめします |
| scrollbar=1|0 |
スクロールバーをオン、または、オフにします |
| search=wordList |
検索パネルを開き、指定された単語リストにあるすべての単語を検索します。文書の中で最初に一致する単語が強調表示されます
単語は引用符で囲み、スペースで区切ってください
例えば、次のとおりです #search="単語1 単語2"
検索は、単語のみ可能で、連語は検索できません |
| toolbar=1|0 |
ツールバーをオン、または、オフにします |
| statusbar=1|0 |
ステータスバーをオン、または、オフにします |
| messages=1|0 |
ドキュメントメッセージバーをオン、または、オフにします |
| navpanes=1|0 |
ナビゲーションペインおよびタブをオン、または、オフにします |
| highlight=lt,rt,top,btm |
表示したページの指定された矩形を強調表示します。このコマンドの前にpage コマンドを使用してください
矩形値は座標系で整数値で示します。それらの座標値は、文書が回転されているかいないかに関わらず、表示中のページの左上隅を (0,0)とする座標系で表します |
style="border:none;"
style="border-width : 1px;border-style : solid;border-color : gray;" |
枠線無し
| 枠線幅 |
|
： |
|
1 ピクセル |
| 枠線種類 |
|
： |
|
実線 |
| 枠線色 |
|
： |
|
灰色 |
|
ホームページビルダーを使用している場合、PDFファイルの右クリックメニューから、「スタイルの設定」で設定できます |
| fdf=URL |
オープンする PDF ファイルのフォームフィールドに取り込む FDF ファイルを指定します
例えば、次のとおりです #fdf=https://example.org/doc.fdf
注意：fdf パラメータは、URL の最後で指定してください |
| <iframe> パラメータ |
説明 |
| width="pix 値" |
pix 値で、iframe 表示枠の横幅を指定します |
| height="pix 値" |
pix 値で、iframe 表示枠の縦の長さを指定します |
「 Adobe Parameters for Opening PDF Files （日本語版） Adobe® Acrobat® SDK April 2007 Version 8.1 」 参照
| 注意． |
|
PDFファイルは絶対URLで指定
<iframe src="～"> の 「 src= 」 には、HTMLファイル （ ～.html ）
の場合、相対URL（現在位置からの相対的な位置を記述）が使用できますが、PDFファイル （ ～.pdf ） を指定する場合、絶対URL（https://～から記述する）を使用しないと、エラーになります
ホームページビルダーを使用していて、ファイル名変更等を行うと、ホームページビルダーは、絶対URLを相対URLに書換えてしまいますので、後で、手動で、絶対URLに戻してあげる必要があります
PDFファイルは手動でアップロード
<iframe src="PDFファイル名">指定した際の「src="https://abhp.net/img/～"」は、URL指定の為、「"PDFファイル名"」ファイルは、サイト上にあるファイルを表示するという設定になり、ホームページビルダーの「サイト公開」では、アップロードされません
このPDFファイルをサイト上にアップロードするには、下記3つの内のいづれかの方法を用います
| 1. |
|
別途、そのPDFファイルにリンクを張る |
| 2. |
|
一旦、通常のイメージファイルの貼り付けの様に「src="/img/～"」とフォルダ名で指定して「サイト公開」する
その場合、ホームページビルダーではエラー扱いとなり、ビジュアルサイトビューに赤Ｘマークが付きますので、「サイト公開」後、URL指定に修正する |
| 3. |
|
後述の「不要ファイル 削除方法 （ FFFTPミラーリング ）」で説明します、「FFFTP」のミラーリング機能等を利用する |
|
|
２． <object> によるPDFの表示
表示例
記述例
<object data="https://abhp.net/hp/img/HP_HTML_000002.pdf#page=1&scrollbar=0&view=Fit&viewrect=0,0,570,0"
width="600" height="332" hspace="0" vspace="0"></object>
３． <embed> によるPDFの表示
表示例
記述例
<embed src="https://abhp.net/hp/img/HP_HTML_000002.pdf#page=1&scrollbar=0&view=Fit&viewrect=0,0,570,0"
width="600" height="332" hspace="0" vspace="0"><noembed>embed
タグを利用した PDF ファイルの表示例</noembed>
| 注． |
上記表示例で、<embed> タグを使用すると、ビジュアルサイトビュー画面に 「 × 」マークが付くため、上記記述例で全く同じ表示になる事を確認後、実際の表示は、<object>
タグに変更しています |
|