如何在部落格上放Facebook的「讚」來推薦文章？

話說Facebook是目前全球最大的社群網站，相信身旁的朋友都有Facebook帳號，大家幾乎天天都上Facebook上關心一下朋友動態或是發表一下自己的心情。當然，有時候在Facebook上面按「讚」按久了，到了一般網站看完文章覺得不錯時，也想按個讚來推一下文章，那如何在網站上放一個讚呢？

在Facebook上的社群工具中，有個「Like Button」外掛可以使用，只要將語法貼到部落格上就可以讓部落格或是網站上多一個讚，可以讓使用者看完之後順手按個讚來支持文章，當然按了讚之後，也會把這篇文章推到Facebook的個人動態上面，一來是對文章的一種支持，另一方面也增加網站曝光率。

這樣的做法就跟當年的funp推推王一樣，網站上放個推的按鈕，讓網友可以看完文章進行推薦，在社群網站上增加曝光率，替自己網站帶來流量與人氣，透過社群網站進行免費的社群行銷，不過話說回來，funp目前讓人感覺是漸漸走下坡，取而代之的就是最近火紅的Facebook這個全球最大的社群網站。

因為Facebook上有著廣大的人口，如果有機會把文章曝光在大家的個人動態頁面，相信可以替網站帶來不少的流量，算是免費曝光吧！又加上Facebook的使用人口非常的多，來擺個讚按鈕來讓網友好幫你推薦文章唷！

第1步 在Like Button的頁面上，依照畫面上的指示，依序將資料與設定輸入到欄位中，完成後點擊﹝Get Code﹞。

  • URL to Like：要推薦頁面的網址
  • Layout Style：樣式
  • Show Faces：是否顯示頭像
  • Width：寬
  • Verb to display：按鈕顯示的字樣，讚(Like)、推薦(Recommend)
  • Font：字型
  • Color Scheme：配色，亮、暗。

如何在部落格上放Facebook的「讚」來推薦文章？

第2步 接著將語法取得並貼到你要顯示按鈕的頁面就可以了，以WordPress來說，可以開啟佈景檔案中的single.php，找個位置貼上語法，就可以顯示在內頁。

如何在部落格上放Facebook的「讚」來推薦文章？

第3步 如下圖，貼上後就會出現讚的按鈕了，覺得不錯趕快按讚吧！

如何在部落格上放Facebook的「讚」來推薦文章？

為什麼推薦的頁面只有首頁？

或許根據上面的方法操作並貼上程式碼後，大家可能會好奇為什麼推薦的頁面只有首頁呢？因為你剛剛輸入的網址就是首頁，所以不管在哪個頁面出現的讚按鈕，他永遠只會推薦首頁。那該如何讓他可以順利依照頁面的不同而推薦不同的頁面呢？

以WordPress來說，如果要針對WordPress依照每個不同頁面推件不同的內容，那在語法上要做小小的修改，也就是說在語法上要透過您部落格系統本身的函式去呼叫該頁面網址，讓他會自動變動。

所以前面取得的語法中，在網址參數上，「like.php?href=」的後方就要接上一個函數「<?php echo urlencode(get_permalink());?>」，這樣才會依照不同的頁面可以推薦不同頁面的東西，不會全部推薦首頁。

因此，若您是Blogger和WordPress的使用者，需要語法請到WordPress 中文指南的網站上這篇文章：為你的網誌加入Facebook推文按鈕（Like Button），取得按鈕的語法，如果看的懂原始碼可以依照自己的需求做一些簡單的調整喔！若您是其它BSP或者是自己做的網頁，那就可能每個頁面要手動貼上連結了。

在Google News上追蹤我們最新文章
標籤
香腸
香腸

喜歡在網路上透過文字與圖片分文章教學，默默地用鍵盤烤了9年的香腸。另外還身兼阿腸接案餬口飯吃。對了，別叫我阿腸，請叫我香腸，這樣我才知道你看我部落格長大的。

文章: 1781

相關文章

