Tạo bài viết liên quan hay còn gọi là related post giúp cho người xem dễ dàng xem được những bài cùng chuyên mục khi đọc hết 1 bài viết, điều đó giữ chân khách ở lại lâu hơn khi xem trang của các bạn.
Khi blogspot của bạn có một danh sách các bài liên quan bên dưới mỗi bài viết sẽ giúp tăng Page Views. Điều này cung cấp cho độc giả nhiều thông tin liên quan hơn đến chủ đề mà họ đang theo dõi trên blog của bạn.
Thủ thuật này sẽ xuất hiện 2 phần 1 là danh sách bài liên quan có hình ảnh và một đoạn trích và 1 phần nữa là danh sách bài đăng ở dưới ở dạng liệt kê theo danh sách. ngoài ra còn hiện ngày tháng đăng bài khi chỉ chuột vào bài đăng.
Để hiểu rõ hơn các bạn có thể xem hình minh họa bên dưới.
Cách thực hiện như sau:
Bước 1: Các bạn vào Thiết Kế => Chỉnh sửa HTML sau đó dán đoạn Code bên dưới lên trên thẻ </head>
<!--Bài viết liên quan Start--> <b:if cond='data:blog.pageType == "item"'> <script type='text/javascript'> //<![CDATA[ var relatedTitles=[],relatedTitlesNum=0,relatedUrls=[],thumburl=[]; function related_results_labels_thumbs(f){for(var e=0;e<f.feed.entry.length;e++){var g=f.feed.entry[e];relatedTitles[relatedTitlesNum]=g.title.$t;try{thumburl[relatedTitlesNum]=g.media$thumbnail.url}catch(h){s=g.content.$t,a=s.indexOf("<img"),b=s.indexOf('src="',a),c=s.indexOf('"',b+5),d=s.substr(b+5,c-b-5),thumburl[relatedTitlesNum]=-1!=a&&-1!=b&&-1!=c&&""!=d?d:"undefined"!==typeof defaultnoimage?defaultnoimage:"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhil3MfXPSnaTQ4Kw5Zjcwlcfq45xhwB3GYW3P4pRamXDCtD9R4dF8JQJjInvdWub8FkwCNkHEoZy3PPdxwyE54JIWBkMFgSCNdkBJBPCngePgkkc3S3qe_X8ETRFOMTC9u06kLobtxnD4/s1600/noimage-namkna-blogspot-com-ngoctra.png"}35<relatedTitles[relatedTitlesNum].length&& (relatedTitles[relatedTitlesNum]=relatedTitles[relatedTitlesNum].substring(0,35)+"...");for(var i=0;i<g.link.length;i++)if("alternate"==g.link[i].rel)relatedUrls[relatedTitlesNum]=g.link[i].href,relatedTitlesNum++}} function removeRelatedDuplicates_thumbs(){for(var f=[],e=[],g=[],h=0;h<relatedUrls.length;h++)contains_thumbs(f,relatedUrls[h])||(f.length+=1,f[f.length-1]=relatedUrls[h],e.length+=1,g.length+=1,e[e.length-1]=relatedTitles[h],g[g.length-1]=thumburl[h]);relatedTitles=e;relatedUrls=f;thumburl=g}function contains_thumbs(f,e){for(var g=0;g<f.length;g++)if(f[g]==e)return!0;return!1} function printRelatedLabels_thumbs(f){for(var e=0;e<relatedUrls.length;e++)if(relatedUrls[e]==f||!relatedTitles[e])relatedUrls.splice(e,1),relatedTitles.splice(e,1),thumburl.splice(e,1),e--;f=Math.floor((relatedTitles.length-1)*Math.random());e=0;0<relatedTitles.length&&document.write("<h2>"+relatedpoststitle+"</h2>");for(document.write('<div style="clear: both;"/>');e<relatedTitles.length&&20>e&&e<maxresults;)document.write('<div class="lienquan"><a style="text-decoration:none;padding:3px;float:left;"'), document.write(' href="'+relatedUrls[f]+'"><img style="width:60px;height:40px;border:1px solid #A8A8A8;padding:4px;background:#fff;margin-right:4px; float: left;" src="'+thumburl[f]+'" /><span style="color: #006633;font-family: Arial;font-size: 12px;font-weight: normal;text-align: justify">'+relatedTitles[f]+"</span></a></div>"),e++,f<relatedTitles.length-1?f++:f=0;document.write("</div>");relatedUrls.splice(0,relatedUrls.length);thumburl.splice(0,thumburl.length);relatedTitles.splice(0,relatedTitles.length)} ; //]]> </script> <style type='text/css'> #related-posts {float:left;text-transform:none;height:100%;min-height:100%;padding:0;margin:10px 0 5px 0;} #related-posts h2{margin:0;background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvAw0cipEK-h_9kfw90DRvC-mc-u1-wZPwl6HfTULfo7Q3M6fceyuA9cxVxJfTA8NBTpOfW6WNerJAjrk7BoL_s_gqdCo4ArAtchUkYaEXhbUg4vrczGy5y8gVLWEOOF_SCQHrksrYqfxo/s248/newslienquan.jpg) no-repeat scroll left 0 transparent;height: 16px;} #related-posts a:hover {background-color:#FFA500} .lienquan {background: #87CEFA;height:57px;float: left;padding-left: 1px;width: 205px;margin:1px;overflow:hidden;line-height:1.4em} .related-posts {margin: 0;padding: 0} .related-posts ul {margin: 0;padding-top: 5px} .related-posts ul li {background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEicv7Y9DN_g9fQ1g2NqQCV6SyjHF403OR-xUcxlRUa2qaNNWmRWrBLcCqy-wqQoLDp4UqMhN1VFf1M2z2vEuhpeVGDCdBwkhvKziEpDG-tJ_QPBfLqcumyC10OwpC-gJC2NUileHBYxWUo/s1600/Star-icon.png) no-repeat top left;list-style-type: none;margin: 0 0 2px 5px;padding: 2px 0 0 18px;word-wrap: break-word} </style> <script type='text/javascript'> //<![CDATA[ var titles=new Array();var titlesNum=0;var urls=new Array();var time=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(d.link[a].rel=="alternate"){urls[titlesNum]=d.link[a].href;time[titlesNum]=d.published.$t;titlesNum++;break}}}}function removeRelatedDuplicates(){var b=new Array(0);var c=new Array(0);e=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]}}titles=c;urls=b;time=e}function contains(b,d){for(var c=0;c<b.length;c++){if(b[c]==d){return true}}return false}function printRelatedLabels(a){for(var b=0;b<urls.length;b++){if(urls[b]==a){urls.splice(b,1);titles.splice(b,1);time.splice(b,1)}}var c=Math.floor((titles.length-1)*Math.random());var b=0;document.write("<ul>");if(titles.length==0){document.write("<li>Không có bài viết liên quan</li>")}else{while(b<titles.length&&b<20&&b<maxresults){document.write('<li><a href="'+urls[c]+'" title="'+time[c].substring(8,10)+"/"+time[c].substring(5,7)+"/"+time[c].substring(0,4)+'">'+titles[c]+"</a></li>");if(c<titles.length-1){c++}else{c=0}b++}}document.write("</ul>");urls.splice(0,urls.length);titles.splice(0,titles.length)}; //]]> </script> </b:if> <!--Bài viết liên quan End-->
Lưu Template lại.
Bước 2: Chọn Mở rộng tiện ích mẫu và dán Code sau bên dưới dòng:
<div class='post-footer-line post-footer-line-2'/>Hoặc
<div class='post-footer-line post-footer-line-1'/>Code:
Trong đó các bạn chú ý:<b:if cond='data:blog.pageType == "item"'> <div id='related-posts'> <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_thumbs&max-results=9"' type='text/javascript'/> </b:loop> <script type='text/javascript'> var currentposturl="<data:post.url/>"; var maxresults=8; var relatedpoststitle=""; removeRelatedDuplicates_thumbs(); printRelatedLabels_thumbs(); </script> </div> <div style='margin-bottom:5px;clear:both'/> <img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiD8eJ0l6Bt8Z2jSNhjW1n3P-RjqzDsYITE26rwFOeDuq7JhH5M422JGnndaRQoPpmnQmEpR6R6Ph7G-OM2R5MUSuvaytynYcoDi3IYD2AnMxS3xwSjXojKjQwlbZIUicqOAhu6hRMcKNY/s1600/cac-tin-khac-dautoblog.jpg'/> <div class='related-posts'> <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=12;removeRelatedDuplicates();printRelatedLabels('<data:post.url/>');</script> </div> <div class='clear'/> </b:if>
- max-results=8" là số bài ở dạng thumbnail
- var maxresults=12 là số bài ở dạng list.
Chúc các bạn thành công!
Subscribe Our Newsletter
U
Trả lờiXóa