Cách nâng cấp Blogger Template lên Layouts v3 và Widget v2

Anh Duc Le

Đây có phải nâng cấp thẻ HTML không?

Thực ra, Blogger không thay đổi ngôn ngữ HTML (vẫn là HTML5), mà Google chỉ nâng cấp cách Blogger xử lý template thông qua các thuộc tính mới trong thẻ <html>.

Cụ thể:

Phiên bản cũ: defaultwidgetversion="1", b:layoutsVersion="2".
Phiên bản mới: defaultwidgetversion="2", b:layoutsVersion="3".

👉 Do đoạn nâng cấp này nằm trong thẻ <html>, nên nhiều người hay gọi nhầm là “nâng cấp thẻ HTML Blogger”, nhưng đúng hơn phải gọi là nâng cấp Widget & Layouts.

Vì sao nên nâng cấp?

Widget thế hệ 2: hỗ trợ nhiều tính năng mới, dễ chỉnh sửa hơn.
Layouts v3: bố cục hiện đại, tối ưu cho responsive.
SEO tốt hơn: tự động thêm lang, dir, hỗ trợ hiển thị chuẩn.
Chuẩn hóa template: sẵn sàng cho các bản update mới từ Google.

So sánh phiên bản cũ và mới

Phiên bản cũ:

<html xmlns='http://www.w3.org/1999/xhtml'
      xmlns:b='http://www.google.com/2005/gml/b'
      xmlns:data='http://www.google.com/2005/gml/data'
      xmlns:expr='http://www.google.com/2005/gml/expr'>
</html>

Phiên bản mới:

<html b:css='false' 
      b:defaultwidgetversion='2' 
      b:layoutsVersion='3' 
      b:responsive='true' 
      b:templateUrl='unPlug' 
      b:templateVersion='1.0' 
      expr:dir='data:blog.languageDirection' 
      expr:lang='data:blog.locale.language'
      xmlns='http://www.w3.org/1999/xhtml' 
      xmlns:b='http://www.google.com/2005/gml/b' 
      xmlns:data='http://www.google.com/2005/gml/data' 
      xmlns:expr='http://www.google.com/2005/gml/expr'>

    <b:attr name='xmlns' value='' />
    <b:attr name='xmlns:b' value='' />
    <b:attr name='xmlns:data' value='' />
    <b:attr name='xmlns:expr' value='' />
    <b:attr cond='data:blog.locale.language == &quot;vi&quot;' name='lang' value='vi' />
</html>

Giải thích các thuộc tính trong phiên bản mới

b:css='false' → Blogger không tự động chèn CSS mặc định, bạn tự quản lý toàn bộ CSS.
b:defaultwidgetversion='2' → Sử dụng widget thế hệ 2 với nhiều tính năng mới.
b:layoutsVersion='3' → Layouts chuẩn mới, dễ quản lý và hỗ trợ responsive.
b:responsive='true' → Kích hoạt chế độ responsive mặc định, hiển thị đẹp trên mọi thiết bị.
b:templateUrl & b:templateVersion → Thông tin định danh template để Blogger quản lý.
expr:dir='data:blog.languageDirection' → Tự động xác định hướng văn bản (LTR hoặc RTL).
expr:lang='data:blog.locale.language' → Tự động gán ngôn ngữ cho blog, tốt cho SEO.
<b:attr ... /> → Cho phép thêm/xóa thuộc tính động theo điều kiện (ví dụ: tự động thêm lang="vi" khi blog dùng tiếng Việt).

Bổ sung: Đoạn `<b:attr ... />` để xóa namespace

Trong phiên bản mặc định, Blogger thường render thẻ <html> kèm theo các namespace như sau:

<html xmlns='http://www.w3.org/1999/xhtml'
      xmlns:b='http://www.google.com/2005/gml/b'
      xmlns:data='http://www.google.com/2005/gml/data'
      xmlns:expr='http://www.google.com/2005/gml/expr'>
</html>

Tuy nhiên, bạn có thể chủ động xóa các namespace này bằng cách thêm đoạn:

<b:attr name='xmlns' value='' />
<b:attr name='xmlns:b' value='' />
<b:attr name='xmlns:data' value='' />
<b:attr name='xmlns:expr' value='' />

Tác dụng

Xóa bỏ các thuộc tính xmlns mà Blogger tự thêm.
Làm HTML gọn gàng hơn, chỉ còn lại những thuộc tính cần thiết như lang và dir.
Giúp template thuần HTML5 (HTML5 không còn yêu cầu namespace như XHTML).
Khi view-source, code nhìn sạch và chuyên nghiệp hơn.

Có cần thiết không?

Không bắt buộc: Blogger vẫn hoạt động bình thường nếu giữ nguyên các namespace mặc định.
Nên dùng khi muốn tối ưu HTML: phù hợp cho những ai thích code gọn, nhẹ, đúng chuẩn HTML5.

👉 Đây là một thủ thuật nâng cao, không phải phần mặc định của Google. Nếu bạn muốn HTML tinh gọn, có thể giữ lại đoạn <b:attr ... /> này.

Cách nâng cấp Blogger Template

Vào Blogger → Chủ đề → Chỉnh sửa HTML.
Tìm và thay thế thẻ <html ...> cũ bằng đoạn HTML mới.
Kiểm tra lại toàn bộ CSS, JS, widget để đảm bảo tương thích.
Lưu thay đổi.
Thử nghiệm giao diện trên cả desktop và mobile.

Kết luận

Việc nâng cấp Blogger Template lên Layouts v3 + Widgets v2 giúp:

Giao diện hiện đại, chạy mượt trên mọi thiết bị.
Tối ưu SEO, dễ dàng index hơn.
Quản lý widget & bố cục tiện lợi hơn.

👉 Đây là bước nên làm ngay nếu bạn muốn blog của mình chuyên nghiệp và sẵn sàng cho các bản cập nhật từ Google.