
好久沒有發文了,今天來寫寫一些版面變化的小技巧,如果您是利用嵌入式留言欄(comment form)的可以參考看看。
留言以往綸太郎都是採用彈出視窗的方式來留言,這回改變用嵌入式留言欄,感覺版面很單調,就來做點變化,你可以改變底色,或是自行設計美美或配合你版面的風格來變化,或許會讓訪客有興趣來主動留言,或是加強留言單元,提高與網友的互動。
怎麼做呢,我們只要增加一個定義即可。
以下是淺藍色底的留言欄,

版面配置→修改Html,然後在CSS區新增一個定義(放在]]></b:skin>之前即可)
/*嵌入式意見欄的外觀設計*/
.comment-form {
display: block;
max-width: 540px; /*背景寬度*/
padding: 5px;
font-size: 8pt;
margin-bottom: 5px;
border: dotted 1px #85b1de; /*邊框款式及顏色*/
background-color: #EDF2F7; /*背景顏色*/
}
如果要用背景圖,那就把最後一個background-color改成
background: #EDF2F7 url('你的背景圖片') no-repeat ;
即可。

這樣你就可以擁有一個不一樣的留言欄位了。
如果想調整留言欄的高度,可以參考這篇
修改嵌入式留言欄的寬度,將height設成你想要的高度,背景圖片就比較容易配合設計了。