「LINEボタン」が正式にリリース!WordPressブログで設置する方法

LINE button 【img via NAVERプレスセンター

「LINEボタン」が正式に発表された!

gori.meのモバイル表示では既に設置してあるが、正式版が発表されたということで設置してみた!Wordpressを使っている人向けに、設置方法を以下に記載しておく!


アイコン画像をアップロードして用意されたコードを入れるだけ!

Wordpressブログを運営している人には朗報だ。NAVERがWordpress用のコードを用意してくれている!!あとは自分のブログ用にコードをいじって設置するだけ。



「LINEボタン」をタップすると、LINEアプリがインストールされている場合はLINEアプリが起動するので宛先を指定するとリンクタイトルとURLが入った状態のメッセージ作成画面が表示される。アプリがインストールされていない場合はLINE公式ページに遷移する。

WordPressブログで「LINEボタン」を設置する方法

設置方法は数ステップで完了するので、サクッと設置しましょう!

1. LINEボタンの画像ファイルをダウンロード

まずはLINEボタンの画像ファイルをダウンロードしよう!ここ(直リンク)に全ファイルがまとめてある。Retinaディスプレイでキレイに表示されるように、2倍の大きさで作られている。素晴らしい!

2. 使用する画像をアップロード

ボタンを設置するためにはどこかしらにLINEボタンの画像ファイルをアップロードしよう!

3. 表示したい場所にコードを記入

あとは表示したい場所に下記コードを入れるべし!ボタン画像のURL、ボタンの幅、ボタンの高さはそれぞれ指定するように!

<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>

これが「LINEボタン」の完成形!

というわけで、gori.meの記事内に設置してみた!思いの外ボタンが小さかったので現在は下記スクリーンショットよりもボタンの間隔を広めにとってある。

Line button gorime
日本人向けのメディアを運営している以上、LINEはどう考えても無視できない存在。まだ設置していない人はやってみてはいかがだろうか!

オススメ
LINE_button.png

gori.meの最新情報をチェック!!

  1. iPhone-6s-In-Depth-Review-15.jpg
    「iPhone 6s」の電源が突然落ちる不具合、製造工程に問題があったと判明
  2. iphone6s-shutdown.png
    Apple、「iPhone 6s が突然シャットダウンする問題に対するプログラム」ページを公開、シリアル番号で確認可能に
  3. macbook-pro-2016-gpu-freaking-out
    「MacBook Pro (Late 2016)」のGPUに関する不具合、影響範囲が拡大中
  4. 25-more-hidden-ios10-features.png
    「iOS 10.2 Beta 5 / Public Beta 5」、配信開始
  5. delete-iphone-else-top.jpg
    【保存版】iPhoneのストレージ容量不足を劇的に解消する7つの方法