Template đẹp và chất cho blog

Chào các bạn! hôm nay Viettin24h.com mang đến các bạn một số template rất thuận lợi cho Seo, ngoài ra nó còn có giao diện bắt mắt và thân thiện .

1. Breaking News

Demo / Download

2. News Times

Demo / Download

3. Mag template

Demo / Download

4. Media Online Blogger Template

Demo / Download

5. Johny Magazine Blogger Template

Demo / Download

6. Johny Darkfile

Demo / Download

Cách trỏ tên miền của yahoo về blogspot

Gần đây có rất nhiều người hỏi Viettin365 về cách trỏ tên miền mua từdomain.yahoo.com về blogspot . Mình cũng đã search trên mạng nhưng chưa có một bài viết cụ thể nào về cách cài đặt tên miền trên trên trang domain.yahoo.com . Hôm nay Viettin365 sẽ chia sẻ đến các bạn cách trỏ tên miền từ domain.yahoo.com về blogspot một cách cụ thể. 

1.Việc đầu tiên bạn cần làm nếu chưa có tên miền riêng là đăng kí tài khoản và mua cho mình một domain 

2. Nếu các bạn đã có thì chúng ta bỏ qua bước 1 và tiến hành đăng nhập vào tài khoản 

3. Bước xác minh tài khoản các bạn tự làm nhé 

4. Truy cập vào tài khoản của bạn 

5. Chọn vào phần cài đặt domain
6. Vào quản lý và cài đặt DNS

7. Bây giờ chúng ta quay trở lại blogger
Cài đặt => Thêm miền tùy chỉnh => Gõ domain => Lưu lại => Nhận được thông báo tương tự như bên dưới

Đây là 2 bản ghi chúng ta cần copy lại để paste vào Domain control panel (Chút nữa mình sẽ hướng dẫn các bạn cách paste vào DNS)

8. Bây giờ chúng ta sẽ lấy địa chỉ IP của domain
- Vào Run gõ lệnh CMD

sau đó gõ config tên miền tương ứng
ping www.viettin365.com -t
Sau khi nhấn enter chúng ta sẽ nhận được địa chỉ IP của domain có dạng 

        Pinging www.viettin365.com [74.125.31.121] 

9.Quay lại quản lý và cài đặt domain .
Qua 2 bước 7 và 8 chúng ta có 4 bản ghi bây giờ tiến hành cài đặt trên domain . Các bạn chỉnh sửa và thêm bản mới(cái này đơn giản các bạn tự làm nhé) . Sau khi hoàn thành nó có dạng như sau: 

Phần mình đánh mũi tên màu xanh nó dùng để tạo email cá nhân mình đã giới thiệu trong bài :

Cách tạo Email cho tổ chức, công ty từ domain hiện có

(Các bạn không cần quan tâm đến nó)

Trên đây là toàn bộ cách trỏ tên  miền từ domain.yahoo.com về blogspot . Các bạn có thắc mắc gì hãy để lại comment bên dưới mình sẽ trả lời trong thời gian sớm nhất 

Cám ơn các bạn đã theo dõi và ủng hộ 

theo Viettin365.com

Bộ sưu tập button thiết kế web/blog

Để thuận lợi cho việc thiết kế và tìm kiếm Viettin24h giới thiệu đến các bạn bộ sưu tập các nút button. Bộ sưu tập gồm các thanh di chuyển, RSS,twiter,facebook....

Đọc thêm »

Recent post 3 cột ảnh và tiêu đề đẹp mắt trình diễn tin tức cho blogger

Trước Viettin24h có giới thiệu đến các bạn thủ thuật tạo recent post  dạng ảnh 3 cột đơn giản ( Xem ngay) . Hôm nay mình xin giới thiệu đến các bạn tạo thêm Recent post 3 cột ảnh và tiêu đề đẹp mắt . Thủ thuật này rất thích hợp cho những trang tin tức , chia sẻ, giải trí....
Ảnh minh họa :

Các bước thực hiện :

1. Đăng nhập blogger

2. Chọn mẫu ==> Chỉnh sửa HTML

3.Dán đoạn code bên dưới trước thẻ </head>

