プロフィール

mshp0723(旧Mikaん星人アワー)

Author:mshp0723(旧Mikaん星人アワー)
ごらんいただきありがとうございます。マルチクリエイタ・クリエイティブ起業家のmikaん星人アワーです。webコンテンツ関連お仕事をしています。

■お仕事関連サイト■
仙台スマホ対応ワードプレスサイト制作・アトリエSS


webサイト制作・運用関連事例
・食品店さま ネットショップ制作
・音楽スクールさま webサイト制作
・楽器奏者さま 再生プラグイン埋め込みサイト制作
・エクステリア施工企業さま webサイト企画
・飲食店さま webサイト制作
・支援団体さま サイト制作
・一般企業さま 会社案内サイト企画
・支援団体さま fc2ブログカスタマイズ
・その他 メディア/アフィリエイト運用ブログカスタマイズ



よろしくお願いいたします。

最近の記事

カテゴリー

新たな流入経路になるかっ?コミュニケーションアプリlineの『LINEで送る』ボタンを、ぶろぐのスマートフォン・レイアウトに実装!と、その方法。

おばんです。

ホントはタイムリーだったんで、サロンデュショコラねたにする予定でしたが、時間取れなくて行けず的な★⌒(●ゝω・)b

mikaん星人アワーです。というわけで、今回はいつものitか音楽ねたで、itのほうです。


昨今のインターネットサービス界隈の話題では、facebookには既に衰退・打ち止め感があるのに対し(ユーザーは減少に転じてきましたね。このニュースも見てみましょう)、コミュニケーションアプリline界隈が盛り上がっていますね。

そこで、(つけたばっかりでまだどんだけ効果が出るかは不明ですが)ぶろぐのスマートフォン向けレイアウトに、『LINEで送るボタン』を実装してみました。


やってみた理由
■若い層で、かつスマートフォンユーザー内では、かなりのスピードでユーザーが増えている

■それゆえ、電話・メールと並ぶコミュニケーションインフラになっていて、話題にしてもらえると、拡散効果や流入経路としての働きが期待される

■しかもつけ方はコード貼り付けだけと、いたってシンプル



LINEで送るボタンのつけ方はどうやるの?


まずはLINEの『メディア運営者の方へ』というページを見ます。
http://media.line.naver.jp/ja/


上記のページ内に、『LINEで送るボタン設置方法
http://media.line.naver.jp/howto/ja/
というページがあるので、

『ボタンのタイプを選択』『送るテキストを選択』して、貼り付けコードを発行。任意の場所に貼り付ければokです。




<script type="text/javascript"
src="http://media.line.naver.jp/js/line-button.js" >
</script>
<script type="text/javascript">
new jp.naver.line.media.LineButton
({"pc":false,"lang":"ja","type":"a"});
</script>



こーいうタグが出てきます。基本的にはスマートフォン用にできてるようですね。
PCでプレビュー時には表示されず、クロームでIPHONEにユーザーエージェント偽造変更したところ、きちんと表示されたため

アプリやpcサイトにも実装可能ですが、長くなるので割愛いたします。



おまけ・fc2ぶろぐのスマートフォンレイアウトで、『記事の最後部分』にだけ、lineボタン設置方法だよ

なぜfc2ぶろぐかというと、『スマートフォンレイアウトも自由にいじれる』からというのもありますが、管理人がたまたま運用していたからです(笑)。


やり方は2種類あります。

1つは、『毎回記事の最後にコピペして貼り付ける』。
ただちょっとめんどくさいので、『一回貼ったら全部の記事に適応』となるように、レイアウトに組み込んでしまうのが2個目です。



これが普通のスマートフォン・レイアウト。
201302031.jpg
テンプレートは『new_basic_red』をベースに。なぜならサムネがついてくるからね♪
ここには表示させず(させてもいいんだけど♪)、記事読み終わったあとにlineで送れるよう、記事ラスト付近に組み込みます。



追記を使っていたので『div class="entry_more"』内で、追記記事を表示するテンプレート変数<%topentry_more>の後ろにタグをはっつけました。

<!--more-->
<div class="entry_more" id="more<%topentry_no>">
<%topentry_more>

<!--lineボタン-->
<script type="text/javascript"
src="http://media.line.naver.jp/js/line-button.js" >
</script>
<script type="text/javascript">
new jp.naver.line.media.LineButton
({"pc":false,"lang":"ja","type":"a"});
</script>
<!--lineボタン-->

</div>
<!--/more-->




ソースは上記のような感じで。

以上のようにテンプレートをエディットすると・・・
201302032.jpg
このように、個別記事の後ろにlineボタンがはいりました。

lineユーザーとの親和性が高く、かつ拡散を見込めるコンテンツ』をお持ちの場合は、ぜひやってみてくださいね(^_-)☆





○ただ、これを付けたって、書いてあることが『プライベートや内輪ねたを垂れ流すだけ・行動もしないのに不平不満をぶちまけるだけ』だったりした場合は、誰も拡散しないぞ。
デバイスが変わっても、『面白くて話題になる』『情報が役に立つ』など、コンテンツに何かしらの価値が必要だという真理は、変わることがないぞ!


と思う方は

にほんブログ村 IT技術ブログ Webサイト構築へにほんブログ村 ベンチャーブログへにほんブログ村 音楽ブログへ

↓↑クリックお願いいたします♪
関連記事
スポンサーサイト
トラックバック
トラックバック送信先 :
コメント

リンク(相互大歓迎♪)

月別アーカイブ