Social Media Lab
  • Tel 03-6868-5535
  • 資料請求
  • お問い合わせ

Q&A

SNSマーケティングに関する最新情報をご紹介します

2016.08.29

ウェブサイトにFacebookのいいねボタンを設置する方法は?

 

A:Facebookが提供するコードをコピーしてボタンを設置します。

Facebookいいねボタンの設置方法

コードの作成(見出し)

まず「いいね」ボタンのコードを作成します。facebook for developersのいいね!ボタン(ウェブ用)ページから無料で行えます。

また設置にはFacebookのアカウントが必要になるので、お持ちでない場合は事前にアカウント作成をしておきましょう。

image07

:「いいね!」するURL

「いいね」ボタンを設置したいサイトのURLを貼り付けます。

:Width

ボタン全体の幅が設定できます。(初期設定は450pxになっています。レイアウトをどれにするかによって変わってくるでしょう)

:レイアウト

「いいね」ボタンを全4種類から選べます。

standard

image08

box_count

image09

button_count

image05

button

image04

:アクションタイプ

「いいね」の表示方法を「おすすめ」に変更できます。

likeを選択

image13

recommendを選択

image12

:ボタンサイズ

ボタンサイズの変更ができます。(small,large)

友達の顔を表示する

「いいね」をしてくれた友達のプロフィール写真を表示できます。

設定方法

・レイアウトはstandardを選択。(それ以外は表示不可)

・「友達の顔を表示する」のチェックボックスにチェックを入れる。

image00

 

シェアボタンを追加

「いいね」と一緒に表示される「シェア」ボタンの表示の有り無しを選択できます。

・「いいね」と「シェア」ボタン

image10

・「いいね」ボタンのみ

image01

⑥:コードを取得
こちらをクリックすると、以下のような2つのコードが表示されます。

image03

手順1:上のコードをコピーし、bodyタグに貼り付けます。

image11

手順2:OGPも併せて設定します。「og:url」と「data-href」は自分のサイトのURLを登録します。

image02

手順3:あとは下のコードを「いいね」ボタンを表示させたい箇所にコピーして貼り付ければ完成です。簡単に設置できますので、ぜひ今後ご活用下さい。

関連Q&A

関連企業事例研究

関連記事

人口たった2%の検討層にどうアプローチ? 自動車業界のInstagram、Facebook活用最前線!【#IGAUTO イベントレポート】

2019年8月更新! 11のソーシャルメディア最新動向データまとめ

【保存版】SNS炎上を防ぐ4つの対策と、炎上発生時の3つの心構え

お役立ち資料ダウンロード
Gaiaxのソーシャルメディアマーケティング支援サービス