Bạn đang xây dựng blog bằng Blogspot và muốn tối ưu SEO? Một trong những yếu tố quan trọng giúp Google và người dùng dễ dàng tìm thấy nội dung trên blog chính là Sitemap (sơ đồ trang). Trong bài viết này, mình sẽ hướng dẫn bạn cách tạo sitemap cho Blogspot mới nhất 2025 bằng code tùy chỉnh, kèm giải thích chi tiết về lợi ích của sitemap.
Sitemap là gì và tại sao Blogspot cần có Sitemap?
Sitemap là sơ đồ trang web, giúp:
-
Google index nhanh hơn: Sitemap cung cấp cho Google danh sách toàn bộ bài viết trên blog, từ đó bot có thể thu thập dữ liệu nhanh chóng.
-
Cải thiện SEO: Khi sitemap đầy đủ và được cập nhật, nội dung mới sẽ có cơ hội lên top Google nhanh hơn.
-
Hỗ trợ người đọc: Ngoài công cụ tìm kiếm, sitemap cũng là nơi để độc giả dễ dàng xem toàn bộ bài viết theo nhãn (category).
-
Tối ưu trải nghiệm người dùng (UX): Bố cục sitemap rõ ràng giúp blog chuyên nghiệp và dễ điều hướng hơn.
Tóm lại, có sitemap = tăng SEO + tăng trải nghiệm người đọc.
Code Tạo Sitemap Cho Blogspot Mới Nhất 2025
Dưới đây là code sitemap động cho Blogspot. Nó sẽ tự động lấy bài viết từ nguồn feed và hiển thị theo từng nhãn (category).
Việc tạo sitemap cho Blogspot theo cách này thực sự rất đơn giản và tiện lợi. Bạn chỉ cần sao chép một đoạn code duy nhất và dán vào trang, không cần phải tùy chỉnh phức tạp hay hiểu biết sâu về lập trình. Giao diện sitemap hiển thị cũng rất trực quan, gọn gàng và đẹp mắt, giúp người đọc dễ dàng tìm kiếm nội dung. Đây là giải pháp cực kỳ phù hợp cho những bạn mới bắt đầu xây dựng Blogspot hoặc chưa có nhiều kiến thức về code nhưng vẫn muốn blog của mình chuyên nghiệp và tối ưu SEO.
Bạn chỉ cần tạo một Trang mới (Page) trên Blogspot, chuyển sang chế độ HTML rồi dán đoạn code dưới đây:
[[no_toc]<style>
#sitemap h2 {
text-align: center;
font-size: 28px;
margin-bottom: 30px;
font-weight: bold;
}
.sitemap-label {
margin: 20px 0;
padding: 15px;
background: #f7f7f7;
border-left: 5px solid #4CAF50;
border-radius: 6px;
}
.sitemap-label h3 {
margin: 0 0 10px;
font-size: 22px;
color: #333;
}
.sitemap-post {
border: 1px solid #ddd;
border-radius: 5px;
margin-bottom: 10px;
padding: 10px 15px;
background: #fff;
transition: all 0.2s ease;
}
.sitemap-post:hover {
box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}
.sitemap-post a {
font-weight: 600;
font-size: 17px;
color: #2c3e50;
text-decoration: none;
}
.sitemap-meta {
font-size: 13px;
color: #666;
margin-top: 4px;
}
</style>
<h2>Sitemap - Sơ đồ nội dung trang</h2>
<div id="sitemap-container">Đang tải danh sách bài viết...</div>
<script type="text/javascript">
function loadSitemap(json) {
var container = document.getElementById("sitemap-container");
container.innerHTML = "";
var labels = {};
for (var i = 0; i < json.feed.entry.length; i++) {
var entry = json.feed.entry[i];
var title = entry.title.$t;
var link = entry.link.find(l => l.rel === "alternate").href;
var date = new Date(entry.published.$t);
var dateStr = date.toLocaleDateString('vi-VN');
var label = (entry.category && entry.category.length > 0) ? entry.category[0].term : "Khác";
if (!labels[label]) labels[label] = [];
labels[label].push({ title, link, dateStr, label });
}
for (var lbl in labels) {
var labelHTML = `
<div class="sitemap-label">
<h3>📂 ${lbl}</h3>
${labels[lbl].map(p => `
<div class="sitemap-post">
<a href="${p.link}" target="_blank">${p.title}</a>
<div class="sitemap-meta">🕒 ${p.dateStr} | 🏷️ Nhãn: ${p.label}</div>
</div>
`).join('')}
</div>`;
container.innerHTML += labelHTML;
}
}
</script>
<script src="https://www.clashofclansviet.com/feeds/posts/default?alt=json-in-script&callback=loadSitemap&max-results=500"></script>]
Đừng quên thay domain feed trong dòng script cuối bằng link blog của bạn.
[post_ads]
Lưu ý khi tạo Sitemap cho Blogspot
-
Luôn nhập đúng link blog trong phần
srccủa script. -
Nên đặt sitemap ở một trang riêng, ví dụ:
yourblog.com/p/sitemap.html. -
Tối ưu số lượng bài viết (nên để
max-results=500hoặc nhiều hơn tùy nhu cầu). -
Thường xuyên kiểm tra sitemap sau khi thêm bài viết mới để đảm bảo hiển thị đầy đủ.
Kết luận
Việc tạo sitemap cho Blogspot mới nhất 2025 là bước quan trọng trong quá trình SEO. Nó không chỉ giúp Google index nội dung nhanh hơn, mà còn mang lại trải nghiệm tốt hơn cho người đọc.
Hãy áp dụng code sitemap động ở trên để blog của bạn trở nên chuyên nghiệp, dễ sử dụng và thân thiện với SEO. Nếu bạn thấy hướng dẫn này hữu ích, hãy chia sẻ cho bạn bè cùng làm Blogspot nhé!
.png)
COMMENTS