fb_like_btn / いいねボタン
facebookのいいねボタンは、仕様がよく変わるので、実装する度に調べ直している気がする。以下は、2013年3月21日時点の内容。
ボタンとcount数のデザインタイプ（Layout Style => button_count）を利用。デバッガーでエラーが出ないように、かつ、自分のフィードだけではなく友だちのタイムラインにもアクションを表示させる、かつ、ボタンを押した時にコメントレイヤーが出てそこから投稿する「シェア」扱い（ユーザーの操作が増える）ではなく、あくまで「いいね」扱いを維持する例。コードを少しずつ変えたボタンを20パターンほど設置して検証した結果。
１）app_idを取得（参考）。
２）ボタンを設置するページのhtmlタグ内にprefix属性を入れる。
<html prefix="og: http://ogp.me/ns#">３）公式ページでボタンのコードを生成。今は HTML5, XFBML, IFRAME のタイプがある。下記はIFRAMEの場合。ボタン設置箇所に以下のコードを記述（HTML5やXFBMLは記述するコードが他にもある）。
<iframe src="//www.facebook.com/plugins/like.php?href=(ボタンを設置するページのURL)&send=false&layout=button_count&width=450&show_faces=false&action=like&colorscheme=light&font&height=21&appId=(取得したapp_id)" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:300px; height:21px;" allowTransparency="true"></iframe>４）ogp meta を <head> 内に記述。fb:admins は複数人での管理の必要がなければ要らない。og:type はブログ記事などページ単位の場合は「article」にする（「blog」や「website」はサイトのトップ用の仕様で、記事ページで使用すると友だちのフィードに出ないケースがあった）。og:locale は必要無い。og:image は1辺が200px未満の画像だとデバッガーでエラーが出るが、ボタンアクションに影響は無い。
<meta property="og:title" content="(ボタンを設置するページのタイトル)">
<meta property="og:type" content="(ボタンを設置するページのタイプ)">
<meta property="og:description" content="(ボタンを設置するページのディスクリプション)">
<meta property="og:url" content="(ボタンを設置するページのURL)">
<meta property="og:image" content="(フィードに表示させたいサムネイル画像)">
<meta property="og:site_name" content="(サイトの名前)">
<meta property="fb:app_id" content="(取得したapp_id)">↓
このボタンのテキストが「いいね」でなく「Like」なのは、上記ボタン設置コードに「&locale=en_US」を追加したため。HTML5とXFBMLの場合は、body の開始タグ直後にも記述するコードが必要で、ボタンテキストを他言語にする場合はそのコードの ja_JP の部分を書き換える。XFBMLは、旧ie用にhtmlタグ内にxmlnsのコードが必要なので場合によって適用する。いずれも公式ページでボタン設置コード生成時に取得する。
sample(html5), sample(xfbml), sample(iframe)
| HTML5 | XFBML | IFRAME | |
| app_idの取得 | ○ | ○ | ○ |
| htmlタグ内のxmlnsコード | 不要 | ○ | 不要 |
| body開始タグ後のコード | ○ | ○ | 不要 |
| ボタン設置コード | ○ | ○ | ○ |