網站中增加Line分享按鈕,將網頁資訊分享給朋友

在台灣智慧型手機的APP使用率,前幾名排行除了 Facebook外,接下來應該就是 Line了!最近在幾個網站上看到Line分享的按鈕,原來是官方網站去年老早就推出的機制。

首先進到 Line for Media Operators ( 日文 / 英文 ) 的網站。

上面有一個installation on Smartphone Website,可以透過點選的方式就增加按鈕。

line_share_button

如果您要自己設定的話,也有文件可以參考,目前格式有二種

http://line.naver.jp/R/msg/<CONTENT TYPE>/?<CONTENT KEY>

line://msg/<CONTENT TYPE>/<CONTENT KEY>


如果您要傳送圖片的話,得選第二種(它的CONTENT TYPE多了 IMAGE)。

範例的話是傳送 LINE it! http://line.naver.jp/

一般的website

<a href=”http://line.naver.jp/R/msg/text/?LINE%20it%21%0d%0ahttp%3a%2f%2fline%2enaver%2ejp%2f“><img src=”[圖片的網址]” 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=”[圖片的網址]” width=”[圖片的寬度]” height=”[圖片的高度]” alt=”LINE分享!” /></a>

那要注意的是,您的網站要是手機版的才行唷~可以透過檢查,或是如果是Wordpress用戶的話,可以安裝Post Layout的外掛,然後 Enable mobile user agents detection,接著在想放的位置放上程式碼就行了!

line_share_post_layout

那至於如何設定按鈕呢~在網頁的最後有設置的參考頁面,或是可以按這裡下載官方的按鈕。

line_share_button_images

最後我們看一下成果,在進入網頁出現用LINE分享給朋友看~

993308_10151450281461541_361881484_n

接著可以選擇要傳送給那些朋友或是群組,或按下面的傳送到主頁貼在自己的動態消息

1013846_10151450277861541_1931992677_n

1013714_10151450277831541_567113956_n

延伸閱讀:

Line按鈕圖片分享包 http://media.line.naver.jp/img/linebutton.zip

作者: 林壽山

目前任職於軟體公司研究開發部門,擔任專業處長,專注於.NET C# 開發,並具備豐富的POS 收銀系統與金流整合開發經驗。我精通各類支付系統的設計與開發,包含第三方支付(如綠界、藍新、歐付寶、速買配、馬來西亞 ePay/HappyPay、台新 One 碼)、行動支付(悠遊卡、一卡通、支付寶、微信支付、街口支付)、以及信用卡支付(聯合信用卡)。 熟悉多種開發技術,擅長PHP 網頁開發(CodeIgniter、Laravel 框架)、Delphi 程式設計、資料庫設計、C# WinForm/WebForm 應用開發、ASP.NET MVC、API 串接設計,並具備LINE 串接開發的豐富經驗。 除了技術開發之外,我也熱衷於技術分享,曾擔任台中學校產業學院講師 5 年,培育新一代的軟體開發人才,致力於推動軟體技術的應用與創新。 我對技術充滿熱忱,始終保持學習與探索的心態,期望透過軟體開發為企業與社會創造更大的價值。

在〈網站中增加Line分享按鈕,將網頁資訊分享給朋友〉中有 2 則留言

留言功能已關閉。