はてなブログでPDFファイルをアップロードしたいなぁと思ってブログ内の機能を調べてみました。
画像はアップロードできるものの、それ以外の形式のファイルはどうやらアップロードできないということが分かりました。
そこで今回紹介するのは、
「Googleドライブを使用してPDFファイルをアップロードして、ブログに埋め込む方法」
になります。
前回の記事でPDFデータをダウンロードできるようにした設定方法です。
GoogleドライブにPDFをアップロードする
まず初めに、作成した
PDFファイルをGoogleドライブにアップロードする方法を紹介します。
- Googleドライブにアクセスします。
https://drive.google.com/drive/my-drive - 左上の「＋新規」をクリックします。
- 「ファイルのアップロード」をクリックします
- アップロードするファイルを選択して「開く」をクリックします
これでGoogleドライブへのアップロードは完了です。
はてなブログにリンクを貼る
- 先ほどアップロードしたPDFファイルの上で右クリックをし「共有可能なリンクを取得」をクリックします。
- 「リンクをクリップボードにコピーしました」と表示されてすぐ消えたのちに、「リンクの共有をオンにしました。リンクを知っている全員が閲覧できるようになりました。」と表示されます
- このURLをブログに貼り付けるとリンクが作成できます。
https://drive.google.com/open?id=1w〇×▽〇×▽〇×▽
PDFファイルを埋め込み形式で表示する方法
これだけでもいいのですが、せっかくですので、PDFの中身が見えて埋め込み形式になっていた方がカッコいいですよね。
↓↓こんな風に
先に説明した方法で共有可能なリンクを取得した後、URLをメモ帳などのテキストファイルに貼り付けます。
https://drive.google.com/open?id=〇〇〇共有アドレス〇〇〇
上記の赤字の部分が共有アドレスになります。
取得したリンクの共有アドレスを以下HTMLコードの赤字部分に挿入します。
<p><iframe src="https://drive.google.com/file/d/〇〇〇共有アドレス〇〇〇/preview" width="600" height="500"></iframe></p>
widthとhightの値は適宜変更してください。
上記のコードをはてなブログの「HTML編集」で入力してください。
これではてなブログへのPDFファイルの埋め込み形式のアップロードは完了です♪
参考にさせていただいたサイトは以下になります。
Googleドライブを使いPDFをブログに埋め込む方法（はてなブログ利用） - 原貫太オフィシャルブログ
最後までお読みいただきありがとうございました(^-^)