<script type='text/javascript'>
//<![CDATA[
imgr=new Array();imgr[0]="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjA0D4IAeNavsCaPU0DEJHLAQMeLxcMg14AfHAsIz1ru_i5ljmf3O92YwPrbWiMq5WoDEX5ZAUcZyg7SqPW-dMyutjiN83LYW84clvFIFm6PBJvriy8izaAUe5cS1jeMxLtDBlnq8fZRIT-/s1600/no-video.gif";showRandomImg=true;aBold=true;summaryPost = 100;summaryPost1 = 200;numposts=6;numposts1=30;numpostsviettin24h1=1;numpostsviettin24h3=6;numpostsviettin24hmoinhat=9;numpostsviettin24h8=8;numpostsviettin24htaichinhcanhan=4;numpostsviettin24htop123=5;numpostsviettin24h4anh=2;numpost5anhnho=5;numpostanhhinho1=1;numpostsviettin24htrai1=5;numpostsviettin24htraitop=4;numpostsviettin24htop2=3;numposts2=10;numposts6=3;Title1="Template blogspot";Title2="WordPress";Title3="Joomla";Title4="Drupal";Title5="Mã nguồn VBB";Title6="PHP";function removeHtmlTag(strx,chop){var s=strx.split("<");for(var i=0;i<s.length;i++){if(s[i].indexOf(">")!=-1){s[i]=s[i].substring(s[i].indexOf(">")+1,s[i].length)}}s=s.join("");s=s.substring(0,chop-1);return s}
function showrecentposts0(json){j=(showRandomImg)?Math.floor((imgr.length+1)*Math.random()):0;img=new Array();for(var i=0;i<numposts;i++){var entry=json.feed.entry[i];var posttitle=entry.title.$t;var pcm;var posturl;if(i==json.feed.entry.length)break;for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='alternate'){posturl=entry.link[k].href;break}}for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='replies'&&entry.link[k].type=='text/html'){pcm=entry.link[k].title.split(" ")[0];break}}if("content"in entry){var postcontent=entry.content.$t}else if("summary"in entry){var postcontent=entry.summary.$t}else var postcontent="";postdate=entry.published.$t;if(j>imgr.length-1)j=0;img[i]=imgr[j];s=postcontent;a=s.indexOf("<img");b=s.indexOf("src=\"",a);c=s.indexOf("\"",b+5);d=s.substr(b+5,c-b-5);if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!=""))img[i]=d;var month=[1,2,3,4,5,6,7,8,9,10,11,12];var month2=["January","February","March","April","May","June","July","August","September","October","November","December"];var day=postdate.split("-")[2].substring(0,2);var m=postdate.split("-")[1];var y=postdate.split("-")[0];for(var u2=0;u2<month.length;u2++){if(parseInt(m)==month[u2]){m=month2[u2];break}}var daystr=m+' '+day+' '+y;var trtd='<div class="crott"><a href="'+posturl+'">'+posttitle+'</a><p>'+removeHtmlTag(postcontent,summaryPost1)+'... </p></div>';document.write(trtd);j++}}function showrecentposts(json){j=(showRandomImg)?Math.floor((imgr.length+1)*Math.random()):0;img=new Array();for(var i=0;i<numposts;i++){var entry=json.feed.entry[i];var posttitle=entry.title.$t;var pcm;var posturl;if(i==json.feed.entry.length)break;for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='alternate'){posturl=entry.link[k].href;break}}for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='replies'&&entry.link[k].type=='text/html'){pcm=entry.link[k].title.split(" ")[0];break}}if("content"in entry){var postcontent=entry.content.$t}else if("summary"in entry){var postcontent=entry.summary.$t}else var postcontent="";postdate=entry.published.$t;if(j>imgr.length-1)j=0;img[i]=imgr[j];s=postcontent;a=s.indexOf("<img");b=s.indexOf("src=\"",a);c=s.indexOf("\"",b+5);d=s.substr(b+5,c-b-5);if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!=""))img[i]=d;var month=[1,2,3,4,5,6,7,8,9,10,11,12];var month2=["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];var day=postdate.split("-")[2].substring(0,2);var m=postdate.split("-")[1];var y=postdate.split("-")[0];for(var u2=0;u2<month.length;u2++){if(parseInt(m)==month[u2]){m=month2[u2];break}}var daystr=day+' '+m+' '+y;var trtd='<a href="'+posturl+'"><img src="'+img[i]+'"/></a>';document.write(trtd);j++}}
function showrecentposts2(json){j=(showRandomImg)?Math.floor((imgr.length+1)*Math.random()):0;img=new Array();for(var i=0;i<numposts1;i++){var entry=json.feed.entry[i];var posttitle=entry.title.$t;var pcm;var posturl;if(i==json.feed.entry.length)break;for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='alternate'){posturl=entry.link[k].href;break}}for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='replies'&&entry.link[k].type=='text/html'){pcm=entry.link[k].title.split(" ")[0];break}}if("content"in entry){var postcontent=entry.content.$t}else if("summary"in entry){var postcontent=entry.summary.$t}else var postcontent="";postdate=entry.published.$t;if(j>imgr.length-1)j=0;img[i]=imgr[j];s=postcontent;a=s.indexOf("<img");b=s.indexOf("src=\"",a);c=s.indexOf("\"",b+5);d=s.substr(b+5,c-b-5);if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!=""))img[i]=d;var month=[1,2,3,4,5,6,7,8,9,10,11,12];var month2=["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];var day=postdate.split("-")[2].substring(0,2);var m=postdate.split("-")[1];var y=postdate.split("-")[0];for(var u2=0;u2<month.length;u2++){if(parseInt(m)==month[u2]){m=month2[u2];break}}var daystr=day+' '+m+' '+y;var trtd='<li class="car"><div class="thumb"><a href="'+posturl+'"><img width="170" height="128" src="'+img[i]+'"/></a></div><a class="slider_title" href="'+posturl+'">'+posttitle+'</a></li>';document.write(trtd);j++}}
function showrecentpostsplay(json){j=(showRandomImg)?Math.floor((imgr.length+1)*Math.random()):0;img=new Array();for(var i=0;i<numposts1;i++){var entry=json.feed.entry[i];var posttitle=entry.title.$t;var pcm;var posturl;if(i==json.feed.entry.length)break;for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='alternate'){posturl=entry.link[k].href;break}}for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='replies'&&entry.link[k].type=='text/html'){pcm=entry.link[k].title.split(" ")[0];break}}if("content"in entry){var postcontent=entry.content.$t}else if("summary"in entry){var postcontent=entry.summary.$t}else var postcontent="";postdate=entry.published.$t;if(j>imgr.length-1)j=0;img[i]=imgr[j];s=postcontent;a=s.indexOf("<img");b=s.indexOf("src=\"",a);c=s.indexOf("\"",b+5);d=s.substr(b+5,c-b-5);if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!=""))img[i]=d;var month=[1,2,3,4,5,6,7,8,9,10,11,12];var month2=["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];var day=postdate.split("-")[2].substring(0,2);var m=postdate.split("-")[1];var y=postdate.split("-")[0];for(var u2=0;u2<month.length;u2++){if(parseInt(m)==month[u2]){m=month2[u2];break}}var daystr=day+' '+m+' '+y;var trtd='<li class="car"><div class="thumb"><a href="'+posturl+'"><span class="play-dong"></span><img width="170" height="128" src="'+img[i]+'"/></a></div><a class="slider_title" href="'+posturl+'">'+posttitle+'</a></li>';document.write(trtd);j++}}
function showrecentposts1(json){j=(showRandomImg)?Math.floor((imgr.length+1)*Math.random()):0;img=new Array();for(var i=0;i<numposts2;i++){var entry=json.feed.entry[i];var posttitle=entry.title.$t;var pcm;var posturl;if(i==json.feed.entry.length)break;for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='alternate'){posturl=entry.link[k].href;break}}for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='replies'&&entry.link[k].type=='text/html'){pcm=entry.link[k].title.split(" ")[0];break}}if("content"in entry){var postcontent=entry.content.$t}else if("summary"in entry){var postcontent=entry.summary.$t}else var postcontent="";postdate=entry.published.$t;if(j>imgr.length-1)j=0;img[i]=imgr[j];s=postcontent;a=s.indexOf("<img");b=s.indexOf("src=\"",a);c=s.indexOf("\"",b+5);d=s.substr(b+5,c-b-5);if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!=""))img[i]=d;var month=[1,2,3,4,5,6,7,8,9,10,11,12];var month2=["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];var day=postdate.split("-")[2].substring(0,2);var m=postdate.split("-")[1];var y=postdate.split("-")[0];for(var u2=0;u2<month.length;u2++){if(parseInt(m)==month[u2]){m=month2[u2];break}}var daystr=day+' '+m+' '+y;var trtd='<div class="column"><a href="'+posturl+'"><span class="play-button"></span><img class="column_img" src="'+img[i]+'"/></a><h2><a href="'+posturl+'">'+posttitle+'</a></h2></div>';document.write(trtd);j++}}
function showrecentposts6(json){j=(showRandomImg)?Math.floor((imgr.length+1)*Math.random()):0;img=new Array();document.write('<ul>');for(var i=0;i<numposts6;i++){var entry=json.feed.entry[i];var posttitle=entry.title.$t;var pcm;var posturl;if(i==json.feed.entry.length)break;for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='alternate'){posturl=entry.link[k].href;break}}for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='replies'&&entry.link[k].type=='text/html'){pcm=entry.link[k].title.split(" ")[0];break}}if("content"in entry){var postcontent=entry.content.$t}else if("summary"in entry){var postcontent=entry.summary.$t}else var postcontent="";postdate=entry.published.$t;if(j>imgr.length-1)j=0;img[i]=imgr[j];s=postcontent;a=s.indexOf("<img");b=s.indexOf("src=\"",a);c=s.indexOf("\"",b+5);d=s.substr(b+5,c-b-5);if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!=""))img[i]=d;var month=[1,2,3,4,5,6,7,8,9,10,11,12];var month2=["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];var day=postdate.split("-")[2].substring(0,2);var m=postdate.split("-")[1];var y=postdate.split("-")[0];for(var u2=0;u2<month.length;u2++){if(parseInt(m)==month[u2]){m=month2[u2];break}}var daystr=day+' '+m+' '+y;var trtd=' <li class="featuredPost2"><a href="'+posturl+'"><img width="107" height="80" class="alignleft" src="'+img[i]+'"/></a><div class="entry-title"><a href="'+posturl+'">'+posttitle+'</a></div>'+removeHtmlTag(postcontent,summaryPost)+'...</li>';document.write(trtd);j++}document.write('</ul>')}
var relatedTitles=new Array();var relatedTitlesNum=0;var relatedUrls=new Array();var thumburl=new Array();function related_results_labels_thumbs(json){for(var i=0;i<json.feed.entry.length;i++){var entry=json.feed.entry[i];relatedTitles[relatedTitlesNum]=entry.title.$t;try{thumburl[relatedTitlesNum]=entry.gform_foot.url}catch(error){s=entry.content.$t;a=s.indexOf("<img");b=s.indexOf("src=\"",a);c=s.indexOf("\"",b+5);d=s.substr(b+5,c-b-5);if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!="")){thumburl[relatedTitlesNum]=d}else thumburl[relatedTitlesNum]='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjA0D4IAeNavsCaPU0DEJHLAQMeLxcMg14AfHAsIz1ru_i5ljmf3O92YwPrbWiMq5WoDEX5ZAUcZyg7SqPW-dMyutjiN83LYW84clvFIFm6PBJvriy8izaAUe5cS1jeMxLtDBlnq8fZRIT-/s1600/no-video.gif'}if(relatedTitles[relatedTitlesNum].length>35)relatedTitles[relatedTitlesNum]=relatedTitles[relatedTitlesNum].substring(0,35)+"...";for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='alternate'){relatedUrls[relatedTitlesNum]=entry.link[k].href;relatedTitlesNum++}}}}function removeRelatedDuplicates_thumbs(){var tmp=new Array(0);var tmp2=new Array(0);var tmp3=new Array(0);for(var i=0;i<relatedUrls.length;i++){if(!contains_thumbs(tmp,relatedUrls[i])){tmp.length+=1;tmp[tmp.length-1]=relatedUrls[i];tmp2.length+=1;tmp3.length+=1;tmp2[tmp2.length-1]=relatedTitles[i];tmp3[tmp3.length-1]=thumburl[i]}}relatedTitles=tmp2;relatedUrls=tmp;thumburl=tmp3}function contains_thumbs(a,e){for(var j=0;j<a.length;j++)if(a[j]==e)return true;return false}function printRelatedLabels_thumbs(){for(var i=0;i<relatedUrls.length;i++){if((relatedUrls[i]==currentposturl)||(!(relatedTitles[i]))){relatedUrls.splice(i,1);relatedTitles.splice(i,1);thumburl.splice(i,1);i--}}var r=Math.floor((relatedTitles.length-1)*Math.random());var i=0;if(relatedTitles.length>0)document.write('<h2>'+relatedpoststitle+'</h2>');document.write('<div style="clear: both;"/>');while(i<relatedTitles.length&&i<20&&i<maxresults){document.write('<a style="text-decoration:none;margin:0 8px 10px 5px;float:left;;border:0px solid #ccc;box-shadow:0 0 4px #bbb;-moz-box-shadow:0 0 4px #bbb;-webkit-box-shadow:0 0 4px #bbb;');if(i!=0)document.write('"');else document.write('"');document.write(' href="'+relatedUrls[r]+'"><div class="play-button"><img class="maskolis_img" src="'+thumburl[r]+'"/><br/></div><div style="width:162px;color:#333;height:35px;text-align:center;margin:0px 5px; font:bold 12px Arial; line-height:14px;">'+relatedTitles[r]+'</div></a>');if(r<relatedTitles.length-1){r++}else{r=0}i++}document.write('</div>');relatedUrls.splice(0,relatedUrls.length);thumburl.splice(0,thumburl.length);relatedTitles.splice(0,relatedTitles.length)}
//]]>
</script>

