1. ホーム
  2. コラム
  3. 「LINEで送る」でPV向上! Web制作者必見、「LINEで送る」シェアボタンを徹底解説 <入門編~設置方法~>

「LINEで送る」でPV向上! Web制作者必見、「LINEで送る」シェアボタンを徹底解説 <入門編~設置方法~>

スマートフォンの普及に伴い、多くの生活者がLINEを利用しています。LINE社の発表によると、日本国内でも5,800万人以上(登録者数)が利用。いいかえれば、国内の人口40%をカバーしている計算です。
Webマーケティングを積極的に行っている企業は公式アカウント運用やスタンプの配信など、さまざまな取り組みを行っています。
しかし!LINEのビジネス活用はこれだけではありません。
今回はWebサイトでできるLINEのビジネス活用、「LINEで送る」ボタンについて解説します。

「LINEで送る」ボタンとは

LINEで送るボタンとは、Webページの記事をトークや、自身のタイムラインにシェアできるボタンです。例えるなら、Webページによく設置されている「Facebookのいいね!ボタン」・「Twitterのツイートボタン」のLINE版です。

活用イメージは以下となります。

スマートフォンのLINEボタン表示例

ボタンを押すと、設置したページのタイトルとURLを友だちに送ることができます。

友達にタイトルとURLを送信する画面

“友だちが教えてくれる情報だから“意味がある!

 

LINEの話しから少しそれますが、重要な調査結果を紹介します。

平成13年度時点では流通情報量と個人が消費できる情報量はさほど変わりませんでした
しかし、平成21年度までの8年間で情報流通量は約200倍に増え、個人が消費できないほどに膨れ上がっているといえます。

DVDで例えるなら個人が一日に消費できる情報量は約1.1万枚、流通情報量は約2.9億枚に相当します。
なんと、世の中に流通している情報の0.004%しか消費されていません。つまり、流通されている情報の大半が消費されていないのです。

では、実際に消費される情報はどのような情報なのでしょう? その1つが「友だちが教えてくれた情報」といえるでしょう。友だちからLINEメッセージで、「こんな記事があったよ」「このページ面白いよ」と紹介された記事を読んだ経験があるのでは?
特に、直接メッセージをやりとりする機会の多いLINEであればより強い興味喚起につながることでしょう。

出典:データフラッシュ|毎日新聞社広告局(http://macs.mainichi.co.jp/space/web/034/data.html

コード1つでラクラク設置!

設置はいたって簡単。基本はスマホ用ページに下記のコードを入れる、ただそれだけです。


<span>
<script type="text/javascript" src="//media.line.me/js/line-button.js?v=20140411" ></script>
<script type="text/javascript">
new media_line_me.LineButton({"pc":false,"lang":"ja","type":"a"});
</script>
</span>

コードを入れるとスマホでページを閲覧したユーザーに「LINEで送る」ボタンが表示されます。

スマートフォンのLINEボタン表示例

ただし、このままではPC環境で観た場合、表示されません。PCで確認したい時は

new media_line_me.LineButton({“pc”:false,”lang”:”ja”,”type”:”a”});

new media_line_me.LineButton({“pc”:true,”lang”:”ja”,”type”:”a”});

該当箇所を「false」から「true」に書き換えましょう。

ボタンのデザインを変えたければ・・・

LINEで送るボタンは、用意されている5種類のボタンの中から任意に選ぶことができます。
種類は以下のとおり。

これを、上記コードの

new media_line_me.LineButton({“pc”:false,”lang”:”ja”,”type”:“a”});

この部分をボタンに対応した英字に入れ替えるだけで、カンタンにボタンの種類を変更することが出来ます。
たとえば、一番右のアイコンにしたい場合


<span>
	<script type="text/javascript" src="//media.line.me/js/line-button.js?v=20140411" ></script>
	<script type="text/javascript">
	new media_line_me.LineButton({"pc":false,"lang":"ja","type":"e"});
	</script>
</span>

とすればOKです。

送る時の「ページタイトル」を変更したければ・・・

スマートフォンベースのLINEでシェアしてもらうなら、より明瞭簡潔な「ページタイトル」を指定したい。

例えば、今回の記事を分かりやすく「実践!カンタンLINEボタン設置」というタイトルで送ってもらうといった具合です。

コードの該当箇所に変更後のタイトルを入力します。


<span>
<script type="text/javascript" src="//media.line.me/js/line-button.js?v=20140411" ></script>
<script type="text/javascript">
new media_line_me.LineButton({"pc":false,"lang":"ja","type":"a","text":"実践!カンタンLINEボタン設置","withUrl":true});
</script>
</span>

送付時の「ページタイトル」が指定したワードに切り替わります。

LINEで送る時には分かりやすいタイトル、紐付くキーワードを入れておきたい場合はこのカスタマイズがオススメです。

自社ページに是非設置を

「LINEで送る」ボタンを徹底解説、入門編いかがでしたか? Webページにコードを設置するだけで、PV向上が期待できるでしょう。特にスマートフォンからの閲覧が多いWebサイトを担当している方は、是非導入を検討してみてくださいね。

次回は<応用編~効果的なOGP設定とは~>をお送りします!

————————————————

【著者紹介】

遠藤大知(えんどうだいち)
2014年4月株式会社メンバーズ入社。部署「第1ビジネスユニットアカウントサービス第9ユニット」に所属。ソーシャルマーケティング・広告を中心に日々勉強中。

カテゴリ: LINE
2015年07月24日

RSS