Trang chủ › Chơi Blog
Tạo tiện ích bài đăng ngẫu nhiên random posts widget
Đăng Bởi : ADMin (Sáng Lập) *
Giới Tính : Nam - Durex Bảo Vệ Đàn Chim Việt
Đăng Lúc : Thứ Ba, 16 tháng 10, 2018

Tạo tiện ích bài đăng ngẫu nhiên random posts widget

 Hôm nay chủ nhật rãnh rỗi ngồi cà phê ngắm gái à quên ngắm cái Blog của mình chợt thấy nó thiếu thiếu cái gì 😏 mãi mới nhận ra thì ra là chưa có tiện ích bài đăng ngẫu nhiên để đua đòi cho bằng chúng bạn, vậy nên ngồi viết vài đoạn javascript nho nhỏ.

Như tiêu đề bài viết đây là kiểu bài viết được hiển thị và sắp xếp ngẫu nhiên tuy nhiên nó cũng dựa vào feed để lấy dữ liệu chỉ là cách viết javascript nó hơi khác đi một chút so với các kiểu bài đăng gần đây, bài đăng liên quan.
Hình minh họa tiện ích các bài viết ngẫu nhiên
Vào chủ đề chính trước hết bạn cần tạo đoạn javascript và đặt chúng ngay trước thẻ đóng </body>


<script>//<![CDATA[


var randarray = new Array();


var l = 0;


var flag;




function randomposts(json) {


var total = parseInt(json.feed.openSearch$totalResults.$t, 10);


for (i = 0; i < numposts;) {


flag = 0;


randarray.length = numposts;


l = Math.floor(Math.random() * total);


for (j in randarray) {


if (l == randarray[j]) {


flag = 1;


}


}


if (flag == 0 && l != 0) {


randarray[i++] = l;


}


}


for (n in randarray) {


var p = randarray[n];


var entry = json.feed.entry[p - 1];


for (k = 0; k < entry.link.length; k++) {


if (entry.link[k].rel == 'alternate') {


var w = ' thag ';


var x = ', ';


var t = entry.published.$t;


var postPublished = t.substring(8, 10) + w + t.substring(5, 7) + x + t.substring(0, 4);


var postUrl = entry.link[k].href;


var postTitle = entry.title.$t;


var postThumbnail;


try {


var postThumbnail = entry.media$thumbnail.url.replace('s72-c', 's1600');


} catch (error) {


postThumbnail = 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtTL0OR7D-_JWwVRdvZXzoBui2akxQxTnlOi87m8D5vyuEYST3-dsZ4YTpKySqtvE5k87Bg-Hd1JVRffRA2jedt2bGDZFCb3CtnRAndugN0RuQUQAfm3TbKjHhejMoOHEwP_jngnvtME4G/s1600/safe_image.png';


}


var postAuthor = entry.author[0].name.$t;


var postUri = entry.author[0].uri.$t


var postSnippet = entry.summary.$t.substring(0, (snippet));


document.getElementById('random-posts').innerHTML += '<ul class="wraper_list"><li><div class="blog_item"><a href=' + postUrl + ' title="' + postTitle + '"><img class="thumb" src=' + postThumbnail + ' alt="' + postTitle + '" /></a><a href=' + postUrl + ' title="' + postTitle + '"><span class="titlemoi">' + postTitle + '</span></a><div class="post-info">' + postSnippet + '...</div></div></li></ul>';


}


}


}


}


//]]></script>


<script src='/feeds/posts/summary?alt=json-in-script&max-results=9999&callback=randomposts'></script>
Khi tạo xong việc tiếp theo bạn thêm đoạn mã sau vào nơi muốn hiển thị bài viết ví dụ trong widget thì bạn chọn thêm 1 tiện ích HTML/Javascript sau đó thêm vào trong phần nội dung:
<script>var numposts = 5; var snippet = 150;</script><ul id ="random-posts"></ul>
Trong đó:

- 5: là số bài viết muốn hiển thị
- 150: là số từ muốn cắt của đoạn tóm tắt bài viết.

Hình minh họa:
Tạo tiện ích bài đăng ngẫu nhiên random posts widget
Xêm Thêm : Chơi Blog ,

Cùng Chuyên Mục