記事内にPDFを表示する時に使用するプラグイン「Embed PDF」!

公開日:2014年7月29日
最終更新日: 2015年6月18日

wp_embedpdf_photo_01

こんにちは!

内容によっては、記事内にPDFをサムネイルで表示させたいケースなどもあります(今はなくても将来確実にそんな時は来ますよ)。デフォルトの状態でそれを実現するためには、サムネイル用の画像を作成して、そこからPDFのリンクを貼るという、ちょっと面倒な作業が発生してしまいます。出来れば、もっと簡単に実装したいですよね。そんな時に便利なのが、プラグイン「Embed PDF」です。

このプラグインを使用すれば、記事内にPDFをサムネイルで表示することができ、そのサムネイルからPDFを「Google Doc Viewer」で確認することができます。非常に便利ですので、今回はこの「Embed PDF」について記事にしたいと思います。

目次!

1.「Embed PDF」のインストール!
2.実際に投稿してみる!
3.プレビューができない原因!

「Embed PDF」のインストール!

最初に「Embed PDF」をインストールします。

管理画面から「Embed PDF」をインストール!

管理画面へログインし「プラグイン」⇒「新規追加」をクリックしてください。

wp_embedpdf_photo_02

「プラグインのインストール」画面が開きますので、「検索」の入力欄に「Embed PDF」と入力し「プラグインの検索」をクリックしてください。

wp_embedpdf_photo_03

プラグインの検索一覧が表示されますので「Embed PDF」の「いますぐインストール」をクリックしてください。

wp_embedpdf_photo_04

「本当にこのプラグインをインストールしてもいいですか?」の画面が表示されますので「OK」をクリックしてください。

wp_embedpdf_photo_05

プラグインがインストールされますので「プラグインを有効化」をクリックしてください。

wp_embedpdf_photo_06

プラグインの画面に戻り「Embed PDF」がインストールされ有効化したのが、確認できます。

wp_embedpdf_photo_07

以上で「Embed PDF」のインストールが完了しました。

実際に投稿してみる!

では実際にPDFを投稿してみましょう。

管理画面へログインし新規投稿画面を表示!

管理画面へログインし新規投稿画面を開きます。今回はテストとして、記事タイトルは「PDFを表示!」と入力します。

wp_embedpdf_photo_08

次に記事入力画面へカーソルを移動させてから、「メディアを追加」をクリックしてください。

wp_embedpdf_photo_09

「メディアを挿入」画面が開きますので、「ファイルをアップロード」をクリックしてください。

wp_embedpdf_photo_10

「ファイルを選択」から該当のPDFを選択してください。

wp_embedpdf_photo_11

PDFを選択すると「メディアライブラリ」が表示されますので「添付ファイルの表示設定」のリンクをコピーしてください。このリンクがサーバーにアップしたPDFのリンク先になります。リンクをコピーしたら右上の「×」から画面を閉じてください。

wp_embedpdf_photo_12

新規投稿画面に戻りますので、投稿入力画面に以下のような形でコードを入力してください。先ほどコピーしたPDFのリンク先のURLを「embed」タグで囲ってください。「width」「height」にはそれぞれ「幅」と「高さ」を指定してください。

[embed width=”幅” height=”高さ”]PDFのリンク先[/embed]

実際に投稿したPDFのサムネイルです。右上の矢印のボタンをクリックすれば、別ウインドウで画面が開きます。

以上で設定完了です。

プレビューができない原因!

最初に「Embed PDF」を導入した時は、なぜかPDFのサムネイルが表示される箇所に「プレビューできません」と表示され、上手く動作しませんでした。原因を調べてみると、公開前のサイトでBasic認証を掛けていたのが原因でした。

Basic認証が掛かっているとサムネイルが表示できませんので、ご注意ください。

こんな感じでサムネイルが表示されません。

最後に!

今までの経験上、カンパニーサイトで報告書などをPDFで表示するようなケースがよくありました。通常のブログで使用することは、ほとんど無いと思いますが、プラグインを使用すれば、PDFをこのような形で掲載できることを知っておいて損はないと思います。

以上「記事内にPDFを表示する時に使用するプラグイン「Embed PDF」!」でした!

それではまた。

公開日:2014/07/29
最終更新日: 2015年6月18日
カテゴリー:WordPress

関連記事

新着記事

コメント/トラックバック

トラックバック用URL:

この投稿のコメント・トラックバックRSS




管理人にのみ公開されます

正しい数値を入力して下さい * Time limit is exhausted. Please reload CAPTCHA.

最新の記事

カテゴリー

過去の記事

プロフィール

  • 著者:Masaki Yamashita

    大阪でWEB制作の仕事をしています。
    WEBデザイン、コーディング、WordPress・EC-CUBEの設置やカスタマイズなど何でもやっています。

follow us in feedly