在blogger部落格中增加Facebook留言版(2013介面更新版)

在 Blogger 內加入Facebook 留言版應用程式
可以促進部落格與臉書之間的互動
也可以增加在臉書的活絡性
如下圖:

Step1:先取得個人fb_id
取得方法:到個人相簿中的”大頭貼照”相簿查看網址
&type=3 前的一串號碼就是個人fb_id
Step2:建立應用程式,請參考”創造FB應用程式
Step3:
到 facebook Soical Plugins 中的 Comments 獲取程式碼(Get Code)
在”HTML5″下,找到下圖紅框中的程式碼
上方那段程式碼,簡化成
<div id=’fb-root’/><script src=’http://connect.facebook.net/zh_TW/all.js#appId=貼上APP_ID&amp;xfbml=1‘/>
貼到blogger → 編輯HTML
<body expr:class=’&quot;loading&quot; + data:blog.mobileClass’>

下方(新版大多在 </ head>下方)


將紅框這串原始程式碼的紅色部份
<div class=”fb-comments” data-href=”http://example.com”data-width=”470″ data-num-posts=”10″></div>

改成藍色部份

<div class=”fb-comments” expr:href=’data:post.url data-width=”470″ data-num-posts=”10″></div>

改這串語法是因為,如果寫上的是部落格網址,則每篇文章下面的留言版,都會是同一個

改成藍色語法目的是為得讓每篇文章的留言版都是獨立的

接著在 blogger 中,編輯HTML內,搜尋
<!– quickedit pencil –>


 <div class=’post-footer-line post-footer-line-2′>
在</span></ div> 下方貼上剛剛改好的程式碼

再到 blogger → 編輯HTML
<head> 下
貼上
<meta content=’貼上APP_ID‘ property=’fb:app_id‘/>

<meta content=’貼上個人FB_ID‘ property=’fb:admins‘/>
則部落格每篇文章下面都會出現留言版
要應用這個留言版功能的前提
要先到Facebook創造一個應用程式
來驗證授權
補充說明:若是成功完成留言版安裝,在留言送出時卻還需要在按一次”確認”按鍵,請在<head>…..</ head> 中插入↓
<!–自動從.tw轉換成.com開始–>
<script type=’text/javascript’>
var blog = document.location.hostname;
var slug = document.location.pathname;
var ctld = blog.substr(blog.lastIndexOf(&quot;.&quot;));
if (ctld != &quot;.com&quot;)
{
var ncr = &quot;http://&quot; + blog.substr(0, blog.indexOf(&quot;.&quot;));
ncr += &quot;.blogspot.com/ncr&quot; + slug;
window.location.replace(ncr);
}
</script>
<!–自動從.tw轉換成.com結束–>

11 Comments