Share123.vn thông báo: Kể từ ngày 01/03/2019 chúng tôi sẽ chuyển hệ thống sang Webseo.com.vn, quý khách mua Template blogspot đẹp có thể truy cập vào hệ thống mới tại đây
Đăng bởi Huy Tập lúc 6/3/14 6
Một blog hoặc website có bài viết liên quan sẽ giúp cho website, blog thêm chuyên nghiệp và tạo thân thiện cho người dùng, có thể giữ được độc giả ở website của mình lâu hơn, lần trước mình đã giới thiệu một kiểu bài viết liên quan khá đẹp và chuyên nghiệp gồm cả list bài và hình ảnh ( Tham khảo: Hướng dẫn tạo bài viết liên quan cho blogspot đẹp và chuyên nghiệp )
bài viết liên quan có hình ảnh cho blogspot

Hôm nay share123.vn hướng dẫn các bạn tạo bài viết liên quan có hình ảnh cho những bạn sử dụng blogspot có thêm lựa chọn cho blog của mình
Cách làm:
Bước 1: bạn chèn đoạn CSS sau vào trước ]]></b:skin> #related-posts{float:left;width:auto;font:16px Arial;padding:3px solid #000;}
#related-posts h2{background:none;color:#be591c;font:18px Arial;margin-bottom:10px;padding:3px solid #ccc;}
#related-posts .maskolis_img{width:170px;height:139px;padding:5px 5px 0;}
#related-posts .maskolis_img:hover{opacity:.6;filter:alpha(opacity=60);-moz-opacity:.6;-khtml-opacity:.6;}
.postmeta{font-size:12px;font-weight:400;padding:2px 0;}
Bước 2: Chèn đoạn javacript sau vào trước </head>
<!-- lien quan by share123.vn --> <script type='text/javascript'>
//<![CDATA[
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/AVvXsEh5VQk6S1P9l3e_MxNmFpP5Z2FYheP2-CoVjkcfoqUTVgzmzelL4da6VpjPah_Y5Sz8uDIY7eQMaSgDy6k5rd1e0BrsoSI5bIRW1IvJrbQQrqfysp6d2R0hj9uudYnrF4gnRpKxgX-FYbOY/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>
Bước 3 Chèn đoạn code sau vào vị trí dưới bài viết thường là dưới <data:post.body/> <b:if cond='data:blog.pageType == &quot;item&quot;'>
<div style='clear:both'/>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<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_thumbs&amp;max-results=12&quot;' type='text/javascript'/></b:if></b:loop>
<script type='text/javascript'>
var currentposturl=&quot;<data:post.url/>&quot;;
var maxresults=6;
var relatedpoststitle=&quot;&quot;;
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs();
</script>
</div>
<div style='clear:both'/>
</b:if>
Sau đó lưu lại
Chúc bạn thành công
Nguồn Share123.vn
Tags:

6 nhận xét:

  1. sao mình làm không đước bạn ơi

    Trả lờiXóa
    Trả lời
    1. hướng dẫn chi tiết thế mà bạn, blog của bạn là gì

      Xóa
  2. blog của mình là http://www.tinhoc247.net/

    Trả lờiXóa
  3. blog của mình là http://www.tinhoc247.net/

    Trả lờiXóa
  4. mình cũng làm y chang các bước của bạn luôn đó. Nhưng ko thấy nó hiện ra. Giúp mình với
    Blog của mình là http://tours-thailan.blogspot.com/

    Trả lờiXóa
    Trả lời
    1. Bạn cho sai chỗ, giờ mình đang di làm, tối mình làm cho

      Xóa

Lưu ý: Khi để lại Nhận xét bạn nên click vào ô "Thông báo cho tôi" ở dưới để nhận phản hồi từ Admin

Tag liên kết

Đó chưa phải tất cả ... Chúng tôi còn 100 mẫu blog đẹp khác. View all Mẫu Template Blogger

Hãy nhanh tay gọi điện ngay đến chúng tôi theo số 0988227905 hoặc đặt hàng thiết kế ngay hôm nay theo mẫu form bên dưới.

Chúng tôi sẽ hoàn thành trong thời gian sớm nhất cho quý khách

Hãy truy cập để trải nghiệm dịch vụ của chúng tôi
Đã có
lượt Khách Hàng quan tâm đến dịch vụ của chúng tôi

Sử dụng nội dung ở trang này và dịch vụ tại Share123.vn có nghĩa là bạn đồng ý với Thỏa thuận sử dụng và Chính sách phát triển của chúng tôi.

www.Share123.vn - Website chuyên thiết kế blogspot, zip blogger, thiết kế blog chuẩn seo, blogger responsive, Thủ thuật Blogspot, Free Template Blogspot, kho giao diện blog đẹp, premium template blogger, free template blogger, Với kinh nghiệm nhiều năm trong nghề thiết kế Temple, design skin web chúng tôi cam kết tạo ra những sản phẩm chất lượng, tối ưu đến tay người dùng, thiết kế theo yêu cầu của quý khách, cùng đội ngủ support chuyên nghiệp nhiệt tình, ...

Copyright 2013 © Share123.vn - Blogger Team. All right Reserved - Hotline: 0988.227.905 - Email: nguyenhuytap@gmail.com - website: www.share123.vn

0988227905
Floating Image X