WordPress:アップロードしたPDFのサムネイル画像を生成する方法
WordPressにPDFをアップロードした際に、PDFの画像も生成する方法をご案内します。さらにACFを利用してPDFのサムネイルをクリックするとダウンロードされるようにしてみます。
アップロードしたPDFのサムネイル画像が生成されない場合はサーバーのソフトウェア、プラグインを利用してPDFのサムネイル画像を自動的に生成することができます。
PDFのサムネイル生成に必要なサーバー環境
PDFのサムネイルを生成するにはいくつかの条件があります。
サーバーにImageMagickがインストールされているか?
サーバーの画像処理ライブラリとしてImageMagickまたはGDが利用されます。
エックスサーバーなど一般的なサーバーではどちらかのソフトウェアがイントールされています。VPSサーバーの場合はImageMagickとImagickをインストールします。
サーバーにImageMagickやGDがインストールされているかをphpinfoで確認してみます。
下記を記述した「phpinfo.php」をサーバーにアップして、アクセスします。
phpinfo.php
<?php
phpinfo();
?>
phpinfoにImageMagickの記述があればインストールされています。
ついでにGDについても確認してみましょう。「enabled(有効)」となっていればGDを利用できます。
サーバーにGhostscriptがインストールされているか?
Ghostscriptが必要になるサーバーもあります。
ImageMagickをインストールしているのにサムネイルが生成されない場合は、Ghostscriptのインストールをお試しください。
pleskの場合、下記のコマンドでインストールできます。
sudo dnf install ghostscript
下記のコマンドでインストールされたかを確認して、バージョンなどが表示されればインストールされています。
gs -v
サーバーによってはさらにGhostscriptのインストールも必要になります。
サーバー環境だけでアップロードされたPDFのサムネイルが生成され無い場合は、次のプラグインをお試しください。
PDFのサムネイル生成のプラグイン
サーバー環境に加えて、プラグインを導入することで生成される場合もあります。まずは下記のプラグインから順番にお試しください。
PDF Thumbnail Generator
PDFのサムネイル生成をアシストしてくれるプラグインです。
生成されるサムネイル画像の種類(jpg、png)や、サイズなどを指定できます。
便利なフックも複数用意されており、指定したページのサムネイル生成や、透かしを追加することなどもできます。
PDFをアップロードして、下図のようにサムネイルが生成されれば成功しています。
ACFでPDFの画像をクリックするとPDFがダウンロードする方法
ACF(Advanced Custom Fields)のファイルアップロードのカスタムフィールドを利用してサムネイルをクリックするとPDFがダウンロードできるようにしてみます。
前提としてカスタムフィールド名は「cf_download_pdf」
返り値は「ファイルのURL」にします。
サムネイルを表示させるコードは下記になります。
<?php
$file_url = get_field('cf_download_pdf');
if ($file_url) {
$attachment_id = attachment_url_to_postid(esc_url($file_url));
$thumb_url = wp_get_attachment_image($attachment_id, 'thumbnail');
echo $thumb_url;
}
?>
PDFファイルをダウンロードさせるコードは下記になります。
変数$file_urlを利用しています。
<?php echo esc_url($file_url); ?>
2つのコードを組み合わせたコードが下記になり、サムネイルをクリックするとPDFがダウンロードされます。
<a href="<?php echo esc_url($file_url); ?>" download="">
<?php
$file_url = get_field('cf_download_pdft');
if ($file_url) {
$attachment_id = attachment_url_to_postid(esc_url($file_url));
$thumb_url = wp_get_attachment_image($attachment_id, 'thumbnail');
echo $thumb_url;
}
?>
</a>
HTMLタグ「download=""」は、PDFを表示させずに、PDFをダウンロードさせるタグになります。今回は空にしていますがファイル名などを記載しても良いでしょう。