LINE@の「友だち追加」、「いいね」ボタンをサイトなどに設置する方法は？

Answer

「友だち追加」ボタン、「いいね」ボタンの作成・設置方法と、友だち追加用のQRコードを表示する方法を、PC/スマホそれぞれ解説します。

LINEが提供しているソーシャルプラグイン

LINEは以下の3種類のソーシャルプラグインを提供しています。それぞれの違いを理解し、必要なプラグインを選んで設置するようにしましょう。

①友だち追加ボタン

②いいねボタン

③LINEで送るボタン

※以下の各画像はhttps://media.line.me/ja/より引用。

①友だち追加ボタン

これまで企業などのLINEアカウントを友だち追加するためには、IDを入力したり、QRコードを読み取ったり、検索したりする必要がありました。

この新しい「友だち追加」ボタンでは、ボタンを押すだけで友だちを追加できるようになります。さらに、Webサイトに友だち数やホームへの移動リンクを表示することもできます。

②いいねボタン

閲覧中のWebサイトやアプリの情報を、タイムラインに投稿するボタンです。手間をかけずに情報を拡散できるので、広告や集客に便利になります。

③LINEで送るボタン

Webサイトの情報をLINEに登録している友達やグループにシェアできるボタンです。

自分のホームに一度情報を送り、後で登録している友だちに一斉にタイムラインで知らせることもできます。

友だち追加ボタン」の設置方法（PC版）

手順１：下記のURLにアクセスします。

https://media.line.me/ja/how_to_install

手順2：3つの設置方法から、真ん中の「友だち追加ボタン」を選びます。

手順3：ボタンを設置したい公式アカウントやLINE@アカウントのIDを入力します。

手順4：次に友だちとシェアしたいときに表示されるボタンを3つのタイプから選びます。お好みのものを選んでください。ここでは一番左のボタンを選びます。

手順5：プレビュー画面で確認すると、ボタンのコードが表示されます。このコードを設置したいWebサイトやブログなどに追加すると「友だち追加ボタン」の設置は完了です。

「いいねボタン」の設置方法（PC版）

手順１：下記のURLにアクセスします。

https://media.line.me/ja/how_to_install

手順2：3つの設置方法から、右側の「いいねボタン」を選びます。

手順3：「いいねボタン」を設置したいWebサイトのURLを入力します。
ボタン作成時に入力したURLのドメインとWebサイトのドメインが一致していないと、ボタン機能が作動しないのでご注意ください。

手順4：友だちとシェアしたいときに表示されるボタンを2つのタイプから選びます。ここでは左のボタンを選びます。

手順5：公式アカウントやLINE@アカウントをお持ちの友だちの場合、追加オプションを利用できます。このオプションを選択すると、「友だち追加ボタン」が表示されます。

※すでに友だちの場合は、「友だち追加ボタン」ではなく、アカウントのホームに移動するボタンが表示されます。

手順6：シェアオプションを選択した状態でプレビュー画面を確認すると、ボタンのコードが表示されます。このコードを設置したいWebサイトの表示したい場所にコピー＆ペーストすると「友だち追加ボタン」の設置は完了します。

PC版の管理画面から友だち追加ボタンの設定および友だち追加用QRコード表示させる方法

手順１：下記のURLにアクセスします。

https://admin-official.line.me/

手順２：LINEで登録したメールアドレスとパスワードを入力し、「ログイン」をクリックします。

 

手順３：自身のアカウントを選択します。

 

 

 

手順４：「アカウント設定」をクリックします。

 

 

手順５：左メニュー「アカウント設定」-「基本設定」よりQRコード、友達追加ボタンのソースコードが表示されています。

該当ソースコードを任意のサイト内に埋め込んで完了です。

 

 

「友だち追加」ボタンの設置方法および「友だち追加」用のQRコードの表示方法（iOS版）

いいねボタン、LINEで送るボタンはPCからの作成となりますが、友だち追加ボタンはスマホからでも埋め込むコードを生成できます。以下でその手順を解説します。

手順１：LINE@アプリを起動し、下部メニューの「管理」を選択肢、「プロフィール」をタップします。

 

 

手順２：「友だちに教える」をタップします。

 

 

手順３：QRコードが表示されます。QRコードを画像として保存し、別サイトに埋め込みます。

また、「友だち追加ボタン」をタップすると、友だち追加ボタンのソースが表示されます。

 

 

手順４：以下、友だち追加ボタンのソースコードが発行されますので、追加したいサイトにソースコードを埋め込むことでボタンが追加されます。

 

 

 

注意点

 

■複数アカウントをお持ちの方は、ログインするアカウントに注意してください。

■ボタンを設置した時点でガイドラインに同意したとみなされます。普通に利用している限り違反することはありませんが、設置する際にはよく目を通してください。

参考：

http://timetoenjoy.info/archives/1041

http://how-to-line.jp/2015/02/18/4901