2012年02月01日 Facebook
OGPに対応して設置するのが、少し、ややこしくて、とっつきにくいという方が多いようなので、OGPに対応した「いいねボタン」の設置の流れについて書きたいと思います。
流れさえ、把握出来れば、設置方法自体はそれほど複雑ではありません。

1.いいねボタンのコードを取得

以下のリンクから、いいねボタンのコードを取得し、設置します。
Like Button – Facebook開発者

2.OGPの設置コードの取得

いいねボタンのソースを取得するページを少し下にいけば、OGPのコードを取得するフォームが設置されています。 Like Button – Facebook開発者

3.OGPの設置コードの編集

OGPの設定には、サイト概要(description)を設置することが、可能なのですが、Facebook開発者のページで取得したコードには、概要の設定がありません。概要を設定しておくと、いいねボタンを押したユーザーのタイムラインに、サイトの概要も表示されるので、集客効果がアップするかもしれません。
OGPのコードの前後の適当な箇所に以下を追記してください。
<meta property="og:description" content="サイト概要(または表示中のページの概要)" />

4.設置したコードに問題がないかチェックする

すべての設置が完了したら、以下のツールで確認します。
エラーなどの表示がなく、設置したサイト情報が正常に表示されていれば、問題ありません。 参考サイト:http://design-spice.com/2011/08/09/social-button/

この投稿へのコメント

コメントはまだありません。

コメントを残す

メールアドレスが公開されることはありません。

次のHTML タグと属性が使えます。
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

CAPTCHA


ピックアップ記事

Facebookの「友達になる」ボタンを設置する

2012年02月01日 Facebook
Facebookアプリ内や外部サイトなどに、Facebookの友達になるボタンを設置する方法です。 設置するコード [php]<a href="http://www.facebook.com/dialog/friends/?id=USER_ID&app_id=YOUR_APP_ID&redirect_uri=REDIRECT_URL">友達になる&…
「Facebookの「友達になる」ボタンを設置する」をはてなブックマークに追加

Facebookアプリ開発 PHPでユーザー情報取得

2012年01月28日 Facebook
今回はFacebookのPHP SDKを使って、ユーザー情報を取得します。 PHP SDKを取得・設置 まず、githubからFacebookのPHP SDKをダウンロードします。 Facebook PHP SDK ダウンロードしたファイルを解凍すると以下のようなファイル構成になっていると思います。 /examples/ /tests/ /src/ changelog.mb read…
「Facebookアプリ開発 PHPでユーザー情報取得」をはてなブックマークに追加

Facebookで小学校、中学校の友人検索【もっと友達検索】

2012年02月03日 Facebook
もっと友達検索とは Facebookで小学校や中学校の同級生を探せるようになったらいいな、という発想から出来たアプリです。 まだまだ、β版ですが、多くの方に利用されていくといいですね。 もっと友達検索【小学校・中学校】on Facebook african mango…
「Facebookで小学校、中学校の友人検索【もっと友達検索】」をはてなブックマークに追加

FacebookアプリをFacebookページ(ファンページ)に追加する

2012年01月27日 web関連Facebook
[php]https://www.facebook.com/dialog/pagetab?app_id=YOUR_APP_ID&display=popup&next=YOUR_URL [/php] この「YOUR_APP_ID」はApp ID/API Keyに、「YOUR_URL」はアプリのURLに書き換えて、ブラウザからアクセスしてください。 アプリのApp ID/API K…
「FacebookアプリをFacebookページ(ファンページ)に追加する」をはてなブックマークに追加

Facebook アプリ開発 ユーザーのプロフィール写真を取得・表示

2012年01月29日 Facebook
前回の記事でユーザーID($uid)が取得できましたが、それを使って、以下のように設定するだけで、画像が表示されます。 [php]<img src="https://graph.facebook.com/<?php echo $uid; ?>/picture"> [/php] 現状、これがベストな(というか正しい)のか分かりませんが、動作は正常で、設…
「Facebook アプリ開発 ユーザーのプロフィール写真を取得・表示」をはてなブックマークに追加
© graffiti on the web . All rights reserved. WordPress Theme by comfy