Phương pháo tạo widget hiển thị các bài viết mới nhất hoặc ngẫu nhiên cùng tác giả từ nguồn cấp feed bên dưới mỗi bài đăng trong Blog
Bên dưới mỗi bài đăng trong Blog tại trang bài viết vẫn thường hiển thị các bài viết theo nhãn liên quan đến bài đang đọc hay chúng ta vẫn thường gọi loại này là related posts. Nếu trong blog có từ 2 tác giả đăng bài vậy tại sao chúng ta không xây dựng thêm widget hiển thị các bài viết phía trên hoặc ngay dưới các bài viết liên quan? Ý tưởng hay đấy chứ phải không các bạn?
Đề xuất cho bạn: Làm thế nào để tối ưu trang tải nhanh khi tải URL nguồn cấp?
 |
| widget hiển thị các bài viết cùng tác giả bên dưới các bài viết liên quan |
Thật ra không nhất thiết bạn phải đặt widget hiển thị các bài viết cùng tác giả bên dưới mỗi bài đăng mà bạn có thể đặt widget bên sidebar cũng được quan trọng là bạn sẽ viết code như thế nào thôi. Trước hết mình mô tả các làm như sau:
- Sử dụng URL nguồn cấp dạng tóm tắt (summary) giới hạn 150 posts được xuất bản mới nhất
- Từ URL nguồn cấp này tạo bộ chọn array lọc lấy những post có số thứ tự và những post này có cùng tác giả với bài đang đọc.
- Tiếp tục tạo bộ chọn array từ bộ lọc ở trên để lọc lấy số posts cụ thể theo dạng recent hoặc random tùy theo nhu cầu.
- Từ mỗi số post ráp vào một URL nguồn cấp đề get tạo và append nội dung từ URL nguồn cấp
Bây giờ chúng ta xẽ xây dựng code theo các yêu cầu ở trên
<script>//<![CDATA[
$.get('/feeds/posts/summary?alt=json&max-results=150',function(data){
if(data.feed.entry){
var a=$('.post-author>a').attr('title'), // element hiển thị tên tác giả trong bài đăng
b=[],
c=10, // Số posts hiển thị trong widget
d=[]
for(var e=1;e<data.feed.entry.length;e++){
if('author' in data.feed.entry[e]){
for(var i=0;i<entry.author.length;i++){
if(entry.author[i].name.$t==a)b.push(e)
}
}
}
// Nếu lọc lấy theo recent
if(b.length>c)b.length=c
d=b
// Nếu lọc lấy theo random
do{let num=Math.floor(Math.random()*b.length)
d.push(num)
d=d.filter((x,y)=>{return d.indexOf(x)===y})
}while(d.length<c)
// Lưu ý chỉ chọn 1 trong 2 hoặc recent hoặc random
d.forEach(function(m,n){
$.get('/feeds/posts/default?alt=json&start-index='+m+'&max-results=1',function(f){
if(f.feed.entry){
for(var g=0;g<f.feed.entry.length;g++){
var entry=f.feed.entry[g]
// Trích xuất nội dung bài viết từ nguồn cấp blog
}
}
},'jsonp')
})
}
},'jsonp')
//]]></script>
Gợi ý là khi trích xuất nội dung từ nguồn cấp nên tạo thành các post có sẵn element chằng hạn như các post ngoài trang chủ hoặc bên sidebar. Ngoài ra bạn cũng cần chèn thư viện link jquery trong theme nữa nhé.
Tham khảo thêm: Cách tạo widget hiển thị tổng hợp các dạng bài đăng từ widget popular posts - Trích xuất dữ liệu từ nguồn cấp
hay
Trả lờiXóa