Thẻ này trong chuẩn hóa HTML5 nó chỉ gây ra 1 lỗi nhưng blog của bạn load rất kém khi có 1 đống js và link mặc định của blogger chặn ngay đầu template.
Chắc nhiều bạn từng mò mẫm view soude (xem code) thì nhận thấy rằng phần đầu trong mẫu khi xem mã nguồn blogger(blogspot) thường có đặc trưng đoạn javascript khá lằng nhằng và rườm già.
Tất nhiên mọi thứ như thế đều có lý do riêng, nhưng không phải ai cũng cần đến thế,nhất là sự hiện diện của js và 2 link stylesheet phía cuối
Vậy head trong mẫu tại sao lại có phần vừa nói ở trên,lý do là từ thẻ:
<b:include data='blog' name='all-head-content'/>
Lưu ý:
Muốn thực hiện thủ thuât này thì bạn cũng cần làm chủ được CSS của blog mình còn không thì không nên áp dụng.
Thẻ <b:include data='blog' name='all-head-content'/>
Có tác dụng tự động khai báo cho ta khi ta tạo lập blog.Xóa bỏ nó đi rồi thì chính ta lại phải khai báo những gì blogger đã làm hộ,việc này là hoàn toàn có thể.
áp dụng vào blogspot
Công việc đầu tiên cần làm là bạn vào Thiết kế ⇒ Cài đặt ⇒ Tùy chọn tìm kiếm và bật thẻ meta rồi điền mô tả blog vào như hình
Tiếp theo vào chỉnh sửa mẫu thay thế toàn bộ code phần đầu từ dòng đầu tiên đến tận ngay trước <b:skin> <![CDATA[ .... bằng dãy code sau:
<!DOCTYPE html>
<html>
<head>
<meta charset='UTF-8'/>
<meta content='width=device-width,initial-scale=1.0,maximum-scale=1.0' name='viewport'/>
<b:if cond='data:blog.pageTitle == data:blog.title'>
<title>
<data:blog.title/>
</title>
<b:else/>
<title>
<data:blog.pageName/>
|
<data:blog.title/>
</title>
</b:if>
<b:if cond='data:blog.metaDescription != ""'>
<meta expr:content='data:blog.metaDescription' name='description'/>
</b:if>
<b:if cond='data:blog.pageType == "index"'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<meta expr:content='data:blog.title' name='keywords'/>
<meta content='index, follow' name='robots'/>
<link expr:href='data:blog.canonicalHomepageUrl' rel='canonical'/>
</b:if>
<b:else/>
<b:if cond='data:blog.pageTitle != data:blog.title'>
<meta expr:content='data:blog.pageName' name='keywords'/>
<meta content='index, follow' name='robots'/>
<link expr:href='data:blog.canonicalUrl' rel='canonical'/>
</b:if>
</b:if>
<link expr:href='data:blog.homepageUrl + "favicon.ico"' rel='icon' type='image/x-icon'/>
<link expr:href='data:blog.homepageUrl + "feeds/posts/default"' expr:title='data:blog.title + " - Atom"' rel='alternate' type='application/atom+xml'/>
<link expr:href='data:blog.homepageUrl + "feeds/posts/default?alt=rss"' expr:title='data:blog.title + " - RSS"' rel='alternate' type='application/rss+xml'/>
<link expr:href='"http://www.blogger.com/feeds/" + data:blog.blogId + "/posts/default"' expr:title='data:blog.title + " - Atom"' rel='alternate' type='application/atom+xml'/>
- Đoạn bôi màu vàng cam chính là phần lấy mô tả blog khi xem mã nguồn ở trang chủ và là các mô tả tìm kiếm cho bài viết bạn đã bỏ vào mô tả tìm kiếm khi viết bài khi xem mã nguồn ở trang bài viết.<html>
<head>
<meta charset='UTF-8'/>
<meta content='width=device-width,initial-scale=1.0,maximum-scale=1.0' name='viewport'/>
<b:if cond='data:blog.pageTitle == data:blog.title'>
<title>
<data:blog.title/>
</title>
<b:else/>
<title>
<data:blog.pageName/>
|
<data:blog.title/>
</title>
</b:if>
<b:if cond='data:blog.metaDescription != ""'>
<meta expr:content='data:blog.metaDescription' name='description'/>
</b:if>
<b:if cond='data:blog.pageType == "index"'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<meta expr:content='data:blog.title' name='keywords'/>
<meta content='index, follow' name='robots'/>
<link expr:href='data:blog.canonicalHomepageUrl' rel='canonical'/>
</b:if>
<b:else/>
<b:if cond='data:blog.pageTitle != data:blog.title'>
<meta expr:content='data:blog.pageName' name='keywords'/>
<meta content='index, follow' name='robots'/>
<link expr:href='data:blog.canonicalUrl' rel='canonical'/>
</b:if>
</b:if>
<link expr:href='data:blog.homepageUrl + "favicon.ico"' rel='icon' type='image/x-icon'/>
<link expr:href='data:blog.homepageUrl + "feeds/posts/default"' expr:title='data:blog.title + " - Atom"' rel='alternate' type='application/atom+xml'/>
<link expr:href='data:blog.homepageUrl + "feeds/posts/default?alt=rss"' expr:title='data:blog.title + " - RSS"' rel='alternate' type='application/rss+xml'/>
<link expr:href='"http://www.blogger.com/feeds/" + data:blog.blogId + "/posts/default"' expr:title='data:blog.title + " - Atom"' rel='alternate' type='application/atom+xml'/>
- Với code này tại trang chủ keywords là tiêu đề blogspot và trang bài viết là tiêu đề bài viết.
Nếu bạn muốn tại trang chủ từ khóa là những từ bạn tự thêm vào thì đổi đoạn màu vàng như dưới
<meta expr:content='data:blog.title' name='keywords'/>
Thành:<meta content='Ghi từ khóa vào đây' name='keywords'/>
Bạn có thể bổ sung thêm một số link nữa nhưng các link đó không được chuẩn HTML5 khuyến khích.Đối với blogspot vẫn dùng mẫu Mobile mặc định của blogger thì dòng
<meta content='width=device-width,initial-scale=1.0,maximum-scale=1.0' name='viewport'/>
Thay bằng:<b:if cond='data:blog.isMobile'>
<meta content='width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0' name='viewport'/>
<b:else/>
<meta content='width=1100' name='viewport'/>
</b:if>
Về vấn đề loại bỏ thẻ này có nhiều quan điểm khác nhau nên các bạn cứ coi đây là vấn đề tham khảo,không khuyến khích dùng.<meta content='width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0' name='viewport'/>
<b:else/>
<meta content='width=1100' name='viewport'/>
</b:if>
Thực ra bạn để thẻ đó cũng chẳng sao cả, nhưng site bạn khó mà đạt chuẩn với chuẩn HTML5 với một đống link mặc định của blogger ( blogspot ) và cả đoạn javaScript trên nữa.
Kiểm tra chuẩn HTML5 ở ĐÂY
Code này đã chỉnh sửa để tránh lỗi thể tiêu đề và mô tả meta trùng lặp ?m=0