Bài viết liên quan cho blogspot

Bi viết liên quan hay Related posts thì các blog hướng dẫn cũng đã nhiều với các kiểu dáng cũng khác nhau rất đa dạng và phong phú.
Ở bài này xin giới thiệu một dạng bài viết liên quan cũng na ná các bài đã hướng dẫn chỉ hơi khác tẹo là icon đi kèm tiêu đề bài liên quan chính là favicon của blog.


xem demo tại  : http://bluetoothvn.blogspot.com/




Bước 1: 
Các bạn đăng nhập blog vào chỉnh sửa mẫu tìm tới thẻ </head> và dán trước nó đoạn code dưới đây:


<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type='text/css'>
#related-posts{width:100%;font-size:15px tahoma;margin: 15px 0 7px 0;}
#related-posts .widget{list-style-type:none;margin:5px 0 5px 0;padding:0;}
#related-posts .widget h2, #related-posts h2{font-size:20px;
font-weight:normal;margin:5px 7px 0; padding:0 0 5px;}
#related-posts a{text-decoration:none;}
#related-posts a:hover{text-decoration:none;}
#related-posts ul{border:medium none;margin:16px;padding:0;}
#related-posts ul li{display:block;background:url(/favicon.ico) no-repeat;
padding:0 0 1px 21px;margin-bottom:3px;line-height:1.6em;
border-bottom:1px dotted #cccccc;}
#related-posts ul li a{background:#fff;display:block;}
#related-posts ul li a:hover{background:#E9F5FB;}
</style>
<script type='text/javascript'>
//<![CDATA[
var relatedTitles = new Array();
var relatedTitlesNum = 0;
var relatedUrls = new Array();
function related_results_labels(json) {
for (var i = 0; i < json.feed.entry.length; i++) {
var entry = json.feed.entry[i];
relatedTitles[relatedTitlesNum] = entry.title.$t;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
relatedUrls[relatedTitlesNum] = entry.link[k].href;
relatedTitlesNum++;
break;
}
}
}
}
function removeRelatedDuplicates() {
var tmp = new Array(0);
var tmp2 = new Array(0);
for(var i = 0; i < relatedUrls.length; i++) {
if(!contains(tmp, relatedUrls[i])) {
tmp.length += 1;
tmp[tmp.length - 1] = relatedUrls[i];
tmp2.length += 1;
tmp2[tmp2.length - 1] = relatedTitles[i];
}
}
relatedTitles = tmp2;
relatedUrls = tmp;
}
function contains(a, e) {
for(var j = 0; j < a.length; j++) if (a[j]==e) return true;
return false;
}
function printRelatedLabels() {
var r = Math.floor((relatedTitles.length - 1) * Math.random());
var i = 0;
document.write('<ul>');
while (i < relatedTitles.length && i < 20) {
document.write('<li><a href="' + relatedUrls[r] + '">' + relatedTitles[r] + '</a></li>');
if (r < relatedTitles.length - 1) {
r++;
} else {
r = 0;
}
i++;
}
document.write('</ul>');
document.write('</font>');
}
//]]>
</script>

</b:if>


Bước 2:
Tiếp theo tìm tới thẻ <div class='post-footer'> và dán vào sau nó đoạn code sau:


<!-- Start Related post-->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'>
<font face='Arial' size='4'><b>Bluetooth cùng hãng sản xuất : </b></font>
<font color='#aaa'><b:loop values='data:post.labels' var='label'>
<data:label.name/><b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=10&quot;' type='text/javascript'/></b:if></b:loop> </font>
<script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();
</script>
</div>
</b:if>
<!--End Related post-->

Xong ròi, bấm lưu lại và xem kết quả.
Ở code này maxresults là số bài viết liên quan được hiển thị, mình đặt là 10
Chúc thành công!

    Blogger Comment
    Facebook Comment

0 nhận xét:

Post a Comment