jetpackのパブリサイズ共有でFacebookやGoogle+にアイキャッチ画像を設定する方法

このブログはWordPressで運営しているのですが、その中でプラグイン「Jetpack by WordPress.com」を使用しています。

このプラグインは、アクセス解析やらコンタクトフォームやらサイトを運営する上で便利な機能がお得なパッケージで入ってるよってやつです。
特に人気な機能として、ブログの記事を公開した際にTwitterやFacebookなどの各種SNSに連携して通知する「パブリサイズ共有」という機能があります。
新しい記事を公開したら、自動でTwitterに記事のツイートを行ってくれるヤツですね。

Jetpackのパブリサイズ共有機能で1つの投稿をSNSに拡散する
このblogは投稿したときにFacebook,Twitter,Google+にシェアされるように設定してあります。色々な方法があると思うのですが私はJetpackの「パブリサイズ共有機能」を使っています。1つのblogを投稿すると同時に複数
usortblog.com

ただ、なかなかどうして上手く行かないこともしばしばあります。

  1. 問題
  2. 解決方法
  3. その他参考にした記事
  4. まとめ

問題

新しい記事を公開した時に、Twitterだと設定したアイキャッチ画像が正しく添付されて通知をしてくれます。

ところが、Facebookを見てみると、、、

こんな感じで、設定したものとは違う画像が表示されてしまいます。

ヒドイときには前の記事の画像が表示されるなんてこともありました…

今回はこいつを解決してみたいと思います。

解決方法

以下の記事を参考にさせていただきました。

【WordPress】アイキャッチ画像をFacebookのOGPに指定する方法 ｜ しらさかブログ
shirasaka.tv

上記サイトでは、アイキャッチ画像がある場合とない場合で動作が分かれていましたが、管理人のブログでは記事を公開する時には常にアイキャッチ画像をつけるようにしているので以下のように書き換えました。

<?php
if(is_single() && has_post_thumbnail()) {
//アイキャッチある場合
$thumbnail_id = get_post_thumbnail_id($post->ID);
$image = wp_get_attachment_image_src($thumbnail_id, 'full');
echo '<meta property="og:image" content="'. $image[0].'" />';
}
?>

このコードをheader.php内の、headタグ内に記述をしてみてください。

他の変更点としては、表示される画像のサイズをサムネイルサイズから赤文字の「full」に変更しています。

これにより、画像が大きく表示されてより目立つようになります。

上記のような違いがあります。

その他参考にした記事

その他にも以下の記事を参考にして色々と試してみました。

まず最初の記事はコチラ

jetpackのFacebook連携でサムネイルが表示されないエラーの原因と解決方法
日頃、このBlogを更新する際には「jetpack」と言うWordPressのプラグインを入れて、Twitte…
zoc.moo.jp

プラグイン「All in One SEO Pack」を使って設定してもなぜかアイキャッチ画像は変わらず…ダメでした。

次はコレ

WordPressの多機能プラグイン「Jetpack」のOGP出力を無効にする方法
WordPressの多機能プラグイン「Jetpack」。大変便利なのですが、自動でOGPが出力されちゃいます。functions.phpでそれを無効にする方法です。
mbdb.jp

OGP出力が二重に出力されているのではないかと疑ったのですが、functions.phpに記述をしてみても効果なしでした。

まとめ

このように、jetpackのパブリサイズ共有で不具合が起こる時には様々な要因がありそうです。

もし不具合が起きたら、色々と試してみてください。

ホーム
トップ