記下來

一路上踩到的坑、遇到的問題，一點一滴記下來，希望能幫助到需要的人~

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

作者: · 最後更新 · 發表於 · WordPress / 網頁前端

(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. 超好用網路行銷工具表示:
      2012-09-2316:47:29

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

      回覆
      • Hans表示:
        2012-09-2409:13:30

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

        回覆
    2. AllenChu表示:
      2012-03-1923:38:37

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

      回覆
      • Hans表示:
        2012-03-2011:44:51

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

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

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

        回覆

    發佈留言

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

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