WordPressPDF Embedプラグイン
2024/05/04
WordPress icon
.webp)
概要
WordPressで構築したサイトで投稿記事にPDFファイルを埋め込み、クリックなしで表示させたい。
プラグインのPDF Embedderを使うと、最近構築したWordPress 6.5.2 Cocoon Child テーマのサイトでどうやってもエラー(*)になる。
他のプラグインとして名前が似ていて紛らわしいが PDF Embed を導入してみた。
PDF Embedderは プラグインのインストール画面の表示で導入数は多いが "使用中のWPバージョンで未検証"と表示され、PDF Embedは "使用中の WP バージョンと互換性あり" と表示される。
PDF Embedは、表示する際にAdobeのAPI keyを取得するので、面倒だがこちらが本筋かもしれない。
*参考:PDF Embedderのエラーについて
表示できずに"読み込み中"で、固まる。検証(DevTools)では、次のようなエラーになる。
jquery.min.js?ver=3.6.1:2
Uncaught Error: No "GlobalWorkerOptions.workerSrc" specified.
at n (pdf-test2/?preview_id=1254&preview_nonce=4041d64825&preview=true:828:134903)
at s.value (pdf-test2/?preview_id=1254&preview_nonce=4041d64825&preview=true:828:136019)
at new s (pdf-test2/?preview_id=1254&preview_nonce=4041d64825&preview=true:828:135696)
at t.getDocument (pdf-test2/?preview_id=1254&preview_nonce=4041d64825&preview=true:828:118454)
at pdfemb.min.js?ver=4.7.1&fver=20240503070619:1:18661
at window.PDFEMB_NS.pdfembGetPDF (pdfemb.min.js?ver=4.7.1&fver=20240503070619:1:17833)
at HTMLAnchorElement.
PDF Embed使い方
PDF Embed プラグインをインストールし有効化しておく
-
ブロックエディターで「Embed Pdf」 を使う
Adobe API が未認証であれば、API KEY の入力を求められる。
「Adobe official site」をクリックしfree API keyを取得する
ドメインが認証されれば2度目からはこのAPI KEYの操作は不要
Adobe PDF Embed API
Adobe developer consoleでアカウントを作成しておく
-
Adobe PDF Embed APIの画面が表示される
Get free credentialsをクリック
-
Credentials Name を記入
Aplication Domain を記入
Create Credentials をクリック
-
keyが表示されるのでコピー
投稿記事のAPI KEYにペースト
-
PDFファイルをアップロード
pdf埋め込み実例
-
表示サイズはブロックエジターで調整できる
-
モバイル表示
下へスクロールする
感想
サイト管理側からすれば、PDF表示はブラウザによって取り扱いが一様ではなく面倒なメディアといえる。 とくにiosのスマホで画像表示されなくダウンロードして表示する必要がある。
Adobe関連のサービスは、有料のものが多い(メーカーからすれば当然)が今回のAPIは無料。
PDF Embedのプラグインでの表示は、しっかりとAdobeのアイコン
が表示されるのでAdobeが責任を持ってくれるかもしれない。