Ả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/AVvXsEiyl7XPuEXhiho1OrQlkkwpu19hOu_vQnKjAqAbKrTkf95_NYriBx4be3jGoBaiUAN9IvynkSYBLmF_mRxC0hZvqgto8urmzYTMnfo57Yz_hflJXzzNLNeGXidWUKMpGVDj_sNGlUjr-7Y7/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 == "item"'>
<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/AVvXsEiEa49EYj6HBGFH6TUmCYLh7QFpxvwEFIFxDgc_IydaTrWwJSTIPV99N_FLXRdyCFD0ghCvHKrnNhieNofw-6ZkDdZ7RM3QBqZyuHQgITquysMVI1e4xAg1jvubEiYZ4nhukF17cU5Z3mqV/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/AVvXsEh5PQWO1ZHxLiX6NWHL2oOV_LiFS36T2alCZ6Zeg7imtakMP_t_w08ppKoLCNJnHY6l0EJdX670IaWxUc5YdIocqOQxzCDI0zWs9b5bwibSCS35ZKRazrOYFUClq-JWLhF0yR19AJ-2ZOd0/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/AVvXsEjTDQqeZu4VInjtyojsex_Fc8vCZt6OdCvQPL9IdTE2EOJp1GxmkBu45BAygjnT_KX9KKu6KSiw-A_pXw-c3yMVMrpdNtNq-UaPIUHTO2fUScY0bSinpWG29C7iz1s_P0gv_ovoWLNXlCP0/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/AVvXsEjA8tA4Y4nWRG19e_p1zxp6dA5sMBr0IShEkrBwCrvoYsOVXV-yHdYEYbagLiyTnBcpdA9mpOVwm8iU9Q8qZxYqM1BCTvEI0P26v1p-VagzW-c_1CtM_mvTUtYa-x-pCU359WvtL7RYoyIB/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/AVvXsEhGCpl-09QMGs2odXIQqq1n6Nu2jmvKLA4wu1mWaT2ZI6BMh5xFsdUHPGPUx3AtzP3jlVhtQnP_d-xQtOhJ1fIONsp2GVq1Oxb53uRb6VvaC5dr5XcvzlWPE3Kif5HzlUzO_ipeYGpY5B4o/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/AVvXsEgPVihC4wFSB3ZX9MllccRFDanF_O5Fk0BxUNOCNYC1NntCNXwX-9sFuQM9xrVioZv0JeHZydY798Au5wXFkiUNV2_y-0NBJQhitGIXVbYgp1wMmPRUVMEFcQJeoQifmEidP7UlEHd-aQWn/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/AVvXsEgOOCzITAM3MzeEve4qN-id7HjXU6W1lX5Z9xJ6DLTBFHBEtlQHd4CK8NVKQEsKPLdUciCWFXCYSd8Z3LF3aqdGRe5wgUvXAbkkgdviOR6Y0y8j8NXdfJhNYGRoPTlRWsYz0oGWz4c99WIM/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/AVvXsEgmScx3u9c31E0saeiIy2QlYGyNc9Fch0Ytf7VPTZDaYwfz6YMMDBjYMfK-wsjy3cV4uHIf2rZCAQI4WtkY9OHpflpBQu6tL9BdpRkNZvnOzS0VgIv2GSSSQoWeOGeD9r7ppthjGaH_CGVc/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/AVvXsEjB0u-DHHzBXm1GosfEFMt3RTbGZi_tLx4KCC_kIAkBpCV6fit8tqbF0KYBVvM2jMLh78lVF6wKICYnMCxCGStBorn6FRe8M8bO9HizWJmx2LGDR4uaJ3_HHGHK4aJzuRtcxqHnLyXFmCl8/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='<h2>Các tin cùng chủ đề</h2>';rn='<h2>None Realated Posts</h2>';rcomment='Comments';rdisable='No Comments';commentYN='yes';</script>
<script type='text/javascript'>
//<![CDATA[
var nothumb='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhHKyO_1MvTHd74IGQoh2OEfcNpLkSWPDOjh4PVWb8V0GJl0u7Bp3mpNT6vYCa9Ne3Jab-9qStR-F07dErtX6R8SbKmm1-t4cTPAYigz6QKq8dJl0LtJ3bp4SWinthlFojY9J3qtimhMcw/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='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels"' type='text/javascript'/>
</b:loop>
<script type='text/javascript'>var maxresults=7;removeRelatedDuplicates();printRelatedLabels('<data:post.url/>');</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/AVvXsEjYyRBlmsx_-yiGZibUnkvU3z5wOQ5yZACR4PaKoxNRuB2TMapk7ekDf-uFnlOKK-OVkOIaQJKmrNWn1FgZmRvIBEMcX_oZ4XK0I5wZgjsMOV85UC0BD4pvbtHw5g6ixLHrm4jgFOHqhgE/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 .
Không có nhận xét nào:
Đăng nhận xét