wordpressの技術情報をメモしたサイトです。

facebookへの自動投稿の画像設定とOGP設定

まず、OGPとはOpen Graph protocolの略で、facebook・mixi・google+などのソーシャルメディアにサイト（ブログやホームページ）の投稿記事の内容を正確に表示させるもの ブログの自動投稿やブログ記事をシェアしたりするとリンクやタイトル、写真を付けて内容の抜粋を表示するあれです。

この情報をブログやホームページから投稿した場合正しく表示されないで画像やタイトル、内容がおかしい場合ってないでしょうか！！ それを正しく表示させる事ができるのがOGPです。 OGPを設定すると正確な情報や画像を表示されるだけではなくfacebookでは、ブログやホームページからいいね！をした場合にニュースフィールドに記事を表示するようになります。さらに、その記事をいいね！するとそのいいね！した人の友達にも記事を表示します。 こちらの方のサイトを参照して下さい。http://www.lastday.jp/2012/04/19/ogp-is-important そのことにより、より多くの人に記事を見てもらえる事が可能になります。 ということで、 <head></head>間に以下の内容を記載する事で正確な情報を表示させます。

<meta content="記事のタイトル" /><meta content="article" /><meta content="記事の説明" /><meta content="記事のURL" /><meta content="画像のURL" /><meta content="サイトのタイトル" /><meta content="言語" /><meta content="facebookのアプリID" />

wordpressでは、プラグインに「Open Graph Pro」というプラグインがあります。 それを使って設定をすれば自動で<head>内に表示してくれます。 まず、facebook　Developers appより新規設定してAppIDを取得します。

wordpressにプラグインを設定し有効すると右メニューの設定からOpen Graph Proを選択します。

Admin User IDはこちらを参考に！！http://ten-fingers-and-a-brain.com/wordpress-plugins/ogp/facebook-id/ Open Graph Proプラグインを設定し変更を保存でOGPの設定が終了します。 次に、画像を３倍大きくする設定をします。 通常、wordpressではディフォルトではサムネールが１５０px×１５０pxになっています。 wordpress管理画面の設定からメディアをクリック、サムネイルのサイズの大きさを２００px×２００pxに変更します。

詳しくはこちらの方のサイトを参考にしてください。http://gaiax-socialmedialab.jp/facebook/172 以上で設定終了ですが、wordoressの自動投稿プラグインでwordbookerを使っている場合facebookのデバッガーを行ったときにURLの重複や画像の表示などのエラーが発生してしまいます。 wordbookerはディフォルトでOGPを設定していますので重複してしまいます。また、wordbookerのOGPは何かとエラーが出やすいのでwordbooker側でOGPを使わない設定にしてしまいましょう。

図のように上級者向け設定の「オープングラフタグのインラインプロダクションの利用不可」の項目にチェックを入れることによりOGPをOFFにできます。 サイトを表示してプログラムのソースを確認してください。

　　　　　　　　　　 　

Copyright © 2024 wordpress覚え書きサイト. All rights reserved.