menu
menu

キーワード検索

 

前月(2月)の人気記事トップ10

  1. ( 1 - ) 【CSS】CSSだけでドロップダウンメニュー
  2. ( 2 - ) 【Mac】Macのユーザー名とアカウント名を変更する
  3. ( 3 - ) 【jQuery】jQueryでドロップダウンメニュー
  4. ( 6 ↑) 【PHP】PHPでシンプルなメールフォーム
  5. ( 5 - ) 【WiMAX】HUAWEI W04 気づくとWi-Fiの接続が切れてる
  6. ( 7 ↑) 【iPhone・iPad】iPhoneのメモリを簡単に解放する方法
  7. ( - ↑) 【jQuery】入門5. jQueryで日時を表示
  8. ( - ↑) 【MySQL】Windows 10にMySQLをインストール
  9. ( 9 - ) 【制作Tips】iPad画面解像度まとめ
  10. ( 3 ↓) 【jQuery】jQueryでドロップダウンメニュー
このエントリーをはてなブックマークに追加

【Facebook】Facebookいいねボタンの設置

【Facebook】Facebookいいねボタンの設置

こんにちは(・∀・)

今回はFacebookいいねボタンの書き方が少し変更になったので新しい書き方についてご紹介します。

Facebookいいねボタン

Facebook DevelopersのLike Button for the Webのページを開きます。

URL to Like

ボタンを設置するホームページのURLを入力します。

Width

横幅を指定します(空欄でもOK)。

Layout

standard、box_count、button_countまたはbuttonの中から選択。

Action Type

Likeがいいね、recommendがおすすめ。

Show Friends' Faces

standardを選択した場合ボタンの下にいいねした人のアイコンが表示されます。表示したくない場合はチェックを外します。

Include Share Button

シェアボタンを表示します。表示したくない場合はチェックを外します。

Get Codeをクリック

ポップアップ画面が表示されたらアプリIDをボタンを表示するサイトのIDに変更します。

言語を設定します。日本語ならそのままJapaneseでOK。

1. 1のコードを開始<body>タグの直後に貼り付けます。

すでに他のFacebook Pluginなどで1のコードを使用している場合、ここでは必要ありません。

2. 2のコードをボタンを表示させたい場所に貼り付けます。

以上でFacebookいいねボタンの設置は終了です。

data-hrefのURLは固定のURLになります。URLを動的に取得したい場合はdata-hrefのURLの書き方を変更します。

初期値はURL to Likeで入力したURL

data-href="https://www.webdlab.com/"
PHPでURLを取得

data-href="<?php echo $_SERVER["REQUEST_URI"]; ?>"
JavaScriptでURLを取得

<script>document.write('<div class="fb-like" data-href='+location.href+' data-layout="box_count" data-action="like" data-show-faces="false" data-share="false"></div>');</script>

+location.href+はシングルクォーテーションで囲ってください。


関連リンク

【Pocket】Pocketボタン
【Twitter】Twitterボタン
【B!】はてなブックマークボタン
【Google】Google+1ボタン

まとめて解説
【制作Tips】ソーシャルブックマークボタン

  • Facebook ソーシャルブックマーク
このエントリーをはてなブックマークに追加