Line 出了網頁版,以網會使用針對行動裝置上的 Line 分享按鈕的語法設定,針對通用性的部份在了解修改的差異性。
1.官網語法
根據「官方網站」,Line 分享按鈕的安裝語法如下:
<a href="http://line.naver.jp/R/msg/text/?訊息文字"><img src="圖片網址"/></a>
2.美化分享內容
訊息文字拆解並進行版面美化,讓訪客分享的文字訊息第一行顯示文章標題,接著利用特殊符號 %0D%0A 產生自動斷行效果,於第二行再顯示文章網址。這樣分享出去的訊息,就能直接點擊超連結,連回我們的文章網址。利用其語法原理產生的語法大致如下:
<a href="http://line.naver.jp/R/msg/text/?文章標題%0D%0A文章網址"><img src="圖片網址"/></a>
3.平板異常狀況
- 換行符號 %0D%0A 無法被解譯
- 網址最後面會自動產生 = 這個字元錯誤的網址導致訪客無法連結到文章頁面
所有網站通用的語法
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 | //<![CDATA[ (function() { var img = "http://2.bp.blogspot.com/-tsIDMPhBx18/VPGxHZtjsnI/AAAAAAAALIU/1b_VO721HDw/s1600/line-share-button.png", // line 按鈕圖示字串可改為自訂的按鈕圖片網址 title = document.title, url = "http://" + location.hostname + location.pathname, href, html; // 行動裝置語法 if( /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) ) { href = "http://line.naver.jp/R/msg/text/?" + title + "%0D%0A" + url; } else { // 網頁版語法 href = "https://lineit.line.me/share/ui?url=" + encodeURIComponent(url); } html = "<a href='" + href + "' target='_blank'><img src='" + img + "'/></a>"; document.write(html); })(); //]]> |