操作碰到困難?試試搜尋功能吧!

WordPress 文章下方增加 LINE Social Plugins



 
一直以為 LINE 的分享按鈕在電腦上看還是雞肋一枚,想不到今早看到某家媒體網站上的 LINE 竟然已經可以從電腦上分享了,而且查看官方文件,除了分享外,還有跟 Facebook 一樣的讚按鈕,以及再用不用拿手機掃 QRCode 來加朋友的按鈕,立馬來整理一下放在 WordPress 網站裡面。

把下面這段程式碼放進 wp-content/themes/yourtheme/function.php 裡面就好,如果是使用現成佈景主題記得是加在子主題的 function.php 中,如果不知道怎麼使用子主題可以參考這一文章


function LineSocialPlugin($content){
// 載入 LINE JS
$content .= '<script src="https://d.line-scdn.net/r/web/social-plugin/js/thirdparty/loader.min.js" async="async" defer="defer"></script>';
// 設定按鈕樣式
$content .= '<style>.lineWrap{margin: 1rem 0 0 0;}.lineWrap iframe{ margin-right: .5rem; }</style>';
$content .= '<div class="lineWrap">';
// 在文章結尾加入「加入LINE讚」
$content .= '<div class="line-it-button" data-lang="zh_Hant" data-type="like" data-url="'. get_permalink() .'" style="display: none;"></div>';
// 在文章結尾加入「用LINE傳送」
$content .= '<div class="line-it-button" data-lang="zh_Hant" data-type="share-a" data-url="'. get_permalink() .'" style="display: none;"></div>';
// 在文章結尾加入「加入LINE好友」
$content .= '<div class="line-it-button" data-lang="zh_Hant" data-type="friend" data-lineid="@yourlineid" style="display: none;"></div>';
$content .='</div>';
return $content;
}
add_filter('the_content', 'LineSocialPlugin');

 

用法很簡單,就是使用 LINE 官方提供的頁面,把自己喜歡的按鈕樣式選一選,然後把產出的程式碼貼進來,需要注意的地方就是 data-url 的部份,要換成 WordPress 的 get_permalink 來取得目前頁面的網址,就可以根據所在頁面進行分享。

如果要放加入好友的按鈕,記得修改 data-lineid 為自己的 ID,另外這段程式碼可以根據你自己的需要修改,假設你不想要放「加入LINE好友」的按鈕,只要把它註解就好,註解的方式也很簡單,加入 // 即可,所以程式碼會變成這樣:

 

function LineSocialPlugin($content){

// 載入 LINE JS
$content .= '<script src="https://d.line-scdn.net/r/web/social-plugin/js/thirdparty/loader.min.js" async="async" defer="defer"></script>';
// 設定按鈕樣式
$content .= '<style>.lineWrap{margin: 1rem 0 0 0;}.lineWrap iframe{ margin-right: .5rem; }</style>';
$content .= '<div class="lineWrap">';
// 在文章結尾加入「加入LINE讚」
$content .= '<div class="line-it-button" data-lang="zh_Hant" data-type="like" data-url="'. get_permalink() .'" style="display: none;"></div>';
// 在文章結尾加入「用LINE傳送」
$content .= '<div class="line-it-button" data-lang="zh_Hant" data-type="share-a" data-url="'. get_permalink() .'" style="display: none;"></div>';

// 在文章結尾加入「加入LINE好友」
// $content .= '<div class="line-it-button" data-lang="zh_Hant" data-type="friend" data-lineid="@yourlineid" style="display: none;"></div>';

$content .='</div>';
return $content;

}
add_filter('the_content', 'LineSocialPlugin');

 

這樣就大功告成了!

 

1 則留言

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *

這個網站採用 Akismet 服務減少垃圾留言。進一步瞭解 Akismet 如何處理網站訪客的留言資料

 

WordPress 教學