公告版位

跟 Blogger 舊範本時代的官方留言系統比起來,新範本的串聯式留言全部由 javascript 產生,讓習慣改 Blogger 範本的使用者難以下手 hack。不過對於熟悉 CSS 的使用者,想把串聯式留言的界面改漂亮一點,倒也不是難事。

本篇為 WFU 的修改紀錄,不一定能含括所有串聯式留言區塊。不過對 CSS 熟悉的讀者,可以參考這篇紀錄的概念,為留言區塊新增功能(留言編號)、或把版面改成心目中滿意的樣式。



一、樣式效果圖


1. 舊版本畫面

下圖是本站舊範本的官方留言樣式(非串聯式留言)──



大致有幾個特色:

  • 讀者留言有留言編號站長回覆不使用留言編號
  • 讀者留言區塊與站長留言區塊的底色不同,藉以區別留言者身份
  • 每則留言的寬度一致


WFU 的目標,就是將串聯式留言的樣式,想辦法維持以上的特色,以期讓網站的留言區塊風格一致。


2. 舊版本畫面

下圖是本站修改後的串聯式留言樣式──



雖然新版頭像區塊的底色無法修改、留言時間的位置光靠 CSS 不容易調整到比較滿意的地方,不過已經盡量維持樣式接近舊版本,本文之後的修改效果,就請參照上面這張效果圖。

另外需要提的一點是,國外的留言編號教學,在回覆留言的部份也會加上編號,例如 1-1、1-2、1-3,或 1-a、1-b、1-c,這樣的形式。由於個人不太喜歡這樣的設計,因此未針對此點修改。

全文已移往WFU BLOG 主站,請點:「Blogger 串聯式留言(threaded comment)__留言編號及自訂版面樣式實作

創作者介紹

WFU BLOG

Wayne Fu 發表在 痞客邦 PIXNET 留言(7) 人氣()


留言列表 (7)

發表留言
  • Mark X
  • 我也覺得留言編號單純一點的好。不過我的留言少,省下功夫。
  • Wayne Fu
  • 是啊,編號還有小數點的話,看了不太舒服~
    不過 mark 不要謙虛啊,留言明明比我多...XD
  • Mark X
  • 那是我厚著臉皮硬要訪客索取密碼,不然平常的帖子是很「安靜」的。哈哈!
  • 楠晞
  • 你好
    那請問你可以幫我看一下嗎??
    我在82樓以後,就沒有編號了,以下的格式雖然和修改後的類似,但還是少了編號,而且在回覆的中文也改成Replies,此外最讓人麻煩的就是原本的"匿名"變成Anonymous,中文改英文還好(當然還是中文好@@),最奇怪的是為什麼沒有留言編號了......
    謝謝回覆
  • Wayne Fu
  • 謝謝回報,看了你的網頁後,才發現原來超過兩百則留言後,新範本的 Blogger 會出現「載入更多」這樣的按鈕。本文寫的工具並不知道這樣的情形,所以無法處理按下「載入更多」按鈕後的狀況。

    由於本站目前還沒有同樣的狀況(新範本超過200個留言)可參考,因此無法知道如何修改本文的程式碼,只能等某天出現這樣的狀況時,才有辦法處理。

    目前只好建議你參考「<a href="http://www.wfublog.com/2014/08/blogger-more-than-200-comments.html" rel="nofollow">Blogger 留言超過 200 篇怎麼處理?</a>」,對於留言板性質的文章,當留言超過 200 個以後,另開一篇新文章來容納新留言了。
  • 楠晞
  • 謝謝你的回覆~~~~謝謝
找更多相關文章與討論