LINE友だち追加ボタンを作ってみよう【上級編】

とりあえずHPレベルアップ講座では、とりあえずHPの機能を組み合わせたり、CSS編集機能を使ってもっとホームページをうまく活用していく方法を紹介します。

今回はLINEの友だち追加ボタンをとりあえずHPに埋め込む方法をご紹介します。とりあえずHPでは、HTML編集ボタンを使い、LINEの友達追加ボタンをホームページに埋め込むことができます。

※LINEの友だち追加ボタンを埋め込むためには、LINEの公式アカウントが必要になります。LINEの公式アカウントは無料で作成することができます。

img_column-tips-3_000

LINE友だち追加ボタンの作り方

①LINE友達追加ボタン作成サービスへアクセスする

LINEの友だち追加ボタンの埋め込みコードを作成するために以下のサイトにアクセスします。

LINE友だち追加ボタン作成サービス

※LINEの公式アカウントをお持ちでない方はまずは公式アカウントを作成しましょう。

LINE公式アカウントの作成

②友だち追加ボタンの作成

①に公式アカウントのID(@◯◯)を入力し、②のボタンのタイプを選択してください。③に友だち追加ボタンのコードが作成されますので、すべてコピーをします。

img_column-tips-3_001
③とりあえずHPに埋め込む

とりあえずHPの管理画面に戻り、各ページの編集でLINEの友だち追加ボタンを追加したいページを選択してください。フリースペースに埋め込みたい場合はフリースペースの編集をクリックしてください。(HTML編集ボタンがある箇所であれば埋め込むことができます)

今回はお問合せページに埋め込みます。HTMLボタンをクリックし、友だち追加ボタンを埋め込みたい箇所に先程コピーしたコードを貼り付け、OKを押します。

img_column-tips-3_002
④ホームページで確認する

LINEの追加ボタンは、管理画面上では表示がされません。上記の内容で設定をクリックした後、ホームページ上でちゃんと表示がされているか確認してみてください。

img_column-tips-3_000

今回はLINEの友だち追加ボタンをとりあえずHPに埋め込みました。LINEではお客様が気軽にお問合せ出来るだけでなく、お客様に向けた情報発信などもできるため、メルマガのように使うこともできます。ホームページと合わせてお客様にダイレクトに発信していきたいという方はぜひ参考にしてみてください。

気軽につくれる、素敵なホームページ「とりあえずHP」

とりあえずHPは、素敵なホームページを気軽につくることができるホームページ作成サービスです。
「メールを送る」程度のパソコンスキルがあれば、驚くほど簡単にホームページを作成することができます。
業種ごとに作り込まれたテンプレートデザインや文章のサンプルもあるので、ホームページづくりにあまり時間が割けない人にもおすすめ。大切な時間をホームページ作成に費やすのではなく、本業に集中させることができます。

無料オンラインサポート実施中

\ホームページを作る前に知っておきたい/

ホームページの作り方 動画講座

動画URLを無料で入手

\ホームページ制作のプロに個別相談/

とりあえずHP無料個別レッスン

個別レッスンの詳細

簡単に自分で作れるホームページ作成ソフト「とりあえずHP」

簡単HP作成ソフト「とりあえずHP」

無料お試しはこちら