81 則留言

  2. 您好~我在痞客邦文章末已經設定好LIKE BUTTON!!妙的是電腦上看都正常 ，手機上看LIKE BUTTON就只有FB名稱沒有照片?求解答謝謝!!

  3. 請問怎麼可以加您blog 上最下面的這個Recommended 功能呢， 不需要分享到FB, 只想看看多少人喜歡， 求解答~謝謝您

  4. 不好意思，不知道現在留言會不會被看見，我想請問，我的文章之前有幾千個like，今天打開竟然只剩下13個！非常懊惱呢，不知道是什麼原因？用辦法修復嗎？

  7. 請問香腸大為什麼我的讚按鈕不能像juksy網站一樣按下去會跳小視窗然後點下回應直接出現在他人的fb動態上嗎？

  8. 您好！我安裝FB的外掛，其中使用了 Like Button 這功能！
    設定為：<div class="fb-like" data-href="” data-layout=”standard” data-action=”like” data-show-faces=”false” data-share=”true”>

    我想知道的是，這個讚是統計哪裡的數據呢？
    我能知道是誰按了讚嗎？
    謝謝！

  10. 請問是否能在一個網頁內針對不同的項目加入”讚”呢?

    因為我有試過在不同的項目底下加入語法,但是只要我單獨針對一個項目按”讚”的話,

    該網頁其他的項目也同時都會出現我按的”讚” !!

    我目前使用加入的語法提供如下 :
    第一段:

    (function(d, s, id) {
    var js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) return;
    js = d.createElement(s); js.id = id;
    js.src = “//connect.facebook.net/zh_TW/all.js#xfbml=1”;
    fjs.parentNode.insertBefore(js, fjs);
    }(document, ‘script’, ‘facebook-jssdk’));

    第二段:

  11. 你好, 請問我現在已有按照您上面的教學，有Like Button出現在文章上，但請問有or可修改成是 “Recommend Button”嗎? 謝謝

  14. 香腸哥：

    我按上面的網址 他跳出來的畫面和您的不太一樣也，我按get code

    他沒有 IFRAME的
    且按 IFRAME 他說This plugin does not have an iframe implementation with the selected options. Please use the JavaScript SDK and the HTML5 or XFBML implementations, or change the value of the send parameter.

    要如何弄呢？是不是他這程式有改版呢？

    另外 URL to Like 這要填入的網址是填入我要放 贊的那個wp網址，還是填入臉書粉絲團的網址呢？

    另外 URL to Like 光打網址他不接受，要加上http:// 也

    請指導我一下。感恩

  15. http://developers.facebook.com/docs/reference/plugins/like/
    裡面的 URL to Like (?)填入網址後就只能有1個固定頁面能按讚..
    要怎樣自動偵測本頁網址呢?我想在每篇文章都貼同一組語法就好

    像

    分享到臉書

    以上就是自動偵測網址的語法.可是我不知道哪裡到哪裡才是正確的

    另外一個問題是.如下圖
    從
    http://developers.facebook.com/docs/reference/plugins/like/ 申請出來的會是下圖中藍色框框裡面的效果.
    如果我想要紅色框框裡面的效果又該如何用呢?

    圖片網址：http://i.imgur.com/uD7Hn.jpg

  20. 我試了幾個禮拜，找不到方法。真的不行了。

    請問：
    我點「讚」之後，原本文章裡的 圖 有時候會不見，變成一個不知道什麼東西的圖，有時候會跑出 google+ 的 icon。

    我用香腸的方法，IFRAME、XFBML、HTML5 都試過，也用 javascript SDK 和 Open Graph，不知道是哪裡錯了，請指點迷津。

    http://www.innofaci.com

  23. 我的網頁在留言時，都必須要再輸入驗證碼一次，香腸的不用，怎會這樣？還有留言的字能設定成其他顏色嗎？

  24. <div id="fb-root"></div>
    <script>(function(d, s, id) {
    var js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) {return;}
    js = d.createElement(s); js.id = id;
    js.src = "//connect.facebook.net/zh_TW/all.js#xfbml=1";
    fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));</script>
    <div class="fb-like" data-href="http://www.facebook.com/no1technology&quot; data-send="true" data-width="450" data-show-faces="true" data-font="segoe ui"></div>

  28. 香腸大大！為何我這個讚加上去之後，在自己的網站按讚於fb看到的都是亂碼？
    還有那個臉書留言也都是亂碼？（為何我按別的網站的讚就不會亂碼？）

    香腸回應：
    有看過這樣的情況，可能你的WP原始檔編碼有問題@@

  38. 想請問一下~~
    為什麼我的樣式選擇button_count
    讚的人數破千之後~~
    他只會顯示1000人呢~~
    但如果選擇standard卻是顯示完整的1,1xx人醬子~
    有辦法用button_count樣式但讓他顯示完整人數嗎..>.<..

    香腸回應：
    應該是寬度設定問題，他的iframe不夠寬，造成超出部分被蓋掉了吧~

  40. 不好意思我想請問一下facebook現在要怎麼拿到金鑰啊?
    他說要透過手機傳可是上面卻沒有台灣的電信業者連台灣這個國家都沒有= =
    直接打國際碼傳也都收不到….

    香腸回應：
    不知道你說的金鑰是指？

  42. 謝謝您的教學~
    我照站長的方式做了
    但是為什麼這篇文章的人數好像顯示怪怪的
    http://blog.guitar.com.tw/guitar-teacher-in-kaohsiung

    請問站長看到讚的人數是多少?
    原本還有 49 竟然變成 5

    我在想說會不會是被Facebook懲罰了
    因為之前在Facebook短時間大量的請朋友幫我點讚
    不知道會不會被Facebook懲罰?

    香腸回應：
    不會是懲罰啦~那是有時候FB更新的問題~我現在看到是51

  45. 請問
    如果想放在Discuz!要怎辦呢
    在網上有找到方法
    可是讚完之後 在FB只顯示論壇名稱
    但連接是帖子連接來的
    那要怎麼改成讚它是顯示帖子名稱的呢

    香腸回應：
    這可能要改code，這部分我沒有研究

  46. 無名超爛 因為他不支援 iframe語法
    我問過客服 客服還繞了一大圈去問工程師
    真的是科技公司聽起來一點都不科技

    連這種基本的東西都不知道甚麼時候才開放
    比中國鎖一些境外網站和關鍵字，無名鎖的內容還多，真可笑

    香腸回應：
    也不允許JS

  47. 您好。不好意思，為什麼我順利加進去了，可是網頁跑完後，左下角為出現驚嘆號的完成，按讚卻都是錯誤呢？

    之前所存的檔案 還能開嗎?

    請解答，謝謝^^

    祝安

    香腸回應：
    這個我不清楚耶，對Blogger沒有研究…
    你找看看其他Blogger使用者有放讚的，看看他們是否有這類問題@@

  48. 請問有支援天空部落嗎?有出現讚字，但是按下去卻出現錯誤

    香腸回應：
    不清楚，這部分您要自己測試看看~
    錯誤可能是天空不支援ifram語法，或是您語法有誤

發佈留言

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

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