Cách tối ưu các thẻ cho blogspot

• Các bạn copy code HTML template của Blog về máy để phòng trường hợp lỗi trong quá trình thực hiện.
• Download Notepad++ về cài đặt để khi cần xem code HTML trực tiếp trên máy tính sẽ dễ dàng hơn.

- Đăng nhập vào trang quản trị Blog --> Mẫu --> Chỉnh sửa HTML. Click vào dòng bất kỳ của màn hình code HTML xuất hiện và nhấn Ctl+F để tìm đến dòng code: <b:if cond='data:post.title'>

- Thay thế toàn bộ đoạn code sau:

<b:if cond='data:post.title'>
<h3 class='post-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link' expr:title='data:post.title'><data:post.title/></a>
<b:else/>
<b:if cond='data:blog.pageType != "item"'>
<a expr:href='data:post.url' expr:title='data:post.title'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h3>
</b:if>

- Thành đoạn code HTML:

<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:post.title'>
<h3 class='post-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link' expr:title='data:post.title'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url' expr:title='data:post.title'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h3>
</b:if>
<b:else/>
<h1 class='post-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link' expr:title='data:post.title'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</h1>
</b:if>
<b:else/>
<h1 class='post-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link' expr:title='data:post.title'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</h1>
</b:if>

Bước 2: Chỉnh sửa CSS cho thẻ <h1>  tiêu đề bài viết

CSS là kết quả thể hiện interface như màu chữ, cỡ chữ, font chữ... 

- Tìm các đoạn code sau

.post h3 {…}
.post h3 a, .post h3 a:visited {…}
.post h3 a:hover {…}

- Và sửa tương ứng thành:

.post h1, .post h3 {…}
.post h1 a, .post h1 a:visited, .post h3 a, .post h3 a:visited {…}
.post h1 a:hover, .post h3 a:hover {…}

Bước 3: Chuyển tiêu đề blog từ H1 sang H2 hoặc H3

Sau khi thực hiện xong 2 bước trên, blog của bạn sẽ bị 2 thẻ H1 cho một trang. Vì vậy cần thực hiện các bước sau để chỉnh tiêu đề blog từ thẻ H1 như mặc định về thẻ H2 hoặc H3.

- Bạn tìm các đoạn code sau: sửa chữ H1 thành H2 

<h1 class='title'

- Bạn tìm các đoạn CSS có dạng như sau và chữ H1 thành H2

#header h1 {...}

#header h1 a, #header h1 a:visited {...}

Chia sẻ cho bạn bè