WordPressでpdfを表示するプラグイン「Embed PDF」+α

embedtop

pdfファイルをサイトに掲載するとき、リンクをはって、ダウンロードで表示するか、ビューアで表示するという感じだと思います。
WordPressではやはりプラグインで簡単に解決できるのです。それが「Embed PDF」です。

「Embed PDF」の使い方あれこれ

EmbedPDFプラグイン > 新規追加から「Embed PDF」を検索してください。インストール後は「有効化」をお忘れなく。

「Embed PDF」でpdfを表示させるには

「投稿」のダッシュボードで記事を投稿するかのごとく、サクサクとpdf表示が可能です。

投稿ページがら「メディア追加」をクリックし、表示させたいpdfファイルをアップロードします。

embed

アップロードされたpdfファイルのURLをコピーしておきます。
embed

投稿ページにショートコードをいれます。

embed
[embed width="100%" height="1000"]PDFのリンク先URL[/embed]

です。

ショートコードは半角のカッコで囲ってください。また、embed タグのwidthとheightの値は、サイトに合わせて調整してみてください。

では、実際にやってみます。

「PDFのリンク先」部分にアップロードしたpdfファイルのURLを貼付けます。

[embed]http://nanameidea.com/wp-content/uploads/2016/08/sampleppp.pdf[/embed]

な感じのショートコードが投稿枠にいれることになります。

「embed」タグで囲い、「width」「height」で「幅」と「高さ」を指定するのですが、今回は、縦横設定なしのデフォルトで表示してみたいと思います。

そうしますと、

この通り、でき上がりです。

PPTが16:9の比率で作成され、そのままpdfで保存したので、下部にスペースが空いてしまいました。やはり調整は必要のようですね。

Embed PDF

「Embed PDF」でpdfが表示できないときに役立つobject

WordPressを運営していく上で、さまざまなプラグインも入れるでしょうし、プログラムファイルをカスタマイズされる方もいるでしょう。そうしてプラグイン同士がバッティングし、うまく動かないこともしばしば・・・・

「Embed PDF」もぶつかって動かないこともあるのです。(大概はプログラム設計でミスっていることが多いですけど。)

「Embed PDF」が動かなくてもpdfを表示させたい!を叶えるために、ちょっと、力技ですが、プラグインがなくともpdfを表示できる方法はあります。objectを使います。

<object data="ここにURLを入力" type="application/pdf"
 width="数値" height="数値"></object>

です。

実際に使って、sampleppp.pdfを表示させてみます。

横幅は「width=”100%”」で縦幅「 height=”600px”」としてみました。

どんな時に使えるのだろうか?

企業の何かしらのお知らせ・リリースや店舗がチラシを作成した時、キャンペーンページを作成する時間や工数がとれない場合はWebで訴求可能にもなりますよね。

「pdfはこちら」みたいは誘導もありますが、正直、クリックしないですよね。ぼくはしないです。

ABOUTこの記事をかいた人

よしみといいます。Webコンサルやっていたり、企画やっていたり、人事やっていたり、とりあえず軸がブレブレの生活をおくっています。基本的にブルーライトをあびていないと気がストレスが溜まっていってしまいがちですが、がんばって外の世界に出ていきたいと思います。