Web Information

FacebookのLike Boxを設置して表示させるまでのやり方

FacebookのLike Boxの設置から表示させるまでのやり方をメモしておきます。とても簡単に設置できるのでFacebookページを持っている人はサクっと設置してみるといいかもですね。横幅やボーダーカラーなんかも指定できるので自分のサイトに合わせることができます。以下、やり方です。

[ads_center]

やり方

まずはLike Boxのページにアクセスします。

次に一番上にあるFacebook Page URLに自分のFacebookページのURLを入力します。

Facebook Like Boxを設置01

続いて横幅を設定します。自分のサイトに表示させる場所の幅に合わせます。

Facebook Like Boxを設置02

Color Schemeを選びます。lightとdarkがあるのでお好みで選択します。

Facebook Like Boxを設置03

その下にあるShow Faces にチェックを入れると「いいね」をしてくれた人の顔写真が表示されます。チェックを外すと非表示になります。

Border ColorではLike Boxの周りのボーダーカラーを指定することができます。こんな感じで。

Facebook Like Boxを設置04

Like Boxのヘッダーがいらないという人はHeaderのチェックを外すと非表示にすることができます。

Facebook Like Boxを設置05

最後に下にある「Get Code」をクリックするとコードを取得することができます。あとは自分のサイトの表示させたい場所にコピペすればOKです。ちなみにここではIFRAMEを選択しています。

Facebook Like Boxを設置06

以上、FacebookのLike Boxを設置して表示させるまでのやり方についてでした。

関連記事

  1. Web Information

    Gmailのサイドバーメニューに迷惑メールのラベルを表示させる方法

    ちょっと備忘録です。Gmailで例えば迷惑メールに入ってほしくないメー…

  2. Web Information

    上質なjQueryプラグインをカテゴリー別に探したい時に便利なサイト「jquer.in」

    とてもよさそうなサイトだったのでメモがてらご紹介します。jQueryの…

  3. MeasureIt

    Web Information

    Webページ上の要素の縦横サイズを計測できるChrome拡張機能「MeasureIt」

    MeasureItはWebページ上の特定の要素の縦横サイズを簡単に計測…

  4. Web Information

    Googleニュースで自分の好きなキーワードのRSSを取得する方法

    何かのキーワードを調べたい時に、Googleニュースでそのキーワードの…

  5. iPhone画面を横向きで固定

    Web Information

    iPhone画面を横向きに固定してロックさせる方法

    iPhoneを使っていると画面が縦になったり横になったりすることがあり…

  6. Adobe Creative Cloud Cleaner Tool

    Web Information

    AdobeのCreative Cloudでインストールトラブルが起きた時は「CS Cleaner T…

    AdobeのCreative Cloudでインストールトラブルが起きた…

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

最近の記事

  1. プラスシェル シティ04 フォールディングカメラケース
  2. enerpad AC-27KS
  3. KMS-160

アーカイブ

PAGE TOP