在你的網站加上 Facebook 推薦區、浮動推薦框

很多時候網站會想要將網友觀看文章後，

將網友帶到延伸文章繼續觀看，以提高訪客停留時間，

WordPress 上關於此類的外掛五花八門，

不過 Facebook 官方也有相關的外掛，

不僅顯示延伸文章，還附加朋友也推薦此文章之類的，

讓推薦的效果更給力！

推薦區：Facebook 官方說明文件

浮動推薦框：Facebook 官方說明文件

延伸閱讀：如何在網站中插入 Facebook 留言框？

安裝 Facebook 推薦區 (Recommendations Box)

首先先將以下代碼加到 </head> 之前，WordPress 的用戶請編輯 header.php

（若之前有裝 Facebook 留言框 或網站內已使用此代碼則忽略）

<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&appId=你的APP ID";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

說明：

你的 APP ID ：請至這裡建立一個應用程式並複製 APP ID 貼上即可。

接著請將以下代碼加入欲呈現的位置

<fb:recommendations site="網域名稱" app_id="APP ID" width="寬 (數字)" height="高 (數字)" header="true"></fb:recommendations>

說明：

網域名稱：您的網站網域名稱，例：blog.brownsugar.tw

APP ID ：請至這裡建立一個應用程式並複製 APP ID 貼上即可。

寬：推薦區的寬度，請輸入純數字

高：推薦區的高度，請輸入純數字

結果如下：

安裝 Facebook 浮動推薦框 (Recommendations Bar)

首先先將以下代碼加到 </head> 之前，WordPress 的用戶請編輯 header.php

（若之前有裝 Facebook 留言框 、已經使用上面的功能或網站內已使用此代碼則忽略）

<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&appId=你的APP ID";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

說明：

你的 APP ID ：請至這裡建立一個應用程式並複製 APP ID 貼上即可。

接著請將以下代碼加入欲呈現的位置

<fb:recommendations-bar trigger="展開時機" action="動作" side="浮動左右" site="網域名稱"></fb:recommendations-bar>

說明：

展開時機：推薦框展開來時機（一開始隱藏），預設 onvisible ，大多數都使用 onvisible

動作：預設 like 讚，recommend 推薦

浮動左右：預設 right 右， left 左

網域名稱：您的網站網域名稱，例：blog.brownsugar.tw

結果本站左下角所示。

若需要更多的函數說明，或有任何問題，歡迎提問！