Khi đề cấp đến tiện ích các bài viết ngẫu nhiên random posts widget là nghĩ ngay đến phương pháp get url nguồn cấp lấy dữ liệu hiển thị. Nếu dùng phương pháp get này rất chậm và code lại dài dòng, thay vào đó chuyển qua phương pháp get url trực tiếp của blog vì ưu điểm thời gian get nhanh, không lệ thuộc vào nguồn cấp và code cũng gọn hơn.
Tuy nhiên nhược điểm của phương pháp này cần tìm kiếm element chính của mỗi post cụ thể khi get url tìm class chính của mỗi post.
 |
| Hình minh họa các post có class ".post" hiển thị trong widget Blog |
Một điểm rất quan trọng cần lưu ý khi sử dụng phương pháp này đó là các bài đăng bắt buộc phải có thẻ ngắt nhảy "<!--more-->" thì khi get url mới lấy được tổng số post chính xác. Cho nên nếu Blog bạn đã có có thẻ ngắt nhảy "<!--more-->" của mỗi bài đăng thì hãy làm còn không nếu vẫn áp dụng phải sửa lại bài đăng thêm dấu ngắt nhảy bên dưới vài dòng mở đầu bài đăng.
Phương pháp thực hiện cũng đơn giản thôi, thêm mới một widget HTML/JavaScript trong Bố cục tiện ích và chèn code script trong nội dung của tiện ích là xong, lưu ý theme cần có thư viện link jquery đề sử dụng phương pháp get ajax.
<script>
$.get('/search?max-results=200', function(e) { // Thay 200 bằng số post tối đa cần get
var a = $(e).find('.Blog .post'), // element của post
p = ''
if (a.length) {
var b = a.length,
n = [],
r = 10, // Số bài hiển thị
c = document.querySelector('#HTML1>.widget-content') // Thay HTML1 bằng id của tiện ích
if (a.length < r) r = a.length
for (var i = 0; i < r; i++) {
n.push(Math.floor(Math.random() * b))
}
n.forEach(function(i) {
p += '<article class="post">'
p += $(a[i]).html()
p += '</article>'
c.innerHTML = p
})
}
})
</script>
Hình minh họa
