Facebookいいねボタン設置

フェイスブック いいねボタンWikipediaによるとFacebook(フェイスブック)は現在、日本国内のユーザー数は約180万人で世界中に5億人を超えるユーザーを持つ世界最大のSNSだそうです。このユーザー数からも見てFacebookのいいねボタン(Like Button)の設置は是非設置しておきたいツールの一つだと思います。

いいねボタン(Like Button)-Facebook開発者に行きコードを取得する

まずはLike Button-Facebook開発者に行きコードを取得する必要があります。Like Button-Facebook開発者であなたのホームページアドレスを入力し、お好みのスタイルを選んでGet Codeを押しコードを取得します。

いいねボタンのコード取得

コードはiframeとXFBMLの2種類のコードが出てきますがここではiframeのコードを使って説明していきます。

いいねボタンプラグインコード

上記の画像のコードは当サイトのアドレスを入力した場合に出てきたコードです。通常のホームページではページごとにアドレスを入力しなおしてコードを取得します。

WordPressにいいねボタンを設置する場合は自動でアドレスが変わり簡単です

WordPressの場合はページごとに再度コードを取得必要はありませんhref=アドレスの部分をhref=<?php echo urlencode(get_permalink($post->ID)); ?>の様に書き換えると自動でそのページのアドレスが表示されます。下記のコードは当サイトのWordPressで使っているFacebookのいいねボタンLikeのコードです。ちなみにwidth:120px、height=21にして有ります。

<iframe src="http://www.facebook.com/plugins/like.php?href=
<?php echo urlencode(get_permalink($post->ID)); ?>&layout=button_count&amp;show_faces=true
&amp;width=120&amp;action=like&amp;colorscheme=light&amp;height=21" scrolling="no" frameborder="0" 
style="border:none; overflow:hidden; width:120px; height:21px;" allowTransparency="true"></iframe>
にほんブログ村 IT技術ブログ WordPressへ このエントリーをはてなブックマークに追加 Clip to Evernote

Facebookいいねボタン設置の関連記事

コメントを残す

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

*

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