23 2月 2013

Blogger Design Notes

很快的來記錄一下今天對Blogger Template的修改;

1. 首先修改最上方的標題和敘述(description), 找到HTML的Header section, 修改以下兩個項目:
.header-inner .Header .titlewrapper {
  padding: 0px $(header.padding);
}

.header-inner .Header .descriptionwrapper {
  padding: 0 $(header.padding);
  position: relative;
  top: -15px;
  /*left: 440px;*/
}
2.再來是將每篇post上方的日期icon和標題, 更改為置中:
/* Headings
----------------------------------------------- */
h2 {
  margin: 0em 0 2em 0;
  font: $(widget.title.font);
  color: $(widget.title.text.color);
  text-transform: uppercase;
  text-align:center; /* casper added */
}
h3.post-title, .comments h4 {
  font: $(post.title.font);
  margin: 0em 0 0;
  text-align: center;
}
3.調整sidebar與post clolumn的間距:
.sidebar {
font-family: verdana;
font-size:1.1em;
padding-left: 40px;
}
另外就是增加了幾個小的CSS class for description texts,
重新加回syntax highlighter and configure the theme to "midnight",

Template哪天一不小心就被reset, 寫篇紀錄才可以恆久遠。

沒有留言:

張貼留言