はじめに

Facebookには、ニュースフィード、グループ、Facebookページ、メッセージなど様々な特徴ある機能があります。その中でも際立ってFacebookらしい機能として「いいね!」ボタンがあります。

この記事では「いいね!」ボタンを自分のブログに設置する方法、活用法について説明します。

ボタンの設置によってブログの活用方法が広がるので、「難しくて私には設置できない…」なんて考えて躊躇していた人も、これを機に設置してみてはどうでしょうか?

Facebook「いいね!」とは

いざ設置!と行きたいところですが、まずは「いいね!」とはどういう機能か、確認する意味で基礎的な知識を簡単に説明しましょう。

「いいね!」ボタンは、ポジテイブな反応を伝えたり、気になるコンテンツとつながったりするための方法として用意された機能です。多く押すことで、あなたの人となりや興味が周囲の人にも伝わるなど、見た目のシンプルさに比して多くの効用があります。

Facebookにログインすると自分のニュースフィードや友だちのウオール、ノート、グループ、Facebookページ、イベントほかいたるところに「いいね!」ボタンが配置されています。これを活用せずしてFacebookは語れないと言っても過言では無いでしょう。

しかし、実は「いいね!」ボタンはFacebookの中だけではなく、Facebook外のBlogやWebコンテンツでも使うことが出来ます。次項では具体的な設置例とその使い方を紹介します。

Facebookの外にある「いいね!」を使ってみよう

どんなところに「いいね!」ボタンがあるか

Webで色々なコンテンツを見ていると、「いいね!」ボタンがあるのを見かけたことがあるかと思います。よく以下のような場所に設置されています。

  • Blog記事
  • ニュースWebサイト記事
  • 企業Webサイト
  • 有名人、製品などのプロモーションWebサイト
  • イベント特設Webサイト

最近とみにFacebookの活況がマスコミなどを通して紹介され、その中でも設置や利用が容易で直観的に使える「いいね!」ボタンの導入が進んでいます。

どういう使い方が出来るの?

基本的にFacebook内と同じです。ボタンをクリックすることで、Blog記事やニュースに対して「いいね!」を追加することが出来ます。

その結果、以下のような効果があります。

  • Facebook内の自分のウオールに、外のどういったコンテンツに「いいね!」したかが記入されます。友だちなど、あなたがウオールを公開している範囲で「いいね!」情報を伝えられます。
  • 「いいね!」をする際にコメント欄に入力することで、ちょっとした寸評付きでFacebook内にシェアすることが出来ます。
  • 「いいね!」数が表示されるので対象となるコンテンツの人気が分かります。
  • 友だちにあなたの趣味、嗜好や人となりが伝わります。同じように感じる人とより仲良くなる機会を得られるかもしれません。
  • 「いいね!」してもらったコンテンツオーナーのモチベーションが上がります。

盛りだくさんですね!こんな沢山の効果が、ほんのワンクリック「いいね!」ボタンをクリックするだけで得られるのです。クリックした自分には勿論、周りの人も幸せになる「いいね!」、使わない手はありません。

Facebook「いいね!」ボタンをブログに設置する方法

ここまでで「いいね!!」ボタンの概要、特にFacebook外での活用のされ方について具体例を交え紹介しました。Blogを設置されている方は、きっと「是非設置したい!一体どうすればいいの?」「前置き長すぎだよ!」と前のめりになっていることと思います。お待たせいたしました。

前置きが長くなりましたが、設置方法について以下に説明します。

簡単設置法

多くのBlogサービスやBlogシステムは「いいね!」を簡単に設置するオプションを用意しています。そういう仕組みが提供されているかどうかをまず確認、或いは運営者に問いあわせてみてください。もし提供されている場合は、迷うことなくこの方法を選択してください。"安全で確実なのでお勧め"です。以下例を挙げます。

手動で設置する方法

以下の手順通り行えば、Blogサービスなどで提供されていなくても設置出来ます。少し長いですが、頑張ってください。

「いいね!」ボタンの設置には、Javascriptのコードを使用します。お使いのBlog、またはBlogサービスでJavaScriptが利用可能である必要があります。
  • 1.Facebook開発者ページのソーシャルプラグイン「Like Buttonページ」をWebブラウザで開きます。「いいね!」は英語の「Like」を日本語にしたもので同じものです。(英語表記ですが、ステップバイステップで説明しますので心配ご無用です)
  • 2.ページ内の「Step 1 - Get Like Button Code」の下にあるフォームに必要事項を入力していきます。

  • 3.URL to Like欄には「いいね!」ボタンを配置する場所のURLを入力します。

  • 4.Send Buttonにチェックを入れると、「いいね!」ボタンと一緒にメッセージ送信のボタンを設置することができます。

  • 5.Layout Style欄はプルダウンリストから、設置する「いいね!」ボタンの種類を3つ(Standard/button_count/box_count)選択します。設置サイズや見た目が違うので状況や好みに応じ選択してください。(通常はStandardで良いです)

  • 6.Width欄は「いいね!」で使う領域の横幅指定です。ピクセル数を入力してください。(よく分からない場合は、既定の450のままで良いです)

  • 7.Show Facesは、「いいね!」をしてくれたのがあなたの友だちであるならば、友達の顔アイコンを表示させるオプションです。表示させるならチェックをオン、しないならオフにしてください。(オンにした場合、「いいね!」で使う領域の縦幅が長くなります)

  • 8.Verb to display欄は、ボタンに表示される文字の選択です。「Like」を選択すると「いいね!」になります。「Recommend」だと「推奨」となります。(ここでは英語表記ですが、設置すればちゃんと日本語になります。大丈夫です)

  • 9.Color Schemeは「いいね!」ボタンの色合いの濃淡選択です。lightは水色、darkは濃い青になります。

  • 10.Fontはプルダウンリストから使用するフォントを選択できます。ただ、これは英語のLikeの場合用で、日本語で使う場合は反映しないのであまり意味のない設定項目となります。

  • 11.お疲れ様です。「Get Code」ボタンを押しましょう。

  • 12.ここまで設定した内容に合った「いいね!ボタン貼り付け用コードが表示されます。コードをコピーして、URL to Like欄で指定した場所に張り付けてください。記事毎に張り付けたい場合は、「href=<%topentry_enc_link>」のように記事のURLを示すタグを指定してください。このタグはBlogサービスやシステムによって異なります。

最後に

手動でとなると少し難しいかもしれませんが、是非設置してみてください。記事前半でご紹介した通り、「いいね!」ボタンの設置者、「いいね!」をつける閲覧者、「いいね!」の情報を見て良い情報をシェアする友だち、三者三様にきっとより楽しいネットのつながりを実感できる筈です。

(Photo by 著者)