替Google Blogger加入Facebook留言

Facebook Comments留言功能主要的優勢是挾帶3.5億臉書用戶的普及度，不需另行註冊即可在各種平台留言，帶來很方便的互動效果。然而，Google Blogger網誌設定中的「版面佈置/Blog Posts」區塊並不支援Facebook留言嵌入功能(畢竟是社群應用市場的競爭對手)，因此我透過置底的「HTML/Javascript小工具」佈署這樣的功能。

1. 閱讀重灌狂人的教學文章「在部落格嵌入 Facebook 留言板，借3.5億個會員讓流量破表！」，取得Facebook Comments的嵌入程式碼。

2. 在Blogger設定的「版面佈置」下方加入一個HTML/JavaScript小工具。Blog Posts處並無法嵌入語法，我也不想每次post文時都在文章下方把這些嵌入碼置入，畢竟模組嵌入的獨立原則概念必須把持。

3. 重點來了，留言的資料是依賴Facebook Plugin Code中的「data-href」來區別，但我們無法以伺服端語言自動產生網址，所以我用Javascript的document.location變數來代替，新增如下代碼：

<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'));
document.write('<div class="fb-comments" data-href="'+document.location+'" data-num-posts="5" data-width="470"></div>');
</script>

4. 測試一切正常，雖然留言位置無法跑到最適當的文章下方，但還能接受。