- LINE公式アカウントの友だち追加ボタンはどうやって作るの？
- ホームページにLINE公式アカウントの友だち追加ボタンを設置したい
- LINE公式アカウントの管理画面の表示がスマホとパソコンと違ってわかりにくい
この記事では、LINE公式アカウントの友だち追加ボタンの作り方と、友だち追加ボタンをWebサイトやブログ、LP（ランディングページ）などに設置する方法を、スマホとパソコンにわけて初心者にわかりやすく解説します。
この記事を読むと、LINE公式アカウントの友だち追加ボタンをWebサイトやブログ上にコピー＆貼り付けするだけで設置できることがわかり、友だち追加の導線を作ることができますよ。
目次
LINE公式アカウントの友だち追加ボタンの作り方・設置方法
LINE公式アカウントの友だち追加ボタンの作り方と、Webサイトやブログなどに設置するおおまかな流れは以下のとおりです。
LINE公式アカウントの友だち追加ボタンをWebサイトに設置する手順
- 管理画面にログイン
- 「友だちを増やす」（または「友だち追加ガイド」）を選択
- 「ボタンを作成」を選択
- 友だち追加ボタンのHTMLをコピー
- URLを貼り付けたい場所に貼り付ける
友だち追加ボタンは、LINE公式アカウントの管理画面からHTMLソースコードを取得して、HTMLソースコードをWebサイトやブログなどに貼り付けると表示されます。
次に、LINE公式アカウントの友だち追加ボタンのHTMLの確認方法と、HTMLを貼り付ける手順をパソコンとスマホにわけて解説します。
LINE公式アカウントのQRコードと友だち追加URLが必要な方は、こちらをご参照ください。
LINE Lab
LINE公式アカウントのQRコード確認・印刷方法：スマホとパソコン別に解説 | LINE Lab
LINE公式アカウント（ラインオフィシャルアカウント）のQRコードの確認方法と印刷方法を、スマホとパソコンにわけて初心者にわかりやすく解説。LINE公式アカウントのQRコー…
LINE Lab
LINE公式アカウントの友だち追加URLの確認・貼り付け方法：スマホ・パソコン別に解説 | LINE Lab
LINE公式アカウント（ラインオフィシャルアカウント）の友だち追加URLリンクの確認方法と貼り付け方法を、スマホとパソコン初心者にわかりやすく解説。この記事を読むと、L…
スマホで友だち追加ボタンのHTMLソースコードを取得・貼り付ける方法
手順
LINE公式アカウントの管理画面にログインする
「LINEアプリで登録・ログイン」をクリックしてログインします。
手順
「友だちを増やす」をタップする
ログイン後、ホーム画面のメニュー項目の中から「友だちを増やす」をタップします。
手順
「コピー」をタップする
「コピー」をタップして、友だち追加ボタンのHTMLソースコードをコピーしてください。
手順
コピーしたHTMLソースコードをブログなどに設置する
コピーしたHTMLソースコードは、ブログやLPなど設置したい場所に貼り付けてください。
友だち追加ボタンを設置する方法について詳しく知りたい方は、こちらの記事をご参照ください。
LINE Lab
LINE公式アカウントの友だち追加ボタンをアメブロに設置する方法 | LINE Lab
LINE公式アカウント（ラインオフィシャルアカウント）の友だち追加ボタンをアメーバブログ（アメブロ・Ameba）に設置する方法を初心者にわかりやすく解説します。サイドバ…
パソコンで友だち追加ボタンのHTMLソースコードを取得・貼り付ける方法
手順
LINE公式アカウントの管理画面にログインする
「LINE公式アカウント」にある「管理画面にログイン」をクリックします。
手順
「LINEアカウントでログイン」を選択してログインする
手順
「友だち追加ガイド」をクリックする
ログイン後、ホーム画面の左側にあるメニュー項目の中から「友だち追加ガイド」をクリックします。
手順
「コピー」をタップする
「コピー」をタップして、友だち追加ボタンのHTMLソースコードをコピーします。
手順
コピーしたHTMLをブログなどに設置する
コピーしたHTMLソースコード、ブログやLPなど設置したい場所に貼り付けてください。
友だち追加ボタンの設置方法を詳しく知りたい方は、こちらの記事をご参照ください。
LINE Lab
LINE公式アカウントの友だち追加ボタンをアメブロに設置する方法 | LINE Lab
LINE公式アカウント（ラインオフィシャルアカウント）の友だち追加ボタンをアメーバブログ（アメブロ・Ameba）に設置する方法を初心者にわかりやすく解説します。サイドバ…
LINE Social Pluginsを使って友だち追加ボタンを設置する
「友だち追加」ボタンを設置する | LINE Developers より引用
LINEヤフー株式会社の「LINE Developers（LINEディベロッパーズ）」が提供する「LINE Social Plugins（LINEソーシャルプラグイン）」の利用ガイドラインに同意すると、上記のような友だち追加ボタンのHTMLソースコードを取得することができます。
詳細は、LINE Developers「友だち追加」ボタンを設置する」をお読みください。
あわせて読みたい
「友だち追加」ボタンを設置する
「友だち追加」ボタンを利用するには、LINE公式アカウントのIDが必要になります。ウェブサイトの訪問者がこのボタンをクリックすると、あなたのLINE公式アカウントがLINEの…
友だち追加ボタンの設置方法を詳しく知りたい方は、こちらの記事をご参照ください。
LINE Lab
LINE公式アカウントの友だち追加ボタンをアメブロに設置する方法 | LINE Lab
LINE公式アカウント（ラインオフィシャルアカウント）の友だち追加ボタンをアメーバブログ（アメブロ・Ameba）に設置する方法を初心者にわかりやすく解説します。サイドバ…
まとめ
この記事では、スマホとパソコンそれぞれの、LINE公式アカウントの友だち追加ボタンの作り方とWebサイトやブログ、LPなどに設置する方法を解説しました。
スマホで友だち追加ボタンのHTMLソースコードを取得・貼り付ける手順
- 管理画面にログイン
- 「友だちを増やす」を選択
- 「ボタンを作成」を選択
- 友だち追加ボタンのHTMLソースコードをコピー
- コピーしたHTMLソースコードをブログ等貼り付けたい場所に貼り付ける
パソコンで友だち追加ボタンのHTMLソースコードを取得貼り付ける手順
- 管理画面にログイン
- 「友だち追加ガイド」を選択
- 「ボタンを作成」を選択
- 友だち追加ボタンのHTMLソースコードをコピー
- コピーしたHTMLソースコードをブログ等貼り付けたい場所に貼り付ける
LINE Developers「友だち追加」ボタンを設置する（利用ガイドラインに同意が必要）
あわせて読みたい
「友だち追加」ボタンを設置する
「友だち追加」ボタンを利用するには、LINE公式アカウントのIDが必要になります。ウェブサイトの訪問者がこのボタンをクリックすると、あなたのLINE公式アカウントがLINEの…
関連記事
あわせて読みたい
LINE公式アカウントの友だち追加ボタンをWordPressに設置する方法
この記事で解決できる疑問 ホームページにLINE公式アカウントの友だち追加ボタンを設置したい 友だち追加ボタンをヘッダーやサイドバーに設置したい 友だち追加ボタンの…
あわせて読みたい
LINE公式アカウントの友だち追加ボタンをアメブロに設置する方法
この記事で解決できる疑問 アメブロの本文内にLINE公式アカウントの友だち追加ボタンを設置したい アメブロのサイドバーにLINE公式アカウントの友だち追加ボタンを設置…
あわせて読みたい
LINE公式アカウントのQRコード確認・印刷方法：スマホとパソコン別に解説
この記事で解決できる疑問 LINE公式アカウントのQRコードはどこに記載されているの？ LINE公式アカウントのQRコードはどうやって印刷するの？ LINE公式アカウントの管理…
あわせて読みたい
LINE公式アカウントの友だち追加URLの確認・貼り付け方法：スマホ・パソコン別に解説
この記事で解決できる疑問 LINE公式アカウントの友だち追加URLリンクはどこに記載されているの？ LINE公式アカウントの友だち追加URLリンクはどうやって貼り付けるの？ …
