在 WordPress 使用 Facebook 留言板 (Facebook Social Plugins Comments)

(2012-08-23 更新)接續上一篇,在 VPS 架設完 WordPress,覺得雖然 WordPress 有內建的留言(Comment)功能,但要留言的人需要自行輸入”姓名”以及”電子郵件”等資訊,總覺得要額外輸入這麼多東西有點麻煩,再說有不少網友都直接掛在 Facebook 上,如果可以直接用 Facebook 的帳號來留言是不是方便很多呢?接下來的文章您將可以學會:1. 建立 Facebook Developers 應用程式。2. 建立 Facebook Social Plugins Comments 留言工具。3. 將 Facebook Comments 嵌入 WordPress。

● 建立 Facebook Developers 應用程式

要使用 Facebook Social Plugins 只要在 Facebook Developers 建立一個自己的應用程式即可。

1. 到Facebook 開發人員,點選上方「應用程式」來新增自己的應用程式。
點圖放大

2. 第一次使用 Facebook Developers 會出現授權請求,如果選擇不允許就不能繼續囉!同意吧!
2011 12 4 %E4%B8%8B%E5%8D%88 06 19 44 在 WordPress 使用 Facebook 留言板 (Facebook Social Plugins Comments)

3. 點選右上角的「建立應用程式」。
2011 12 4 %E4%B8%8B%E5%8D%88 06 21 201 在 WordPress 使用 Facebook 留言板 (Facebook Social Plugins Comments)
4. 輸入要建立的應用程式的顯示名稱及名稱空間,這些資訊之後都可以修改。
2011 12 4 %E4%B8%8B%E5%8D%88 06 22 45 在 WordPress 使用 Facebook 留言板 (Facebook Social Plugins Comments)
5. 接著輸入驗證碼,如果你的 Facebook 沒有通過手機認證,會跳出要求手機認證。
2011 12 4 %E4%B8%8B%E5%8D%88 06 23 22 在 WordPress 使用 Facebook 留言板 (Facebook Social Plugins Comments)
2011 12 4 %E4%B8%8B%E5%8D%88 06 23 49 在 WordPress 使用 Facebook 留言板 (Facebook Social Plugins Comments)
6. 建立完成會看到以下畫面。包含了 App ID(等一下會用到)、App Secret(如果要透過 Facebook 使用某些特殊功能會用到)。
2011 12 4 %E4%B8%8B%E5%8D%88 06 28 53 在 WordPress 使用 Facebook 留言板 (Facebook Social Plugins Comments)
7. 輸入網站網址。將網站與 Facebook 做關聯。如果要開發其他比如說 Android App,也是一樣從這邊點選輸入。
2011 12 4 %E4%B8%8B%E5%8D%88 06 30 18 在 WordPress 使用 Facebook 留言板 (Facebook Social Plugins Comments)
8. 資料都設定完成回到主畫面後,左側可以看到所有你建立的應用程式,右邊是應用程式的相關資訊。這樣就完成了申請 Facebook Developers 應用程式囉!
2011 12 4 %E4%B8%8B%E5%8D%88 06 35 16 在 WordPress 使用 Facebook 留言板 (Facebook Social Plugins Comments)

    4 個回應

    1. 請問一下你這篇內容是不是有更新過?我有照你方法加入程式碼來做留言版,但如果有網友使用fb留言版功能,我好像不會收到通知?印象中好像文章內容還有介紹怎麼管理留言功能?

      • Hans表示:

        Dear 超好用網路行銷工具:
        文章有更新過,不過是小幅更新而已,您說的管理工具,應該是在別的頁面喔!
        (因為文章太長了所以切了頁面,可能是分頁太小了您沒注意到!)
        延伸閱讀下面有個分頁連結,第三頁有介紹管理留言介面,
        至於收到通知這件事情,小蛙沒有額外設定,開啟facebook塗鴉牆,
        最上面就會有留言通知了(就是某某某留言給你的那個通知)。
        Good Luck!! ^___^

    2. AllenChu表示:

      版主你好!請問,照你的方法做完以後,
      每一個頁面的facebook留言版是不是同一個?
      因為我出現的問題是,每一頁是同一個留言版…
      不知道有沒有什麼解決之道!若版主知道請版主指教,謝謝您!^^

      • Hans表示:

        Dear Allen:
        依照這篇文章的作法的確是會造成每一頁都是同一個留言板的問題,
        把data-href=””原本是固定網址,修改方式如下:

        <div class="fb-comments" data-href="<?php the_permalink(); ?>" data-num-posts="10" data-width="725"></div>
        

        這邊只要改成每篇文章的固定網址,就可以讓每篇文章都有自己的留言板,
        後台管理頁面中也可以直接連結到該留言版頁面!^__^

    發佈留言

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

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