Hiển Thị Bài Viết Liên Quan Trên Blogspot Theo Nhãn Và Từ Khóa Tiêu Đề – Hướng Dẫn Tự Động Tăng Tương Tác Và SEO

Bạn là chủ blog trên nền tảng Blogspot và muốn giữ chân người đọc lâu hơn, tăng tương tác, đồng thời cải thiện SEO? Một trong những cách đơn giản và hiệu quả là hiển thị các bài viết liên quan ngay dưới mỗi bài viết hoặc ở bất kỳ vị trí nào bạn muốn.

Trong bài viết này, mình sẽ chia sẻ với bạn một đoạn mã JavaScript tự động lấy các bài viết trong một nhãn cụ thể, đồng thời lọc thêm theo từ khóa trong tiêu đề, rồi hiển thị tối đa 5 bài thỏa mãn điều kiện. Bạn không cần cập nhật thủ công, tất cả đều tự động vận hành!

1. Vì sao nên hiển thị bài viết liên quan theo nhãn và từ khóa tiêu đề?

Tăng thời gian đọc trên blog: Khi bạn giới thiệu được các bài viết cùng chủ đề hoặc liên quan, người đọc sẽ ở lại lâu hơn, giảm tỉ lệ thoát.
Cải thiện SEO nội bộ: Các liên kết nội bộ giúp công cụ tìm kiếm hiểu rõ hơn cấu trúc blog, nâng cao thứ hạng bài viết.
Tự động hóa dễ dàng: Bạn không cần mất công tìm và chèn liên kết thủ công cho từng bài viết.
Tối ưu trải nghiệm người dùng: Người đọc dễ dàng tiếp cận các nội dung họ quan tâm.

2. Đoạn mã JavaScript lấy bài viết theo nhãn và lọc tiêu đề

Dưới đây là đoạn mã bạn chỉ cần chèn vào blog ở vị trí mong muốn (chế độ HTML), rồi thay đổi 2 tham số chính:

labelName: Tên nhãn bài viết trên blog của bạn (ví dụ: "toán 8", "lập trình", "du lịch").
keyword: Từ khóa bạn muốn lọc trong tiêu đề bài viết (ví dụ: "điện", "học", "react").

<div id="filtered-posts"> <p>Đang tải bài viết...</p> </div> <script>

var labelName = "toán 8"; // Thay tên nhãn bạn muốn lấy bài

var keyword = "xxx"; // Thay từ khóa cần lọc trong tiêu đề

var maxPosts = 5; // Số bài tối đa hiển thị

var labelUrl = encodeURIComponent(labelName.trim());

var feedUrl = `https://buicongthang.blogspot.com/feeds/posts/default/-/${labelUrl}?alt=json-in-script&callback=processFeed&max-results=50`; function processFeed(json) { var entries = json.feed.entry || []; var filtered = []; for (var i = 0; i < entries.length && filtered.length < maxPosts; i++) { var title = entries[i].title.$t.toLowerCase(); if (title.includes(keyword.toLowerCase())) { filtered.push(entries[i]); } } var html = ""; if (filtered.length > 0) { html += "<ul>"; filtered.forEach(function(post) { var title = post.title.$t; var link = ""; for (var j = 0; j < post.link.length; j++) { if (post.link[j].rel === "alternate") { link = post.link[j].href; break; } } html += `<li><a href="${link}">${title}</a></li>`; }); html += "</ul>"; } else { html = `<p>Không tìm thấy bài viết nào trong nhãn "${labelName}" chứa từ khóa "${keyword}".</p>`; } document.getElementById("filtered-posts").innerHTML = html; } document.write(`<script src="${feedUrl}"><\/script>`); </script>

3. Hướng dẫn sử dụng chi tiết

Bước 1: Xác định nhãn (label) và từ khóa

Trên Blogspot, mỗi bài viết bạn có thể gắn một hoặc nhiều nhãn.
Ví dụ, nếu bạn có nhãn "toán 8", bạn gõ chính xác tên này vào biến labelName.
keyword là từ khóa bạn muốn lọc trong tiêu đề bài viết, ví dụ "điện", "đa thức"…

Bước 2: Chèn đoạn mã vào blog

Mở trình soạn thảo bài viết hoặc widget HTML/JavaScript trong phần bố cục.
Dán nguyên đoạn mã trên vào vị trí bạn muốn hiển thị danh sách bài viết liên quan.
Chuyển sang chế độ HTML để dán mã cho chính xác.

Bước 3: Lưu lại và kiểm tra kết quả

Tải lại trang blog, bạn sẽ thấy danh sách bài viết liên quan hiển thị tự động theo nhãn và lọc tiêu đề.
Nếu không thấy bài viết nào, kiểm tra lại tên nhãn và từ khóa bạn đã đặt đúng chưa.

4. Lợi ích khi áp dụng đoạn mã này cho blog của bạn

Tiết kiệm thời gian: Tự động cập nhật bài viết liên quan, không phải làm thủ công.
Tăng trải nghiệm người dùng: Người đọc dễ dàng tìm thấy các bài viết thú vị liên quan.
Tối ưu SEO: Các liên kết nội bộ chất lượng giúp tăng thứ hạng trên Google.
Phù hợp với blog cá nhân và chuyên nghiệp: Đoạn mã thuần JavaScript, dễ dàng tích hợp.

5. Một số lưu ý và mẹo nhỏ

Đảm bảo nhãn bạn chọn thực sự có bài viết gắn nhãn đó.
Từ khóa lọc trong tiêu đề nên chọn các từ phổ biến trong nội dung bạn muốn tập trung.
Bạn có thể thay đổi maxPosts để hiển thị nhiều hoặc ít bài hơn.
Nếu blog bạn có nhiều bài viết, bạn có thể tăng max-results trong URL feed lên 100 để lấy nhiều dữ liệu hơn.
Đoạn mã không yêu cầu thư viện ngoài như jQuery, giúp trang tải nhanh hơn.

6. Kết luận

Với đoạn mã trên, bạn dễ dàng tạo ra một widget bài viết liên quan thông minh, tự động lọc theo nhãn và từ khóa tiêu đề, giúp tăng tương tác, giữ chân độc giả lâu hơn và cải thiện SEO cho blog Blogspot của bạn.

Nếu bạn gặp khó khăn trong quá trình sử dụng hoặc muốn nâng cấp thêm tính năng như hiển thị ảnh đại diện, ngày đăng, hoặc lọc nhiều nhãn cùng lúc, đừng ngần ngại để lại bình luận. Mình sẽ hỗ trợ bạn tận tình!

Chúc bạn thành công với blog của mình!

Nếu bạn cần, mình có thể viết thêm bài hướng dẫn nâng cao hoặc tạo video demo cụ thể.

Tìm kiếm Blog này

Sổ tay Blogger