Header trong blogpost (cắt thành 2 phần)

Giúp độc giả dễ dàng quay về trang chủ hoặc tìm kiếm các chuyên mục khác. Bạn có thể tối ưu giao diện nếu thấy cần thiết phải chia thì chỉ cần vài bước để làm như sau:

1. Đăng nhập vào Blogger.

2. Design\ Edit HTML\proceed
đánh Ctrl-F tìm code sau: <b:section class='header'
Khi đó nó sẽ hiện ra đoạn code như sau

<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>

<b:widget id='Header1' locked='true' title='trang của ta(Header)' type='Header'/>

</b:section>

thay thế nó bằng code sau, nhớ kiểm tra title bla bla bla...thay bằng của mình

<b:section class='header' id='header-left' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='bla bla bla (Header)' type='Header'/>
</b:section>
<b:section class='header' id='header-right' maxwidgets='1' showaddelement='yes'/>

Tiếp tục tìm code : header-outer

Sau khi tìm nó sẽ hiện ra đoạn code :

.header-outer {

background: $(header.background.color) $(header.background.gradient) repeat-x scroll top left;

_background-image: none;

color: $(header.text.color);

-moz-border-radius: $(header.border.radius);

-webkit-border-radius: $(header.border.radius);

-goog-ms-border-radius: $(header.border.radius);

border-radius: $(header.border.radius);

}

thay thế nó bằng code sau

.header-outer {
background: $(header.background.color) $(header.background.gradient) repeat-x scroll 0 -400px;
_background-image: none;
height: 100px;
overflow: hidden;
}
#header-left{
width: 350px;
float: $startSide;
overflow: hidden;
}
#header-right{
width: 468px;
float: $endSide;
overflow: hidden;
}
.tabs-outer{
clear: both;
}

Thay đổi giá trị trong height bằng số mình muốn lưu lại là xong.

Bài viết khác: