(Thêm bài viết liên quan cùng chuyên mục vào Blogger) Đối với các Website tin tức và Website thương mại điện tử thì bài viết liên quan cùng chuyên mục hay sản phẩm liên quan cùng loại đã trở nên vô cùng quen thuộc. Nhờ có tiện ích bài viết liên quan này mà người xem dễ dàng tìm kiếm, xem thông tin đang quan tâm và thấy thân thiện hơn. Rõ ràng đây là một trong những yếu tố thu hút độc giả ghé thăm Website hàng ngày.
- B1: Đăng nhập vào Blog.
- B2: Trong Menu Template (Mẫu) chọn Edit HTML (Chỉnh sửa HTML).
- B3: Sử dụng tổ hợp phím Ctrl + F để tìm thẻ </b:skin>.
- B4: Copy đoạn code sau vào trước thẻ ]]></b:skin>.
float:none;
text-transform:none;
height:100%;
min-height:100%;
padding-top:15px;
padding-left:5px;
background:url(https://3.bp.blogspot.com/-_TIz21ryjr8/TgxAEZFq9KI/AAAAAAAAA_8/02FNsoyYnMw/s1600/post-bottom-bg.png) repeat-x scroll top left transparent !important;
clear:both;
display:block;
}
#related-posts{float:left}
#related-posts img{float:left;border:1px solid #BBB;margin-right:10px;width:36px;height:36px;background:#FFF;padding:3px}
#related-posts h3{
font-size: 12px;
font-weight: bold;
color: black;
margin-bottom: 0.5em;
margin-top: 0em;
padding-top: 0em;
}
#related-posts h4{
font-size: 12px;
font-weight: bold;
color: #004175;
padding-top: 0em;
}
#related-posts a:hover{
color:blue;
}
#related-posts ul{
list-style-type:none;
margin:0 0 0 8px;
padding:0px;
text-decoration:none;
font-size:12px;
color:#000000;
}
#related-posts ul li{
background: url(https://lh5.googleusercontent.com/-rfVRZ6kntoQ/UrVR92MW58I/AAAAAAAABIY/f9OTBDKHQR8/s6-no/li-dot.png) no-repeat scroll left center transparent;
display:block;
list-style-type:none;
margin-bottom: 6px;
padding-left: 20px;
padding-top:0px;
font-size:12px;
}
- B5: Sử dụng Ctrl + F tìm thẻ <div class=’post-footer’>.
Bạn lưu ý sẽ tìm thấy nó hai lần và bạn dừng lại ở thẻ thứ hai và copy đoạn code sau vào sau thẻ <div class=’post-footer’>.
<div style=’clear:both’/>
<div id=’related-posts’>
<script type=’text/javascript’>
var ry='<h4>Bài viết liên quan</h4>’;rn='<h4>Không có bài viết liên quan</h4>’;rcomment=’Nhận xét’;rdisable=’Tắt Nhận xét’;commentYN=’yes’;
</script>
<script type=’text/javascript’>
//<![CDATA[
var dw=”;titles=new Array();titlesNum=0;urls=new Array();timeR=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;timeR[titlesNum]=d.published.$t;if(‘media$thumbnail’ in d){thumb[titlesNum]=d.media$thumbnail.url}else{thumb[titlesNum]=’http://lh3.ggpht.com/–Z8SVBQZ4X8/TdDxPVMl_sI/AAAAAAAAAAA/jhAgjCpZtRQ/no-image.png’};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=titles[a];e.length+=1;e[e.length-1]=timeR[a];f.length+=1;f[f.length-1]=thumb[a];g.length+=1;g[g.length-1]=commentsNum[a]}}urls=b;titles=c;timeR=e;thumb=f;commentsNum=g}function contains(b,d){for(var c=0;c<b.length;c++){if(b==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);timeR.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=urls+’?m=0′}if(commentYN==’yes’){comments=’ – ‘+commentsNum}else{comments=”};dw+='<li><img alt=”‘+titles+'” src=”‘+thumb+'”/><div><h3><a href=”‘+urls+'” rel=”dofollow”>’+titles+'</a></h3><span>’+timeR.substring(8,10)+’/’+timeR.substring(5,7)+’/’+timeR.substring(0,4)+comments+'</span></div></li><div style=”clear:both”></div>’;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=10;removeRelatedDuplicates();printRelatedLabels(‘<data:post.url/>’);
</script>
</div>
<div style=’clear:both’/>
</b:if>
<!– Ket thuc bai viet lien quan –>
Lưu ý: max-results = 5 nghĩa là số lượng bài viết bạn muốn được hiển thị là 5.
- B6: Click Lưu mẫu để hoàn tất.
Trên đây là thủ thuật giúp Blog của bạn thân thiện và gây ấn tượng với người dùng hơn. Để hoàn thiện hơn cho Blog của mình, bạn có thể tham khảo thêm các bài viết hữu ích như hướng dẫn tạo website với blogger, tích hợp Google Translate vào Blogger, …