網路上很多安裝 LikeCoin 讚賞鍵到 WordPress 的教學,或者是安裝到痞客邦或 Blogger 等,沒什麼自架站的安裝文章,但其實原理都一樣,只要貼上一段程式碼即可,不管是在哪個網站,甚至如果你是平台或者專門做網站外掛的工程師也能幫 Liker 們解決這件事。(當然像 WordPress 這類 CMS 都已經有人幫你們做好外掛了,如果是這類的平台直接找外掛即可)
本篇是以獨立架站的人為主,請參考以下做法。
HTML 如下:
<iframe data-v-b66e9a5a="" src="https://button.like.co/in/embed/你的LikerID/button?referrer=文章網址" class="lc-margin-top-64 lc-margin-bottom-32 lc-mobile" frameborder="0" scrolling="no"></iframe>
如果是我的就長這樣:
<iframe data-v-b66e9a5a="" src="https://button.like.co/in/embed/kumo-tw/button?referrer=https://kumo.tw/article.php?id=33" class="lc-margin-top-64 lc-margin-bottom-32 lc-mobile" frameborder="0" scrolling="no"></iframe>
這個就是本篇我的按讚鍵,那麼問題來了,自架站的人總不可能一篇一篇的貼吧?因此這段我們會放在共同引用的部位,比如說放在<footer>,然後用程式抓取當前文章網址即可。
用什麼程式都可以,以 jQuery 為例,則可以這樣寫:
<script>
$(function(){
$("#like").html('<iframe data-v-b66e9a5a="" src="https://button.like.co/in/embed/你的LikerID/button?referrer=你的網域'+location.pathname+location.search+'" class="lc-margin-top-64 lc-margin-bottom-32 lc-mobile" frameborder="0" scrolling="no"></iframe>');
});
</script>
說明:
location.pathname:網頁路徑(例如 /article.php)
location.search:URL查詢(例如 ?id=33)
依照你的需求可以改用其他抓取方式,例如使用 location.href,這代表完整的 URL,不過這會包含帶有#字號的網址,這樣如果有人點目次錨點或者是從 Facebook 等其他社群來到你的網站,也會被視為是不同網頁,按讚數就會分開算,例如「/article.php?id=33」跟「/article.php?id=33#hello」或「/article.php?fbclid=IwAR2G7F9SI1...(從FB分享的連結進來的)」,都算是另外一個網址,按讚數都會個別計算,雖然最後得到的 Like 總數是一樣的,但是你在「/article.php?id=33」這篇文章中看到的讚並不代表所有的讚,你可能會以為都沒人按讚,事實上都被分到其他網址去,因此建議最多讀到問號的部分即可。
以上就是安裝方式,當然別忘了在 <footer> 中加上「<div id="like"></div>」,如此即大功告成,在任何網站平台都一樣,只要該平台有開放 JS/jQuery 的自訂區即可加上這段。
如果沒有開放 JS/jQuery 自訂區的話就只能一篇一篇貼上 HTML 的部分,也就是最上方的那段 HTML,貼在每一篇文章的原始碼中,但這方法真的很麻煩,如果你確定以後要靠網站吃飯,不妨自己架站看看吧。