4. Chèn đoạn Css bên dưới trước thẻ ]]></b:skin>

#viettin24h-anhhinho li {float: left;list-style: none;height:190px;width: 212px;overflow: hidden;margin-left: 10px;}
#viettin24h-anhhinho img {float: left;width:190px;height:130px}
#viettin24h-anhhinho a {float: center;overflow: hidden;color: #333;font: BOLD 12PX ARIAL;width: 218px;}
#viettin24h-anhhinho a.slider_title {float: left !important;}

5. Đặt dưới chân bài viết các bạn tìm đến 1 trong các thẻ

<div class='post-footer-line post-footer-line-1'>                          

<div class='post-footer-line post-footer-line-2'>            

<div class='post-footer-line post-footer-line-3'> 

Dán code bên dưới sau thẻ vừa tìm được

       

<div class='design-viettin24h-box3'>
<div style='width: 660px;margin-left:5px;border-bottom: 0px solid #9F0100;margin-bottom: 5px;margin-top: 10px;'>
<div style=' height: 19px; display: inline-block; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; background-color:#9F0100'>
<div style='font-size: 14px; font-weight: bold; color: #fff;padding-top: 2px; background:none;height: 19px;float:left;padding-left: 3px;box-shadow: 0px 1px #ECECEC;'>
<a href='' style='color:#fff;'>
<span class='newstit' style='color:#fff'>BẠN XEM CHƯA ? </span>
</a>
</div>
<div style='width: 10px; background:#FFF url();height: 19px; float: right'>
</div>

