【WordPress】facebookでシェアの時サムネイル画像が表示しない原因と対策

【WordPress】facebookでシェアの時サムネイル画像が表示しない原因と対策

最近、WordPress(ワードプレス)で書いた記事をfacebook(フェイスブック)にシェアするときに、再びサムネイル(アイキャッチ画像)が表示されなくなってしまいました。

対策はしてあったのですが、おそらくfacebook側の仕様が変わったのだと思います。

それは、「エラー」ではなく「仕様」だというのがfacebookのヘルプにありました↓↓↓

【WordPress】facebookでシェアの時サムネイル画像が表示しない原因と対策

参考:https://developers.facebook.com/docs/sharing/best-practices/#precaching

コンテンツが初めてシェアされる際、Facebookクローラーがシェア対象のURLからメ タデータをスクレイピングし、キャッシュします。クローラーは、画像を少なくとも1回確認してからでなければ、レンダリングできません。つまり、コンテン ツを最初にシェアする人は、表示される画像を確認できません。

要は、「2回目から表示です」と言うことなので、ページの更新を一度してみてからシェアするとサムネイルはちゃんと表示できました。

対策として、facebookデバッガーとサイズタグを使う方法の2つがあります↓↓↓

1.シェアデバッガーを使用して画像をプリキャッシュする

URLデバッガーでURLを実行し、ページのメタデータを事前に取得します。この操作は、一部のコンテンツの画像を更新した場合も行ってください。

2.og:image:widthおよびog:image:height Open Graphタグを使用する

これらのタグを使用して、クローラーに対して画像サイズを指定します。これにより、クローラーは非同期的にダウンロードして処理することなく、すぐに画像をレンダリングします。

・・・が、デバッガーを毎回やるのは対策前と同じなので、サイズタグを使用した対策を行います。

All in One SEO」プラグインの「ソーシャルメディア」から、「画像の設定」の「デフォルトの画像幅」と「デフォルトの画像高さ」をよく使うサムネイルのサイズにします↓↓↓

【WordPress】facebookでシェアの時サムネイル画像が表示しない原因と対策

ここは任意で変更して下さい。

これで「og:image:width」「og:image:height」の設定ができるのですが、これでも表示が上手くいきません。

WP Facebook Open Graph protocol」というプラグインもあるのですが↓↓↓

【WordPress】facebookでシェアの時サムネイル画像が表示しない原因と対策

参考:https://wordpress.org/plugins/wp-facebook-open-graph-protocol/

これでも上手くいかないので、プラグインの更新を待つか他の対策を考える必要があります。

今のところ最善の方法としては、「一度シェアボックスを表示させる(ページを更新する)」のようです。

参考までに。

Byさちお

この後に読まれている記事は?

【WordPress】altに自動で記事タイトルを上書き表示するプラグイン... 画像のaltタグ(代替テキスト)が空のときに自動で『記事タイトル』を表示してくれるプラグイン『Media Library Alt Fields』を紹介しましたが、altタグ(代替テキスト)に既にファイル名などが入ってしまっている場合も「上書きしたい」という場合は、『SEO Optimized Ima...
知らないと危険!アイコン作成・使用で著作権違反になるものとは... アメブロや、facebook、LINE、ツイッターなどのプロフィールアイコンに、他人の著作物(写真画像、イラストなど)を使用している方がいますが、芸能人や他人の写真はもちろん、アニメや漫画のキャラクター画像にも著作権があり、それを無断で使用すると著作権違反になってしまいます。 参考:知らないと危険...
【wordpress】放置しているアメブロは引っ越しした方が良い理由と方法... ブログを書くのを辞めたり、他のブログサービスやWoroPressを使い始めたりで、過去に書いた記事をアメブロ等に放置している人は、過去記事を丸ごとWordPressに移動した方が良いかもしれません。 今まで頑張って書いた記事は『思い出』であり『財産』です。 ブログを長く放置していると、不...
【WordPress】altが空の時に自動で記事タイトルを入れるプラグイン... SEO対策の一つとして、画像(メディア)のaltタグ(代替テキスト)に適切なテキストを入れるという方法があります。 既に投稿してしまった記事の画像のaltタグ(代替テキスト)が空の場合「alt=""」と表記され、SEO的には『意味の無い画像』として判断されてしまいます。 既に投稿している...
【WordPress】メディア追加時にaltタグにタイトルを追加してくれるプラグイン... SEO対策において、画像のaltタグ(代替テキスト)の記入は重要になってくるのですが、WordPress(ワードプレス)で記事を書くとき、メディア(画像)の追加時にaltタグに自動で画像タイトルを入れてくれるプラグインが『Update Image Tag Alt Attribute』です↓↓↓ ...