Tạo nút Bài viết ngẫu nhiên đơn giản bằng Javascript cho Blogspot

tao nut bai viet ngau nhien don gian bang javascript cho blogspot

Đây là một thủ thuật rất hay nhằm giúp bạn giữ chân người đọc bằng cách đưa họ đến bài viết khác bất kỳ, hoặc nếu như người đọc không biết phải chọn bài nào để đọc thì với nút ngẫu nhiên này sẽ giúp họ điều đó.

Ngoài ra, tác dụng khác của thủ thuật này là có thể giúp cho những bài viết quá cũ của bạn tăng được lượt xem, và từ đó có thể tạo sự thu hút cho người đọc thuộc chủ đề của bài viết đó.

Bạn có thể nhấn nút Bài ngẫu nhiên ở dưới đây để xem thủ thuật này hoạt động như thế nào nhé!

Bây giờ, chúng ta cùng bắt đầu thực hiện nào.

Nút Bài viết ngẫu nhiên đơn giản bằng Javascript

Bước 1. Đăng nhập tài khoản Blogger > Chủ đề > Chỉnh sửa HTML.

Bước 2. Sao chép đoạn mã Javascript dưới đây rồi dán chúng vào giữa hai thẻ <body></body>, nhưng tốt nhất là nên đặt vào trước thẻ đóng </body>, sau đó nhấn vào nút Lưu chủ đề để hoàn tất.

<script type="text/javascript">
/*<![CDATA[*/
function showLucky(root){ var feed = root.feed; var entries = feed.entry || []; var entry = feed.entry[0]; for (var j = 0; j < entry.link.length; ++j){if (entry.link[j].rel == 'alternate'){window.location = entry.link[j].href;}}} function fetchLuck(luck){ script = document.createElement('script'); script.src = '/feeds/posts/summary?start-index='+luck+'&max-results=1&alt=json-in-script&callback=showLucky'; script.type = 'text/javascript'; document.getElementsByTagName('head')[0].appendChild(script); } function feelingLucky(root){ var feed = root.feed; var total = parseInt(feed.openSearch$totalResults.$t,10); var luckyNumber = Math.floor(Math.random()*total);luckyNumber++; a = document.createElement('a'); a.href = '#post-random'; a.rel = luckyNumber; a.onclick = function(){fetchLuck(this.rel);}; a.innerHTML = 'BÀI NGẪU NHIÊN'; document.getElementById('post-random').appendChild(a); } </script>
<script src="/feeds/posts/summary?max-results=0&alt=json-in-script&callback=feelingLucky">
/*]]>*/
</script>

Bước 3. Hãy đặt đoạn mã HTML dưới đây vào vị trí mà bạn muốn để hiển thị nó.

<a id="post-random" class="button-random"></a>

Ngoài ra, nếu bạn muốn nút bài viết ngẫu nhiên của bạn giống như trên thì bạn hãy chép đoạn mã CSS dưới đây vào trước thẻ đóng ]]></b:skin> rồi sau đó lưu lại nhé!

.button-random a {border-radius:100px; border:none; padding:10px 20px; cursor:pointer; font-weight:700; background:#069; color:#fff}
.button-random a:hover {background:#f1f1f1; color:#999}

Chúc bạn thành công!