Facebook流入倍増のために「Open Graph Pro」を設置【WordPressプラグイン】

OGPの設定でFacebookからのアクセスを増やそう

Facebookで記事が共有される時にその記事のタイトル・サムネイル・説明が表示されますが、これを設定していないとサムネイルはランダムに記事の中のものを選ばれたり、説明文がサイト自体の説明になってしまったりします。これにはOGP(Open Graph Protocol)の設定が必要です。

僕のブログの場合、設定前はこんな感じでサムネイルも説明も微妙でした。
Facebook_OGP設定前

*追記:「Open Graph Pro」だとページによって上手く表示されないことがあったので、結局「All in One SEO」の「Social meta」で設定しました。
All in ONE SEOのSocial MetaでOGPを設定する方法

プラグイン「Open Graph Pro」をインストール

もちろん自分でコードを書いていってもいいと思いますが、アップデートのたびに書くのが面倒なのでプラグインで設定しました。
まずプラグインの新規追加から「Open Graph Pro」をインストールして有効化します。
Facebook_OpenGraphPro

「Open Graph Pro」の設定

次に「Open Graph Pro」の設定をしていきます。
Admin User(s)では自分のFacebookアカウントのidが必要になります。
自分のFacebookのアカウントページを開くと、
https://www.facebook.com/〜
の形になっています。
この「www」の部分を「graph」に変えて、
https://graph.facebook.com/〜
とします。
このページに自分のidが表示されるのでコピーしてAdmin User(s)にペースト。

デバッガーで確認

ちゃんと反映せれているかFacebookのデバッガーで確認してみましょう。
Facebookデバッガー

Facebookデバッガー

はい。怒られてしまいました。
サムネイルサイズを少なくとも200✕200にしろと。

サムネイルサイズを「Regenerate Thumbnails」プラグインでリサイズ

メディア設定で200✕200に設定。
OGPサムネイル

もちろんこれだけではこれまでのサムネイルサイズは変わらないので「Regenerate Thumbnails」プラグインでリサイズします。「Regenerate Thumbnails」をインストール・有効化してからツールで「Regen, Thumbnails」を選択してリサイズしていきます。

あとはプログレスバーが100%になるまで待機。
サムネイルリサイズ

これでFacebookからの流入も増えるはず

以上でOGPの設定完了です。あとはFacebookからの流入増を願うばかりです。笑
近いうちにシェアボタンのデザインも変えようと思います。
ちなみにOGP設定後はこんな感じで表示されました。
Facebook_OGP設定後

LINEで送る
Pocket

    

あわせて読みたい

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です