Cách tối ưu thẻ H1 cho bài viết Blogspot


Tối ưu thẻ H1 cho bài viết là việc chuyển tiêu đề của bài viết thành thẻ H1 và chỉnh tiêu đề của blogspot thành thẻ H2 hoặc H3. Điều này sẽ giúp cho bài viết của bạn được tối ưu với các máy tìm kiếm (SEO). Đây cũng là bước đầu tiên trong quy trình SEO cơ bản cho website / Blog của bạn. 

Các template miễn phí của Blogspot đều được design tiêu đề bài viết ở thẻ H3 và tiêu đề blog ở thẻ H1. Để đảm bảo mỗi trang trong Blog của bạn chỉ có 1 thẻ H1, H2 riêng, các bạn cần thực hiện các bước sau:

Chú ý: 
  • 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.


Bước 1: Chỉnh tiêu đề bài viết về thẻ H1

- Đă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'>
Cách tối ưu thể h1 cho bài viết

- 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 {…}
Các tối ưu thẻ h1, chỉnh CSS cho Blogspot

- 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'
Cách chỉnh tiêu đề blogspot thành thẻ h2,h3


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 {...}

Lưu ý:

  • Mỗi template blogspot sẽ có code khác nhau nhưng các đoạn chỉnh sửa trên là gần như nhau.
  • Sau mỗi bước chỉnh sửa phải tiến hành Lưu mẫu và xem kết quả thể hiện bên ngoài
Quá đơn giản phải không nào! Các bạn đã hoàn thành các việc tối ưu cho tiêu đề bài viết trang blogspot của mình.

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

Nhận xét