Web、モバイル(スマホ・格安SIM)、ソーシャルメディア活用術、フリーランスの働き方などを綴ります!

LINEで送るボタン設置方法|WordPressやMovabletypeなど各ブログにも。

41,952 view
更新日:2015年01月12日 投稿日 : 2012年12月22日
  • はてなブックマーク
  • facebook
  • twitter

皆さん、LINE使ってますか?

私はプライベートでめちゃめちゃ利用しております。LINEのSNSだってやっております(笑)
スマートフォン1つで、メッセージや写真、位置情報や動画も送れたりするので、生活の中で重宝しております。

そんな中、LINEも他のSNSに習って、オリジナルの”LINEで送るボタン”をリリースしました。
ホームページやブログに設置して、記事をブックマークしたり、拡散したりするツールです!

facebookのいいね!ボタン、twitterのツイートボタン、google+の+1ボタン、はてなブックマークと同じような目的を持つLINEオリジナルのボタンと捉えていただければ…。

いつかいつかは出ると思ってましたが、公式からようやくリリースされました。
そこで早速、ガイドラインに添ってブログに設置してみました。現状、スマホで確認できます。

テストもLINE友達に早速手伝って貰って、しっかり動く事を確認できました。

そんな訳で、この記事では、wordpressmovabletypeFC2ブログライブドアブログなどでの”LINEで送るボタン”の設置方法を記載したいとおもいます。是非、ご自分のブログサービスに合わせて設置してみて下さい。

LINEで送るボタン画像のダウンロード(ページ下部)
※ LINEがインストールされていない場合は、LINE(http://line.naver.jp/)Webページが表示されます。

スポンサーリンク

普通のホームページへの設置方法

<a href="http://line.naver.jp/R/msg/text/?[ページのURL]"><img src="[ボタン画像のURL]" width="[ボタン幅]" height="[ボタン高さ]" alt="LINEで送る" /></a>

WordPressへの設置方法

<a href="http://line.naver.jp/R/msg/text/?<?php the_title(); ?>%0D%0A<?php the_permalink(); ?>"><img src="[ボタン画像のURL]" width="[ボタン幅]" height="[ボタン高さ]" alt="LINEで送る" /></a>

下記ソースで、スマートフォン閲覧時とパソコン閲覧時で表示を切り替える事ができるので使用しましょう。パソコンで見ると非表示のソース。

<?php if ( function_exists('wp_is_mobile') && wp_is_mobile() ) :?>
<a href="http://line.naver.jp/R/msg/text/?<?php the_title(); ?>%0D%0A<?php the_permalink(); ?>"><img src="[ボタン画像のURL]" width="[ボタン幅]" height="[ボタン高さ]" alt="LINEで送る" /></a>
<?php endif; ?>

Movabletypeへの設置方法

<a href="http://line.naver.jp/R/msg/text/?<$MTEntryTitle$>%0D%0A<$MTEntryPermalink$>"><img src="[ボタン画像のURL]" width="[ボタン幅]" height="[ボタン高さ]" alt="LINEで送る" /></a>

FC2ブログでの設置方法

<a href="http://line.naver.jp/R/msg/text/?<%topentry_title>%0D%0A<%topentry_link>"><img src="[ボタン画像のURL]" width="[ボタン幅]" height="[ボタン高さ]" alt="LINEで送る" /></a>

ライブドアブログでの設置方法

PC・スマホ用の管理画面から設定する(以下、PC用)
ブログ設定 > デザイン / ブログパーツ設定 > スマートフォン > レイアウト を選択
表示させたいページの右カラムにあるアイテムを左の枠に移す
ソーシャルボタンアイテムの『設定』を押し、表示させたいものを選択する
http://blog.livedoor.jp/staff-smartphone_help/archives/21379675.html
などなど、他のブログサービスでも対応可能になった時、ソースを追加していきたいと思います。

LINEはスマートフォンだけじゃない!パソコンでもできるのだ!

みんなが使っているLINEですが、パソコン用のアプリもあるって知ってますでしょうか?
スマホばかり使っているのでパソコン版の事なんて、私も頭に無かったです(汗)

パソコン版もスマホ版とほとんど機能は同じで、通話もできちゃったりします。スマホでやりとりしている会話もクラウドで共有されているみたいなので、パソコンでもスマホでも心置きなく使い倒せます!アカウントが同じなら保存データも同じですので、ありがたい仕様です。

”LINEで送るボタン”がどんどん広がって、益々私の記事がより多くの人に見ていただければと願う次第です。
レスポンシブWebデザインであるこのブログですが、スマホで見られている方は”LINEで送るボタン”が設置されている事を確認できることでしょう。

パソコンサイトで表示させるかは様子を見てます(笑)
LINEも集客ツールとして押さえていきたいですね!

設置方法|LINEで送るボタン
無料で使えるLINEの集客ツール「LINE@」

当記事がお役に立ちましたらシェアして頂ければ嬉しいです。

  • はてなブックマーク
  • facebook
  • twitter
41,952 view 2012年12月22日

webdesignerwork 著者

フリーランスWebデザイナーとして活動をはじめて18年。全国の私を必要としてくれる方々からWordPressでのWeb制作のご依頼を頂いております。

各地のコワーキングスペースやWordPressの勉強会(WordBench/WordCamp)などに顔を出し、様々な人達とご縁をいただき刺激を受け、学んだこと感じたことを、日々のお仕事や自社メディアへの開発・配信にと繋げております。妻、子、プードル2匹と里山暮らし。

当ブログで公開されているテキスト、画像、イラストなどに関する権利は、当方に帰属します。
著作者の許諾を得ることなく複製、改変、転載、販売、出版など著作権法そのほか法律に触れる行為は禁止されております。

運営者情報

© 2004 webdesignwork ALL COPYRIGHTS RESERVED.