WordPressでGoogleフォト画像をアイキャッチに表示させる方法

こんにちは、ぱのん(@panonbox)です。

画像をブログに表示するのに便利なGoogleフォトですがWordPressの仕組みでGoogleフォトの画像をそのままアイキャッチ画像に指定する事が出来ませんがプラグインを導入することでそれが可能になります。

今回はその方法を解説いたします。

Googleフォトの画像をブログに表示する方法を知らない方は下記の記事も参考にしてください。

Googleフォトの画像をブログに貼り付け埋め込む簡単な方法

ブログやサイトに載せる画像をGoogleフォトに保存したい、Googleフォトに保存した画像をそのままブログに載せたいと思っている方に・・Googleフォトの画像をブログに埋め込む簡単な方法をご紹介いたします

panonbox.com

2020.08.27

外部画像のURLをアイキャッチ画像につかえない理由

WordPressのシステム上の問題でデーターベースにアイキャッチの情報が記録されるため外部の画層URLが設定出来ないようです。そもそもアイキャッチの設定画面では、ファイルをアップロードするかメディアライブラリの中から選択するかの2通りしかありません。

ですが、下記でご紹介するプラグインを導入することにより外部画像のURLを指定することが可能となります。

ぱのん

通常の画像と同じようにURLで指定出来たら良いのだけど・・・
それが出来ないのでプラグインを使ってアイキャッチ画像に指定します。

外部画像をアイキャッチ画像に挿入するプラグイン２つ

外部画像のURLアドレスを使ってアイキャッチ画像として表示させるためのプラグインをご紹介します。いくつかのプラグインがありましたが、すでに更新が止まっている物などは省いて私が使ってみて使いやすかったもの2種類のプラグインを解説致します。

External URL Featured Image

使い方はとても簡単です。プラグインをインストールして有効化をすれば良いだけです。
あとは通常の記事を作成する画面に『External URL Featured Image』の項目が追加されていますので、アイキャッチに指定した外部画像のURLを貼り付けて『Preview』ボタンをクリックすれば挿入されます。

Featured Image from URL

使い方は簡単ですが『External URL Featured Image』と比べると表示させる考え方が違います。プラグインインストール後に有効化を行い、その後セッティング画面を開きます。

『Auto Set First Image』タブを開いて『use the first image as featured image』と『hide the first image from content』をONにします。

この設定で通常記事を書き一番最初にアイキャッチとして表示させたい画像を挿入すればそれがアイキャッチとして表示されるようになります。

内容を見ればなんとなくどのように処理されているか検討がつくかと思いますが、最初の画像をアイキャッチ画像として使用してその画像イメージをスタイルシート設定で表示しないようにしています。

use the first image as featured image
最初の画像をアイキャッチ画像として使用
hide the first image from content
最初のイメージを隠す（アイキャッチとして表示するので、記事画像としては表示しない）
overwrite the existing external featured image
すでにあるアイキャッチ画像を上書きする

テーマによっては表示に問題が発生することも

使っているテーマによっては正しく表示されない場合もあります。私の環境ではアイキャッチ画像としてはきちんと表示されているのですが、普通はサムネイルされてから表示する箇所では、形の生成が行われない為に元の画像の形がそのまま表示されます。

ですので『ブログカード』や『インデックス』などサムネイル画像が表示するところでサイズが不揃いになりデザインが崩れてしまいます。

このような場合はテーマを変えてみるとか『スタイルシート』の設定で画像をトリミングするような設定をしてあげないと正しく表示させることが出来ません。

まとめ

プラグインを使うことによってGoogleフォトの画像をアイキャッチ画像にすることは可能ですが、使用するテーマによっては正しく表示されない場合があります。その場合スタイルシート等で調整することが必要となってきます。