ビッグバナー広告

facebookプラグイン LikeBoxを設置しよう

facebookプラグインLikeBox

※ この記事は古いFacebookプラグインの設置方法を解説しています。

facebookプラグインのLikeBox は2015年6月23日以降使えなくなります。まだLikeBoxをお使いの方は、23日までに新しいFacebookプラグイン PagePluginへ変更してくださいね。

詳しくはこちらの記事「Facebookプラグイン LikeBoxをPagePluginに変更する」を参考にしてください。

スポンサーリンク
PC用

以前のLikeBox設置についての本文です

先日、いわしはお仕事で、とあるネットショップの売り上げ改善コンサルティングを請け負いました。とりあえずGoogle analyticsを入れてアクセスを分析してみましたが、検索からの流入がほとんどありません。お店に指名で来てくれるほどのブランド力はないので、検索に引っかかるようにしないとアクセスを伸ばすのは難しいです。

やるべきことはたくさんありますが、まずはコンテンツをもっと増やす、ブログを更新する、facebookなどのソーシャルを使いこなす、この3点から始めてもらおうと思ってます。

さて、このサイトにはソーシャル関連のプラグインがfacebookしか設置されていないので、twitterとgoogle+のプラグインも追加することにしました。ソーシャル関連はアクセスを向上させるためには欠かせません。

これに限らず、いわしは新規でwebサイトを立ち上げる時は、お客さんが断らない限りfacebook、twitter、google+のプラグイン3点セットを必ずサイドバーに貼り付けます。

ソーシャルの意義は、本来であれば記事をマメに更新したり、コメントに返信したりといった運用をして、自分たちの情報をいろんな人に知ってもらったり、広めてもらうということにあるのですが、とりあえずプラグインを設置してHPやブログの更新情報を流すだけでも、それなりのSEO対策になります。

Googleは検索順位の参考として、ソーシャル関連も監視していると言われています。

一度設置すれば、更新情報を流すのは数分でできることですから、やらない手はありません。いわしはソーシャルへの投稿は基本的に手動でやってますが、全自動化することも可能です。プラグインの設置はそんなに難しくないので、ぜひチャレンジしてみてください。

というわけで、facebook、twitter、google+のプラグイン設置方法を順に解説していきます。まずはfacebookのプラグイン、「LikeBox」の設置から始めましょう。

facebookプラグイン「LikeBox」の設置

まずはfacebookプラグイン設置用コードを作成しましょう。プラグインの種類はたくさんありますが、一番よく見かけるのは「LikeBox」というソーシャルプラグインです。

※ 現在、LikeBoxのコードジェネレーターは使えなくなっています。

http://developers.facebook.com/docs/reference/plugins/like-box/

Like Box – Facebook開発者

ここにfacebookページのアドレス、縦横の幅などを入力して、「get code」を押せばLikeBoxプラグインのコードが出てくるので、このコードをホームページやブログにそのまま埋め込めば、LikeBoxが表示されます。

facebookプラグインlikebox設置

では、さっそく入力していきましょう。変更したLike Boxの数値やチェックの有無は、リアルタイムでプレビューされるので、LikeBoxの変更箇所をすぐに確認できます。

facebookプラグインLikeboxの設定

facebookプラグイン「LikeBox」の設定

● Facebook Page URL
自分のfacebookページURLをそのまま貼り付けてください。

● Width
サイドバーの横幅に合ったLikeBoxのサイズを入力してください。最低サイズは292pxとなっていますが、それより狭い幅を設定してもちゃんと表示されます。

● Height
縦幅の設定ですが、未入力でも大丈夫です。実際に埋め込んでみて、LikeBoxの表示が間延びするようなら、自分で適切な縦幅を設定してください。

● Color Scheme
「light」「dark」の2種類選べます。通常は「light」にしておけばよいかと。

● Show header
LikeBoxプラグインの一番上にある「facebookもチェック」という表示の有無です。チェックを外せば「facebookもチェック」はなくなります。

● Show Faces
LikeBoxプラグインの下部に「○○○人が自社facebookページについて「いいね!」と言っています。」というメッセージと共に、「いいね!」してくれた人の画像が表示されています。チェックを外すと、LikeBoxからメッセージと画像がなくなります。

● Show stream
LikeBoxプラグイン中段の新着投稿の表示です。チェックを外すとLikeBoxから新着投稿の表示はなくなります。

● Show Border
LikeBox外枠の表示・非表示です。

設定が済んだら、最後に「get code」を押せば、LikeBoxのコードが表示されます。

facebookプラグインLikeboxコード取得

LikeBoxの設置コードは4種類ありますが、「IFRAME」を選択すればOKです。

facebookプラグインLikeboxコード取得

取得したLikeBoxのコードを自分のブログやホームページのサイドバーに貼り付けてください。

ちなみに、いわしブログのLikeBoxウィジェットは、「Show stream」を非表示にしています。いわしは基本的にfacebookページには記事をシェアしているだけなので、LikeBoxで「Show stream」を表示する意味がないからです。新着記事はブログ本体に表示されてますしね。

LikeBoxを設置したついでにOGPを設定しておけば、facebookに記事をシェアしたときの見栄えが断然よくなります。こちらも記事を参考に、ぜひチャレンジしてみてください。

twitterウィジェットの設置はこちらで解説しています。

google+のプラグイン設置方法は、また後日解説します。

スポンサーリンク
PC用
PC用

フォローする

コメント

  1. facebookの「いいねボックス」を設置する « hikaroom より:

    […] facebookプラグイン LikeBoxを設置しよう https://iwashiblog.com/2013/09/facebook-plugin-likebox/ […]