Remove Header và thay thế bằng Ảnh

Có nhiều cách khác nhau để trang trí, chỉnh sửa Header của blog, và đây là một trong những cách đó. Thủ thuật này rất cơ bản và đơn giản, thích hợp cho những bạn mới bắt đầu làm quen với việc chỉnh sửa giao diện của blogspot.

Hình ảnh minh họa:

trước khi thực hiện thủ thuật

sau khi thực hiện thủ thuật

Với thủ thuật này, ta sẽ có 2 bước thực hiện : bước 1 là làm ẩn header, bước 2 thay thế vùng header đã bị ẩn bằng 1 ảnh (banner)

☼ Bước 1: Ẩn header
1. Đăng nhập blog
2. Vào bố cục (Layout)
3. Vào chỉnh sửa code HTML (edit code HTML)
4. Chọn mở rộng mẫu tiện (expand widget template)
5. Tìm đọan code CSS của header như bên dưới (hoặc code tương tự)

#header-wrapper {
width:700px;
margin:0 auto 10px;
border:1px solid $bordercolor;
}

6. Thêm dòng code màu đỏ như bên dưới:

#header-wrapper {
width:700px;
margin:0 auto 10px;
border:1px solid $bordercolor;
display:none;
}

7. Khoan save template lại, tiếp tục thực hiện sang bước 2

☼ Bước 2: Thay thế header đã bị ẩn bằng 1 ảnh (banner)
1. Tiếp tục bước 1, xuống phía dưới, tìm đọan code sau:

<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='2' showaddelement='yes'>
<b:widget id='Header' locked='true' title='Blog FD Tips For Blogger' type='Header'/>
</b:section>
</div>

2. Thêm vào sau đọan code vừa tìm được đọan code bên dưới:

<a href="URL_OF_YOUR_BLOG"><img src="URL_OF_IMAGE(BANNER)" alt="Home" /></a>

3. Save template.

Chúc các bạn thành công!

Remove Header và thay thế bằng Ảnh