Bài viết cũ và mới hơn cùng chủ đề theo chiều dọc cho Blog

(Viettin24h.com) - Hôm nay mình sẽ giới thiệu đến các bạn thêm một lựa chọn về thủ thuật tạo tiện ích bài viết liên quan ! Thủ thuật Related post hôm nay mình giới thiệu rất thích hợp với những trang tin tức, chia sẻ , diễn đàn...Nó gồm bài viết mới hơn và cũ hơn tùy vào bài viết bạn đang xem . 
Ảnh minh họa :

Cách thực hiện 
1. Đăng nhập Blogger
2. Chọn mẫu ==> Chỉnh sửa HTML
3. Tìm đến thẻ :  ]]></b:skin> và dán code bên dưới trên nó 

.topmenu{position:relative;height:25px;font-size:12px;color:#eee;background:#0f7401}.topmenu ul{margin:0;list-style:none}.topmenu ul li{padding:5px 0 5px 0;float:left}.topmenu ul li a{padding:0 5px 2px;color:#eee;margin:0 0 0 0;border-left:1px solid #062e00;border-right:1px solid #129501}.topmenu ul li a:hover{color:#fff}.topmenu ul li.first a{border-left:0}.topmenu ul li.last a{border-right:0}#navi{font-weight:bold;font-size:12px;font-family:Helvetica,Arial,sans-serif;background:#f0ce0b url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgD56kbRvIPC-Zuw0eLtruZQjpzfXnoKCe3LdKV53C43B9gAyhaYy0nksvrrC-AgirSS4zS-daGIdCg04feac79mMO23eYeXizmSzRSxtjaXnYkJQZsk8v3XdqrBhVgrhpmGIhJc6TpGuwz/s1600/recbg-btrix.png) repeat-x;line-height:normal;padding:5px 0 3px 5px;text-shadow:0 1px #fff;margin:0;color:#000}#navi a{color:#093901}#related-posts-block ul{margin:0;padding:0 0 0 8px;list-style:none}#related-posts-block li{line-height:1.4;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhZZ52atukaypgnDxxBocQCirpTI-8WOLeicjm5LM5d6Y12JZa0ugjibYDaSsJl0stn5dum8mv3mpDjeU4cez-2z90avA-BWRC5z0hCx2tGIaasa395KziUkc8m70fHxICOqvMYMg2DHlMD/s1600/icon.jpg) 0 3px no-repeat;padding-left:13px}#related-posts-block{margin:0 0;font-size:11px;color:#7c7b7b}#related-posts-loading-text{font-size:12px;text-align:center;color:#002c28}#related-newest-href{margin:10px 5px 0 15px}#related-newest-title{font-size:12px;margin:0 0 4px 0;color:#116b02;width:500px}#related-posts-block #related-newest-href a{font-size:12px;font-family:Helvetica,sans-serif;color:#0c4b01}#related-posts-block #related-newest-href a:hover{color:#00f}#related-older-href{margin:10px 5px 0 15px}#related-older-title{font-size:12px;margin:0 0 4px 0;color:#116b02;width:500px}#related-posts-block #related-older-href a{font-size:12px;font-family:Helvetica,sans-serif;color:#0c4b01}#related-posts-block #related-older-href a:hover{color:#00f}.autosumpost{box-shadow:0 0 25px #d5d4d4 inset;font-family:Helvetica,sans-serif;font-size:12px;margin:0 0 0 0;padding:5px 5px 8px;line-height:1.5}

4. Dán code bên dưới sau thẻ :  <div class='post-footer'> ,  <div class='post-footer-line post-footer-line-1'>  , <div class='post-footer-line post-footer-line-3'>  , <div class='post-footer-line post-footer-line-3'>

<div id='post-labels-for-related' style='display:none'><b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'><data:label.name/><b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if></b:loop></b:if></div>
<div id='post-timestamp-for-related' style='display:none'><data:post.timestampISO8601/></div>


<div id='related-posts-block'>
<div id='related-posts-loading-text'>Đang tải dữ liệu... <img align='absmiddle' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg6-VF4CYspYbNRHPI4kSxuKN_pzTw36N-2V_gljk83su-dXHKef8v1Y34SIWGJMpbrgDwZSfc7ILZB3jgGE8_vuXUlEy82AdT8AGitOV0t6uEkFydIOzLMZFPzvNv-CueXgBnNyNKHKTZ5/s1600/ajax-loader.gif'/></div>
<div id='related-newest-href'><div id='related-newest-title'/></div>
<div id='related-older-href'><div id='related-older-title'/></div>
</div>


<script language='javascript'>
/* <![CDATA[ */
var showdate = true;var max_post = 8;function format(a){return a.substr(0,19)}function formatdate(a){for(var b=[1,2,3,4,5,6,7,8,9,10,11,12],c="01,02,03,04,05,06,07,08,09,10,11,12".split(","),e=parseInt(a.substring(5,7),10),d=0;d<b.length;d++)if(e==b[d]){e=c[d];break}return a.substring(8,10)+"/"+e+"/"+a.substring(4,2)} function getRelatedNewestLinks(a){if(a=a.feed.entry)for(var b=0;b<a.length;b++){var c=document.createElement("li");c.innerHTML=showdate?'<span style="margin-top:-3px;"> '+formatdate(a[b].published.$t)+" </span> <a href='"+a[b].link[4].href+"'>"+a[b].title.$t+"</a>":"<a href='"+a[b].link[4].href+"'>"+a[b].title.$t+"</a>";if(!checkRelaxLinks("related-newest-href",a[b].link[4].href))document.getElementById("related-newest-href-ul1").appendChild(c),document.getElementById("related-newest-title").innerHTML= "<b>C\u00e1c b\u00e0i vi\u1ebft m\u1edbi c\u00f9ng ch\u1ee7 \u0111\u1ec1</b>";document.getElementById("related-posts-loading-text").style.display="none"}else document.getElementById("related-older-title").innerHTML="<b>Kh\u00f4ng c\u00f3 b\u00e0i vi\u1ebft m\u1edbi n\u00e0o c\u00f9ng ch\u1ee7 \u0111\u1ec1</b>"} function getRelatedOlderLinks(a){if(a=a.feed.entry)for(var b=0;b<a.length;b++){var c=document.createElement("li");c.innerHTML=showdate?" "+formatdate(a[b].published.$t)+" <a href='"+a[b].link[4].href+"'>"+a[b].title.$t+"</a>":"<a href='"+a[b].link[4].href+"'>"+a[b].title.$t+"</a>";if(!checkRelaxLinks("related-older-href",a[b].link[4].href))document.getElementById("related-older-href-ul2").appendChild(c),document.getElementById("related-older-title").innerHTML="<b>C\u00e1c b\u00e0i vi\u1ebft c\u0169 c\u00f9ng ch\u1ee7 \u0111\u1ec1 </b>"}else document.getElementById("related-older-title").innerHTML= "<b>Kh\u00f4ng c\u00f3 b\u00e0i vi\u1ebft c\u0169 n\u00e0o c\u00f9ng ch\u1ee7 \u0111\u1ec1</b>";document.getElementById("related-posts-loading-text").style.display="none"} function createRelatedJson(a,b,c,e){var d=document.createElement("script");d.src="/feeds/posts/summary/-/"+escape(b)+"?orderby=published&max-results="+e+"&published-"+a+"="+escape(format(document.getElementById("post-timestamp-for-related").innerHTML))+"&alt=json-in-script&callback="+c;d.type="text/javascript";document.getElementsByTagName("head")[0].appendChild(d)} function checkRelaxLinks(a,b){for(var c=!1,e=document.getElementById(a).getElementsByTagName("a"),d=0;d<e.length;d++)if(e[d].href==b){c=!0;break}e=location.href.split(".html")[0]+".html";b==e&&(c=!0);return c} function createRP(){var a=document.getElementById("post-labels-for-related").innerHTML.split(","),b=Math.round(max_post/a.length),c=document.createElement("ul");c.id="related-newest-href-ul1";document.getElementById("related-newest-href").appendChild(c);for(c=0;c<a.length;c++)createRelatedJson("min",a[c],"getRelatedNewestLinks",b);c=document.createElement("ul");c.id="related-older-href-ul2";document.getElementById("related-older-href").appendChild(c);for(c=0;c<a.length;c++)createRelatedJson("max", a[c],"getRelatedOlderLinks",b)}createRP();
/* ]]> */ 
</script>

var showdate = true : Hiển thị ngày đăng(Nếu không muốn hiển thị thay thành False)

var max_post = 8      : Sồ bài viết tối đa hiển thị 

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