</div>
</div>
<div id='ads2-viet4'>
<div id='viettin24h-anhhinho'>
<script>
document.write(&quot;&lt;script src=\&quot;http://viettin24h.com/feeds/posts/default?max-results=&quot;+numpostsviettin24hmoinhat+&quot;&amp;orderby=published&amp;alt=json-in-script&amp;callback=showrecentpostsplay\&quot;&gt;&lt;\/script&gt;&quot;);
</script>
</div>

</div>

</div>

Chú ý : Ở trên mình làm áp dụng cho cả Blog, nếu bạn nào muốn áp dụng cho từng nhãn thì thay :

http://viettin24h.com/feeds/posts/default?max-results

thành 

http://viettin24h.com/feeds/posts/default/-/ten nhan?max-results

và thay ten nhan cho phù hợp

Mình đã đổi màu các thông số để các bạn có thể điều chỉnh cho phù hợp với Blog của mình 

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

Phân trang cho blog - Page Navigation

Page Navigation đối với đa số các website là một công cụ không còn xa lạ. Nhưng với blogger thì công cụ này vẫn chưa được hỗ trợ mạnh lắm. Chỉ có nút Next và Preview thôi. Tham khảo ở một số nơi mình đã chế biến lại cái navipage cho blog của mình. Bạn có thể làm theo hướng dẫn dưới đây.
1. Trước tiên việc bạn cần làm là chọn 1 trong các mẫu phía dưới.

.pagenavi{background:#f1f1f1;clear:both;margin:30px auto 20px;text-align:center;border:1px solid #bfbfbf;padding:3px 0}
.pagenavi span,.pagenavi a{border:1px solid #f1f1f1;padding:1px 4px;color:#000;margin:2px;font-size:12px}
.pagenavi span{color:#3a3a3a}
.pagenavi a:hover,.pagenavi .current{border:1px solid #bfbfbf;background:#fffdf0;color:#000;text-decoration:none}
.pagenavi .pages{color:#666}

.pagenavi{background:#3498b9;clear:both;margin:30px auto 20px;text-align:center;border:1px solid #2f7a93;padding:4px 0}
.pagenavi span,.pagenavi a{font-weight:bold;padding:7px 8px;color:#fff;margin:1px;font-size:11px}
.pagenavi span{color:#3a3a3a}
.pagenavi a:hover,.pagenavi .current{background:#236e8f;color:#fff;text-decoration:none}
.pagenavi .pages{color:#fff}

.pagenavi{clear:both;margin:30px auto 20px;text-align:center}
.pagenavi span,.pagenavi a{background:-moz-linear-gradient(center top,#96aeba,#536a75) repeat scroll 0 0 transparent;border:1px solid #616e76;padding:4px 8px;color:#fff;margin:2px;font-size:12px;-moz-border-radius:4px}
.pagenavi span{color:#3a3a3a}
.pagenavi a:hover,.pagenavi .current{color:#fff;background:#c70e0c;border:1px solid #782f28;text-decoration:none}
.pagenavi .pages{color:#fff}

.pagenavi{clear:both;margin:30px auto 20px;text-align:center}
.pagenavi span,.pagenavi a{background:#24bde2;border:1px solid #4adcff;padding:3px 8px;color:#fff;margin:2px;font-size:12px}
.pagenavi span{color:#3a3a3a}
.pagenavi a:hover,.pagenavi .current{color:#fff;background:#ff6734;border:1px solid #ddd;text-decoration:none}
.pagenavi .pages{display:none}

.pagenavi{clear:both;margin:10px auto;text-align:center}
.pagenavi span,.pagenavi a { font-size:12px;padding: 2px 4px 2px 4px;margin: 2px;border: 1px solid #dfdfdf;color:#000;}
.pagenavi a:visited{}
.pagenavi a:hover,.pagenavi .current{color: #FFF;background-color: #e81d1d;border: 1px solid #fb1515;text-decoration:none;}

.pagenavi{clear:both;margin:30px auto 20px;text-align:center}
.pagenavi span,.pagenavi a{background:#1dc1ff;padding:6px 6px;color:#fff;margin:2px;font-size:12px;-moz-border-radius:5px}
.pagenavi span{color:#3a3a3a}
.pagenavi a:hover,.pagenavi .current{background:#ff9200;color:#fff;text-decoration:none}
.pagenavi .pages{display:none}

.pagenavi{clear:both;text-align:right;margin:25px 0 10px 0;font-size:.714em;font-weight:600;line-height:1.4em}
.pagenavi span,.pagenavi a{background:#e1e1e1;border:1px solid #555;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;-moz-box-shadow:0 1px 0 #FFF;-webkit-box-shadow:0 1px 0 #FFF;box-shadow:0 1px 0 #FFF;color:#555;margin-left:5px;padding:4px 6px 3px;text-shadow:0 1px 0 #C2C2C2}
.pagenavi span{color:#3a3a3a}
.pagenavi a:hover,.pagenavi .current{background:-moz-linear-gradient(center top,#45bc3f,#1c6318) repeat scroll 0 0 transparent;border:1px solid #00203B;text-shadow:0 -1px 0 #00203B;color:#fff;text-decoration:none}
.pagenavi .pages{background:none;border:none}

.pagenavi{clear:both;margin:10px auto;text-align:left}
.pagenavi span,.pagenavi a {background:#0e0f10;font-size:12px;padding: 3px 5px;margin: 2px;border: 1px solid #333;color:#fff;}
.pagenavi a:visited{}
.pagenavi a:hover,.pagenavi .current{color: #FFF;background-color: #33393f;border: 1px solid #444;text-decoration:none;}

Vào Thiết kế → chỉnh sửa HTML → Mở rộng tiện ích mẫu. Chèn đoạn code bạn đã chọn vào phía trên thẻ ]]></b:skin>

2. Tiếp tục tìm đoạn code sau:

<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'>

Lưu ý đối với 1 số blog thì chữ Blog Posts được thay bằng Bài đăng trên Blog.  Bạn chèn sau nó đoạn code sau.

<b:includable id='page-navi'>
<div class="pagenavi">
<script type="text/javascript">
var pageNaviConf = {
perPage: 5,
numPages: 5,
firstText: "First",
lastText: "Last",
nextText: &quot;&#187;&quot;,
prevText: &quot;&#171;&quot;
}
</script>
<script type="text/javascript" src="http://voquocan.googlecode.com/files/pagenavi.min.js"></script>
<div class="clear" />
</div>
</b:includable>

3. Tiếp tục tìm đoạn code sau:

<!-- navigation -->
<b:include name='nextprev'/>

Thay đoạn code trên bằng đoạn code dưới đây:

<b:if cond='data:blog.pageType == "index"'>
<b:include name='page-navi' />
<b:else/>
<b:if cond='data:blog.pageType == "archive"'>
<b:include name='page-navi' />
</b:if>
</b:if>

Lưu template lại là xong.
Chú ý trong đoạn code trên.
perPage là số bài hiển thị trên 1 trang.
numPages là số trang hiển thị ra nút bấm
chữ First / Last có thể thay thế bằng chữ khác tùy thích.
Chúc các bạn thành công .

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/AVvXsEiKu6OF6L_VtbcWf9wFpC3cEgTzp5bFDwslGCl662C-Lw6QOfa8IZ2xFEdAVp53NMPnewM5PdNqETgIMjlFKU4r8HqP7WfSZ3AICDjnbEifR8UEWxMeY9JHGfw3rKpO-58YMnL7RKL4ceEX/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/AVvXsEjpq-K-UtYeT4AjuIYLaTVzjJ8HA8Ucsosh2Cu21n2UQN9d16AUtqJuNMreWSCsXwCS9PmYxxUT361u-gAr8-wZnPJn194mgPooQVYQ0wJTEXQWd_sWbAVPEXY7qA1r1nREBVwwgDAt1DOW/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/AVvXsEjdTOORNWyuphns_bylMLx9dfH4wpoxVji5x7W6aADlVUDyLwUyQamQ8DmFfgF63cBDaIUJ32SzNbI3DSVafWsW6Dsb6NJR93lBmNqCUIk_4_PoAv9hSGM37mKF8RNp47edWcW_lLU2RyJC/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 

Bài viết liên quan chuyên nghiệp kết hợp chia sẻ mạng xã hội cho Blog

Thủ thuật Related post(Bài viết liên quan) hôm nay Viettin24h giới thiệu đến các bạn khác với các thủ thuật trước ở chỗ : về tính thẩm mỹ, giao diện tiện ích, tự lấy ảnh tự động từ bài viết.... Đây là một thủ thuật mà mình thấy nó đáp ứng rất nhiều yếu tố của người sử dụng. Mình tích hợp chia sẻ lên các mạng xã hội ngay trên tiện ích. 
Ảnh minh họa :

Bắt đầu thủ thuật 
1.Đăng nhập Blogger
2.Chọn mẫu ==> Chỉnh sửa HTML
3.Đặt code bên dưới trước thẻ :  ]]></b:skin>
                      

#related_posts2 { background-color:#FFF; margin:10px 0 0 0; padding:10px; -moz-box-shadow:inset 0 0 1px #000000; -webkit-box-shadow:inset 0 1px 1px #000000; box-shadow:inset 0 0 1px #000000 }
#related_posts2 h4 { color:#fff; font-size:15px; margin:-10px -10px 10px; padding:5px 3px; text-align:center; font-weight:bold; -moz-text-shadow:2px 0 0 #333; -webkit-text-shadow:2px 0 0 #333; text-shadow:2px 0 0 #333; position:relative; background-color:#00B4FF }
#related_posts2 ul,#related_posts li { overflow:hidden; padding:0; margin:0; list-style:none }
#related_posts2 ul { margin-top:10px }
#related_posts2 li { float:left; width:100%; margin:0 0 5px}
#related_posts2 .gmbrrltd { background-color:#f7f7f7; float:left; margin:0 5px 0 0; padding:3px; border:1px solid #ddd; -moz-border-radius:2px; -webkit-border-radius:2px; border-radius:2px }
#related_posts2 strong { font-weight:bold; font-size:15px; line-height:1.1em }
#related_posts2 p { margin:2px 0 0; font-size:12px }
.loadingxx { width:100%; min-height:150px; background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-3yb34Ys4SaDS05sfUWb9f3GsLn8RQ9jQYQctO5pl19Osg2AhWs6iQtzHgXbMBfwtcqx1b-Fv57DxZwpxOCGLnf-WvS4lMIX4bDO2r7Cqy3CayKXqbUbwT5N8Bj8kkdoJPCjy07x07ocC/s1600/loading-dip.gif) no-repeat center; display:block; text-indent:-9999px }
.kotak-dalem { background-color:transparent; padding:0; -moz-box-shadow:none; -webkit-box-shadow:none; box-shadow:none; border:none; margin-bottom:0 }

4. Tìm đến code như :
   

<div class='post-footer'>

<div class='post-footer-line post-footer-line-1'>                          

<div class='post-footer-line post-footer-line-2'>            

<div class='post-footer-line post-footer-line-3'> 

và đặt code bên dưới sau thẻ trên

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type='text/css'>
.custom_images ul {display:inline; list-style:none}
.custom_images ul li {float:left; margin-right:1px}
#related-posts {clear: both;margin-top:20px;margin-bottom:20px;}
#related-posts h3{
border-bottom: 4px solid #333333;
font-family: Oswald,arial,Georgia,serif;
font-size: 18px;
padding-bottom: 5px;
text-transform: uppercase;
}
#related-posts ul li a {
    color:#fff;text-align:center;
}#related-posts ul li:nth-child(2) a {text-align:center;
color:#fff;
}
#related-posts ul li:nth-child(3) a {text-align:center;
color:#fff;
}

#related-posts ul li:nth-child(4) a {text-align:center;
color:#fff;
}

#related-posts ul {   margin-bottom: 20px; padding: 10px 0; }
#related-posts ul li {list-style:none;
float: left;
height: 180px;
margin: 0 10px 10px 0;
width: 200px;
font-size: 13px;

padding-bottom:10px;color:#fff;text-align:center;
}
#related-posts img:hover{opacity:0.7;height: 125px;}
#related-posts img {height: 130px;width: 200px;}
  #related-posts li:nth-child(2) img {display:none;width: 400px;}

#related-posts li:nth-child(3) img {display:none;width: 400px;}
#related-posts li:nth-child(4) img {display:none;width: 400px;}



  #related-posts  li:nth-child(2)  {background: #2C84EE;width: 400px;height: 40px;color:#fff;padding-bottom:10px;}
#related-posts  li:nth-child(1)  {background:#781766;}
#related-posts  li:nth-child(3)  {background:#CD5B45;width: 400px;height: 40px;color:#fff;padding-bottom:10px;}
#related-posts  li:nth-child(4)  {background: #000;width: 400px;height: 60px;color:#fff;padding-bottom:10px;}
#related-posts  li:nth-child(5)  {background: #044E94;}
#related-posts  li:nth-child(6)  {background:#E81750;}
#related-posts  li:nth-child(7)  {background:#FB8F02;height: 180px;
margin: 0 0px 10px 0px;
width: 200px;
font-size: 13px;}
</style>
<div class='addthis_toolbox'>
<div style='margin: 50px 0px 10px; font-size: 30px;'>Share this post</div>
<div class='custom_images'>
<span class='fade'><ul>
  <li><a class='addthis_button_facebook'><img alt='Share to Facebook' border='0' height='57' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgaNoceksGQS22XYH_mzHVP0mpxPowwb4QymI0ZLsDgZLIuzq0AtK_R0KyVCsD2F-alCnu99JaDNLWDcjGuVV8MEDZWKX2ZVnCGmFFZEakJ3JY6XjrLxV1WU1f3sB4jMlAEw9UCa4Dmo3zV/s57/Facebook%2520alt%25202.png' width='57'/></a></li>
  <li><a class='addthis_button_twitter'><img alt='Share to Twitter' border='0' height='57' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgYxFKuxFwpN9SJ_T_uWb9jZhImdYH6y35WsjOw6RSZQOR79XFbI7S-pEZ9KJwP80lFeAGbgJBrfhgtDdhYCYL2uGSEv6kf3aTnLuWFlcevqCGMas_qy6VIEaWJtPbmsm5XEqQJn1GvUWLh/s57/Twitter%2520alt%25204.png' width='57'/></a></li>
  <li><a class='addthis_button_google_plusone_share'><img alt='Share to Google+' border='0' height='57' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhu5WNvqqNuUKIsLp08QtF6dUjcHwITksPGoV-Tyol4XaAgdQGQ0PqvfOogiTtqXU7p3UeRjb9rKtMjpo3sohQC6cR_fL4kJsROi9_ds-ezJh-TLf1a35NFpxthKOyV8P94c4-_azE-1oti/s57/Google%252B%2520alt%25202.png' width='57'/></a></li>
  <li><a class='addthis_button_stumbleupon'><img alt='Share to Stumble Upon' border='0' height='57' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzIJ6EiEn318Xm0oudGBWMc9EXrDxcpzQlQPFX4z6rNp3N0_8MFLJY3VWvqmnwbtPD8BQ0qubMKpjWynfum9gq6zOacQ1dXdmeOdmsoCpcgYJJJOTLK0LZDClfQeDUJCxu4MsCQV43kEWS/s57/StumbleUpon%2520alt.png' width='57'/></a></li>
  <li><a class='addthis_button_evernote'><img alt='Share to Evernote' border='0' height='57' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgyFDG3JcUb7v-7KE-AaJm1Gn8gDAAeNM1k9bfxFhyphenhyphenpIQYMk7E1plcHpamCknRsTjCq2p9tmgnVQQ839xYbJmUJxA8-YqV4vwS08SySJxK50EpBT43cumRrQtgH1qZ5nbfqwaathnTjyI4k/s57/evernote-icon.png' width='57'/></a></li>
  <li><a class='addthis_button_blogger'><img alt='Share to Blogger' border='0' height='57' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEir9MBiB6IqvTzUstVRuf2b9Z3-m0hQrOgYyry1A51b3lvWyjkyzDbWg-d0vi9GCXIRGaaXzoFh3Ag3skFMRj6OX133vrlum953dnOSMFYhLfx0zYYcIm3UrYkuetL6Lis5ZCV9cfqPfjYx/s57/Google%2520Blogger.png' width='57'/></a></li>
  <li><a class='addthis_button_email'><img alt='Share to Email' border='0' height='57' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh2HQ6l4xty-P0SPBBPglz_LmSLg3pjHujS-ZL2C0RTymeKHzo-I2aATDYYcUtHYLYMh9oOT9-ZKLg_Ow5wpF1B_hrn1QHoIjQdWNQFdW7OekQui8ZnLaqq2qDO_ZtwdgoEOl2f4FvIDhk_/s57/Mail%2520alt.png' width='57'/></a></li>
  <li><a class='addthis_button_yahoomail'><img alt='Share to Yahoo Messenger' border='0' height='57' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgqYNAaYqkELXcIGszewmgVMmsn2epvxCEm1CvRAjOXYjlJKXEQshU0rPgcrF1jwjRB3UGms6AuqPKuhZx849M5sEHinMgp_EGQ6l_Dqm5zjERxFDzDsUDxMu-Zlf3MDQaq0kJgJsHRzFts/s57/Yahoo%2521%2520alt%25201.png' width='57'/></a></li>
  <li><a class='addthis_button_more'><img alt='More...' border='0' height='57' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfYM-XSIrre5U4xu3s2q3rHKRxznZUHdc-raRHCEecwB3lfxRjbCZzrxQFG1igwgZBaNujmzos442r5nGMVy0WX1JzvR0d3qKdoxozU1V1h8Xw-XX_J2DfIw5AmqvgBwtwNXBXB8ViQhe9/s57/Share%2520alt%25201.png' width='57'/></a></li>
</ul></span>
</div>
</div>

<div style='clear:both'/>
<div id='related-posts'>
<script type='text/javascript'>var ry=&#39;<h2>Các tin cùng chủ đề</h2>&#39;;rn=&#39;<h2>None Realated Posts</h2>&#39;;rcomment=&#39;Comments&#39;;rdisable=&#39;No Comments&#39;;commentYN=&#39;yes&#39;;</script>
<script type='text/javascript'>
//<![CDATA[
var nothumb='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj0n_CfWrNARoVeUUNzvxJANO_yTcsg5_WQ6C78v8KRRcpfQbpR1wkTx3QfQzm18fav3ZVochtlgE2UZa8DynVV6hKN8uTpBCMMpI9d2ad4sOzDjnwOQ8W8aOxrkI2GQXz-zvcyo-N7kJ4/s200-c/last%2528gr%2529256.jpg';dw='';titles=new Array();titlesNum=0;urls=new Array();time=new Array();thumb=new Array();commentsNum=new Array();comments=new Array();function related_results_labels(c){for(var b=0;b<c.feed.entry.length;b++){var d=c.feed.entry[b];titles[titlesNum]=d.title.$t;for(var a=0;a<d.link.length;a++){if('thr$total' in d){commentsNum[titlesNum]=d.thr$total.$t+' '+rcomment}else{commentsNum[titlesNum]=rdisable};if(d.link[a].rel=="alternate"){urls[titlesNum]=d.link[a].href;time[titlesNum]=d.published.$t;if('media$thumbnail' in d){thumb[titlesNum]=d.media$thumbnail.url}else{thumb[titlesNum]=nothumb};titlesNum++;break}}}}function removeRelatedDuplicates(){var b=new Array(0);c=new Array(0);e=new Array(0);f=new Array(0);g=new Array(0);for(var a=0;a<urls.length;a++){if(!contains(b,urls[a])){b.length+=1;b[b.length-1]=urls[a];c.length+=1;c[c.length-1]=titles[a];e.length+=1;e[e.length-1]=time[a];f.length+=1;f[f.length-1]=thumb[a];g.length+=1;g[g.length-1]=commentsNum[a]}}urls=b;titles=c;time=e;thumb=f;commentsNum=g}function contains(b,d){for(var c=0;c<b.length;c++){if(b[c]==d){return true}}return false}function printRelatedLabels(a){var y=a.indexOf('?m=0');if(y!=-1){a=a.replace(/\?m=0/g,'')}for(var b=0;b<urls.length;b++){if(urls[b]==a){urls.splice(b,1);titles.splice(b,1);time.splice(b,1);thumb.splice(b,1);commentsNum.splice(b,1)}}var c=Math.floor((titles.length-1)*Math.random());var b=0;if(titles.length==0){dw+=rn}else{dw+=ry;dw+='<ul>';while(b<titles.length&&b<20&&b<maxresults){if(y!=-1){urls[c]=urls[c]+'?m=0'}if(commentYN=='yes'){comments[c]=' - '+commentsNum[c]}else{comments[c]=''};dw+='<li><a href="'+urls[c]+'" rel="nofollow"><img alt="'+titles[c]+'" src="'+thumb[c]+'"/></a><div class="title"><h4><a href="'+urls[c]+'" rel="nofollow">'+titles[c]+'</a></h4></div></li>';if(c<titles.length-1){c++}else{c=0}b++}dw+='</ul>'};urls.splice(0,urls.length);titles.splice(0,titles.length);document.getElementById('related-posts').innerHTML=dw};
//]]>
</script>
<b:loop values='data:post.labels' var='label'>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&quot;' type='text/javascript'/>
</b:loop>
<script type='text/javascript'>var maxresults=7;removeRelatedDuplicates();printRelatedLabels(&#39;<data:post.url/>&#39;);</script>
</div>
<div style='clear:both'/>
<script type='text/javascript'>
//<![CDATA[
function replaceText(){if(!document.getElementById){return;}
bodyText = document.getElementById("related-posts");
theText = bodyText.innerHTML;
theText = theText.replace(/s72-c/gi, "s200-c");
bodyText.innerHTML = theText;
}replaceText();
//]]>
</script>
 <div style='clear:both'/>

<div id='related_posts2'/>
<script type='text/javascript'>
//<![CDATA[
function relatedPostsWidget(a){(function(e){var f={blogURL:"",maxPosts:5,maxTags:5,maxPostsPerTag:5,containerSelector:"",tags:null,loadingText:"",loadingClass:"",relevantTip:"",rlt_summary:100,relatedTitle:"Các tin khác",readMoretext:"Chi tiết",rlpBlank:"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjun2mRBicmRpqaQa6ec975J2ogmfYqmd-Kvz3nA535KnJFmElYnC1Pgqdcdmjc3WXqW7Hr9NgeXE9L5cUAUSYwP7nL6l-2g2hpBN96T7ajDquUu26rjZ4AK-xqTBmQReiAupt4qXya1PA/s70-c/20.jpg",rlt_thumb:55,recentTitle:"Recent Posts",postScoreClass:"",onLoad:false};f=e.extend({},f,a);var k=0,b=null,g=null;if(!f.containerSelector){document.write('<div id="related_posts2"></div>');f.containerSelector="#related_posts2"}var c=function(t,n){k++;if(t.feed.entry){for(var o=0;o<t.feed.entry.length;o++){var r=t.feed.entry[o];var p="";for(var m=0;m<r.link.length;m++){if(r.link[m].rel=="alternate"){p=r.link[m].href;break}}if("content" in r){var l=r.content.$t}else{if("summary" in r){var l=r.summary.$t}else{var l=""}}var l=l.replace(/<\S[^>]*>/g,"");if(l.length>f.rlt_summary){var l=l.substring(0,f.rlt_summary)+"..."}var q=r.title.$t;if("media$thumbnail" in r){var s=r.media$thumbnail.url.replace(/\/s[0-9]+\-c/g,"/s"+f.rlt_thumb+"-c")}else{var s=f.rlpBlank}if(location.href.toLowerCase()!=p.toLowerCase()){i(p,q,s,l)}}}if(k>=f.tags.length){g.attr("class","");e("#related-posts2-loadingtext",b).remove();if(f.maxPosts>0){e("li:gt("+(f.maxPosts-1)+")",g).remove()}}};var i=function(p,s,u,l){var q=e("li",g);for(var o=0;o<q.length;o++){var t=e("a",q.eq(o));var r=j(t);if(t.attr("href")==p){h(t,++r);for(var n=o-1;n>=0;n--){var m=e("a",q.eq(n));if(j(m)>r){if(o-n>1){q.eq(n).after(q.eq(o))}return}}if(o>0){q.eq(0).before(q.eq(o))}return}}g.append('<li><a class="jdlunya" href="'+p+'" title="'+(f.relevantTip?f.relevantTip.replace("\d",1):"")+'"><span class="gmbrrltd"><img style="width:'+f.rlt_thumb+"px;height:"+f.rlt_thumb+'px;display: block" alt="'+s+'" src="'+u+'"/></span><strong>'+s+"</strong></a><p>"+l+'<a target="_blank" title="'+s+'" href="'+p+'">'+f.readMoretext+"</a></p></li>")};var j=function(l){var m=parseInt(l.attr("score"));return m>0?m:1};var h=function(l,m){l.attr("score",m);if(f.relevantTip){l.attr("title",f.relevantTip.replace("\d",m))}if(f.postScoreClass){l.attr("class",f.postScoreClass+m)}};var d=function(){if(f.containerSelector!="#related_posts2"){var l=e(f.containerSelector);if(l.length!=1){return}b=e('<div id="related_posts2"></div>').appendTo(l)}else{b=e(f.containerSelector)}if(!f.tags){f.tags=[];e('a[rel="tag"]:lt('+f.maxTags+")").each(function(){var n=e.trim(e(this).text().replace(/\n/g,""));if(e.inArray(n,f.tags)==-1){f.tags[f.tags.length]=n}})}if(f.tags.length==0&&!f.recentTitle){return}if(f.tags.length==0){e("<h4>"+f.recentTitle+"</h4>").appendTo(b)}else{if(f.relatedTitle){e("<h4>"+f.relatedTitle+"</h4>").appendTo(b)}}if(f.loadingText){e('<div id="related-posts2-loadingtext">'+f.loadingText+"</div>").appendTo(b)}g=e("<ul "+(f.loadingClass?'class="'+f.loadingClass+'"':"")+"></ul>").appendTo(b);if(f.tags.length==0){e.get((f.blogURL===""?window.location.protocol+"//"+window.location.host:f.blogURL)+"/feeds/posts/summary?max-results="+f.maxPostsPerTag+"&orderby=published&alt=json-in-script",c,"jsonp")}else{for(var m=0;m<f.tags.length;m++){e.get((f.blogURL===""?window.location.protocol+"//"+window.location.host:f.blogURL)+"/feeds/posts/summary/-/"+f.tags[m]+"?max-results="+f.maxPostsPerTag+"&orderby=published&alt=json-in-script",c,"jsonp")}}};if(f.onLoad){e(window).load(d)}else{e(document).ready(d)}})(jQuery)};
relatedPostsWidget({
related_title: "Các tin khác",
containerSelector: "#related_posts2",
maxPosts: 4,
loadingClass: "loadingxx",
rlt_thumb: 50
});
//]]>
</script> 
  
  
</b:if>

Mình đã đổi màu đánh dấu để các bạn chỉnh sửa cho phù hợp với size và giao diện của Blog mình 
Chúc các bạn thành công .