「上一版」留言 #5 +Lee Bruce 詢問能否改成自適應的版本。由於目前行動裝置的普及化，而各種行動裝置的螢幕寬度不一，因此舊版本只能固定 Facebook 留言框寬度的 px 值，的確不合時宜，於是本篇做了小幅度的修正。另外，之前的文章一次說明了各種部落格平台的安裝方式，版面可能稍微凌亂、不利於閱讀，因此這次不同平台將個別說明，本文只針對 Blogger 的安裝流程，其他部落格請參照以下連結:
<< 請注意！本篇文章含會員限定內容 >>
一、留言框寬度設計的考量
根據 +Lee Bruce 提供的連結「Facebook Comment Responsive Design」，這個版本的設計原理包含了，當使用者改變視窗大小時，重新計算寬度，並重新載入 FB 留言框。
WFU 的版本考量如下：
1. 這樣的設計是真正的自適應版面，不過 WFU 覺得使用者改變視窗大小的機率不高，且每次一改變視窗就重新載入 FB 留言框，須花費額外的執行時間(例如有時使用者會在短時間內，多次按 Ctrl+、Ctrl- 來放大縮小調整視窗)，因此未採用這個設計。
2. 留言框寬度符合自適應版面的寬度後，會產生的問題為，或許有的版面 100% 寬度在視覺上效果不佳，或許有的使用者不想要 100% 的寬度。因此 WFU 仍舊將寬度的參數開放出來自訂，例如可以設定為 95% 寬度這樣的效果。
二、安裝程式碼
在修改範本之前，如果第一次安裝本站工具的讀者，建議先閱讀「備份範本的訣竅」系列文章。
接著請到 Blogger 後台「範本」→「編輯 HTML」，搜尋
基本上如果沒有特殊需求的話，儲存後就可以看到效果了，FB 留言框會出現在 Blogger 留言區塊的上方。也可看以下範例網頁的效果：
如果需要更多的功能，那麼請繼續往下看如何修改參數，及其他安裝步驟。
三、修改參數
請參照安裝程式碼行號及綠字的備註──
G：預設值 1 代表 FB 留言框的寬度為 100%；若改為 0.9 代表寬度為 90%。
H：請改為自己的 email，那麼只要一有留言，可及時收到通知。
I：請參考「四、管理留言」的步驟，填入自己的 FB 管理者 ID，那麼自己的留言就不會收到 email 通知。
J：設定顯示幾則留言
K：留言框預設會出現在 Blogger 留言區塊的上方；若想擺放到自訂的位置，本行參數可改為 "#fb-comment-area"，然後可參考「Blogger 範本__(三)文章及留言區塊的程式碼」，把全部程式碼放在範本中的自訂位置即可。
L：若部落格底色為深色, 字串請改為 "dark"
四、管理留言
如果需要管理 FB 留言的話，請請依照舊版「Facebook留言板安裝懶人包」→「一、準備動作」，來取得 FB 管理者 ID 及 FB 應用程式 →「三、Blogger 安裝」→「2013.11.22 補充」的內容，將 META 標籤的字串放在範本中
五、其他說明及注意事項
為了避免重複內容，關於「使用說明」、「調整 CSS」、「Email 每日寄送額度」等等事宜，請直接參照「上一版」→「五、使用說明」→「六、其他注意事項」
2015.1.13 公告：由於共用的試算表使用量日漸增加，為了讓所有使用者能正常運作，會不定期檢查資料庫，若有商業使用、或每日使用量較大的網站，會要求改用客製試算表，「使用者付費」是比較公平的折衷方式。
六、常見 FAQ
日後若有常見問題，會持續補充在此。
Q1: FB 留言 Ju Nina 表示無法收到留言通知
Ans:
- 由於 Google Drive 於 2014 九月~十月 進行舊版升級，導致原本程式碼無法正常執行。目前本文的程式碼已經完成更新，請重新安裝程式碼即可。
- 請檢查範本中的 jQuery 版本，若版本太舊可能會讓程式無法正常執行。可搜尋範本中類似 "/jquery/?.?.?/jquery.min.js" 這樣的字串，若是 ?.?.? 的版本號小於 1.8.2 的話，請一律改為 1.8.2
更多實用工具：
大大真是太強了 剛剛才發現已經做好了 馬上來試試看
回覆刪除<1747430820685850667>(以上內容請勿刪除,從括號之後開始留言)沒有啦,這個不難～XD
回覆刪除希望能順便出像這個部落格留言一樣的按鈕教學阿
回覆刪除不然臉書留言跟部落格留言疊在一起好長阿
<3647548633848299324>(以上內容請勿刪除,從括號之後開始留言)會的，將來會發表，只不過不清楚何時能進入排程...XD
回覆刪除如果想研究的話，其實可以參考我的分頁小工具，自行將 G+、FB 留言框弄進分頁裡面，不過有難度就是了～
<6013544764506046528>(以上內容請勿刪除,從括號之後開始留言)
回覆刪除這個難度有點考倒我這個外行人了 囧
<2703023967921761218>(以上內容請勿刪除,從括號之後開始留言)哈哈～沒關係，再等我一陣子吧！
回覆刪除請問我的blogger用這個方式沒出現留言板
回覆刪除另外,在行動版上面可否也顯示??
或是跟版大您的一樣有多種選擇
http://mentor14901.blogspot.tw/
<7057725366351877620>(以上內容請勿刪除,從括號之後開始留言)[quote]我的blogger用這個方式沒出現留言板[/quote]看了你的網站，因為你啟用了「G+留言框」，他會排斥其他所有留言框，因此請到後台關閉「G+留言框」即可。若要安裝 G+ 留言框，可參考「「Google+留言框與其他留言外掛並存」
回覆刪除[quote]行動版上面可否也顯示？[/quote]請參考「Blogger 行動版範本初探」，只有選擇"自訂"行動版範本，才能在行動版顯示。
[quote]或是跟版大您的一樣有多種選擇[/quote]我的這個留言板分頁工具，目前尚未正式發布，不過過一陣子就會發佈了～你可以訂閱本站來追蹤這件事。
Wayne您好，我想請教一下，我已經改成新的程式碼了，mail也給成我的，但是還是沒有收到通知
回覆刪除不知道為什麼呢？
我附上我擷取的圖
http://i.imgur.com/1XbsbuT.png
<8895994108942546969>(以上內容請勿刪除,從括號之後開始留言)請留下你的網址，才能查看是什麼情況。另外，除了系統提供的參數修改，其餘的程式碼請不要變動，我從你的圖看到，似乎有更改了某個 email 字串？
回覆刪除<4636691628675576798>(以上內容請勿刪除,從括號之後開始留言)
回覆刪除我的網址是kivxlee.blogspot.com
留言板有出現
只是不會收到通知！
原來那個不用改是嗎？
我以為那個mail也是要改成我的XD
<4509230002600352355>(以上內容請勿刪除,從括號之後開始留言)很抱歉 kivxlee.blogspot.com 違反了本站的版權聲明，請參閱「WFU BLOG 的版權聲明及版權圖示」，你安裝「單篇文章計數器」但移除了本站的 "出處連結"，所以案件不受理。
回覆刪除<185016463839723190>(以上內容請勿刪除,從括號之後開始留言)
回覆刪除不好意思，因為一直不小心按到所以拿掉了那段，
我沒注意到這樣違反規定。
真的很抱歉，跟您說聲對不起。
已經加回去了，感謝您的付出和提供。
我是痞客邦的用戶，使用新的程式碼後，整個FB的留言版都會消失不見，連以前用的簡易版的FB留言版的APP也會消失，以前程式碼安裝完後會兩個都顯示。請問這個問題要如何解決??
回覆刪除<7701468945213883423>(以上內容請勿刪除,從括號之後開始留言)痞客邦本身有提供 FB 留言框的 app，所以必須先將官方的 app 移除，再使用本文開頭的「痞客邦安裝流程」
回覆刪除所以是要使用「痞客邦安裝流程」該篇文章裡面的代碼嗎??因為用本篇的是無法看到FB留言版的。<5780508170196270164>(以上內容請勿刪除,從括號之後開始留言)
回覆刪除<1958619532091792980>(以上內容請勿刪除,從括號之後開始留言)呵呵，我都寫在文章開頭了：「本文只針對 Blogger 的安裝流程，其他部落格請參照以下連結:
回覆刪除痞客邦安裝流程
Xuite 安裝流程」
您好，照著這篇安裝了FB留言板，自己嘗試留言按了發佈後卻出現訊息失敗，而且留言框變成灰色無法再按發佈，請問會是什麼問題呢？是ID部分錯了嗎？我後續是想安裝「幫 Blogger 安裝三種留言分頁 」這個的，請您撥空指導，非常感謝
回覆刪除http://ellin0409.blogspot.tw/2015/02/solonambiniortopad.html
<2520470365816728533>(以上內容請勿刪除,從括號之後開始留言)我在你的這篇文章留言測試了，沒什麼問題呢。看到我的 FB 測試留言後，可以將它刪除。
回覆刪除<8236941036815869389>(以上內容請勿刪除,從括號之後開始留言)
回覆刪除默默的它就能使用了.....安裝那天弄好久卻一直都出現訊息失敗，果然要有高手壓陣才可以（跟機器上要放乖乖差不多原理），感謝您啊^^
<6050244382668263569>(以上內容請勿刪除,從括號之後開始留言)不客氣，類似的說法的確其他讀者也有提過~~ XD
回覆刪除你好~我是貴網粉絲,追蹤已久.
回覆刪除請問此篇為何無法閱覽隱藏內容呢?(已加入會員)
謝謝
<2316325199101852720>(以上內容請勿刪除,從括號之後開始留言)我看沒什麼問題, 你可以檢查有沒有正確登入 FB, 也有可能是瀏覽器的問題.
回覆刪除