Theme Blogger dạng magazine phù hợp với web/blog tin tức

By Dda - September 10, 2021

Những theme dạng này có phong cách tạp chí, rất phù hợp với các bạn đang có ý định tạo blog tin tức. Mẫu có sẵn các widget tiện ích hiển thị bài đăng theo nhãn theo nhiều phong cách. Có giao diện dễ nhìn, tốc độ tải trang tương đối nhanh, dữ liệu có cấu trúc đầy đủ, dễ cài đặt, tích hợp nhiều chỗ đặt ads banner, như đầu trang, sidebar, trong bài viết...

Theme mình vừa sử dụng vừa custom lại có thể sẽ chưa hoàn chỉnh. Hy vọng các bạn sẽ phát triển nó.

Kiểm tra với PageSpeed Insights

Với Desktop

Với Mobile

Một số tính năng chính

Layout v3
Widget v2
Reponsive
Mobile Friendly
Breadcrumb
Related Posts
Recent Posts Widget
Popular Posts Widget

Một số Script dùng để lấy bài viết trong theme

<script>
  document.write(&quot;&lt;script src=\&quot;/feeds/posts/default/-/<Tên nhãn>?orderby=published&amp;alt=json-in-script&amp;callback=<Tên function>\&quot;&gt;&lt;\/script&gt;&quot;);
</script>

listfull

listpost

listtwowidget

sliderpost

Ngoài ra để chỉnh sửa số bài viết trong từng function. Bạn thực hiện tìm kiếm với tên function

Ví dụ:

function listtwowidget(t){for(var e=0;e<num;e++){var i=(d=t.feed.entry[e]).title.$t;if(e==t.feed.entry.length)break;for(var n,r=0;r<d.link.length;r++)if("replies"==d.link[r].rel&&"text/html"==d.link[r].type&&(d.link[r].title,d.link[r].href),"alternate"==d.link[r].rel){o=d.link[r].href;break}try{n=(n=d.media$thumbnail.url).replace("/s72-c/","/w"+thumb_width+"-h"+thumb_height+"-c/")}catch(t){s=d.content.$t,a=s.indexOf("<img"),b=s.indexOf('src="',a),c=s.indexOf('"',b+5),l=s.substr(b+5,c-b-5),n=-1!=a&&-1!=b&&-1!=c&&""!=l?l:no_thumb}(u=d.published.$t).substring(0,4);var l=u.substring(0,10),h=(u.substring(5,7),u.substring(8,10),new Array);h[1]="January",h[2]="February",h[3]="March",h[4]="April",h[5]="May",h[6]="June",h[7]="July",h[8]="August",h[9]="September",h[10]="October",h[11]="November",h[12]="December",document.write('<div class="btsp-left">'),document.write("<ul>"),document.write("<li>"),1==showpostthumbnails&&document.write('<a href="'+o+'"><div class="overlay"><img width="'+thumb_width+'" height="'+thumb_height+'" alt="'+i+'" src="'+n+'"/></div></a>'),document.write('<div class="btsp-item"><h3><a href="'+o+'">'+i+"</a></h3>"),document.write('<div class="published"><span>'+l+"</span></div></div>");document.write("</li>"),document.write("</ul>"),document.write("</div>")}document.write('<div class="btsp-right">'),document.write("<ul>");for(e=1;e<num2;e++){var o,d,i=(d=t.feed.entry[e]).title.$t;if(e==t.feed.entry.length)break;for(r=1;r<d.link.length;r++)if("replies"==d.link[r].rel&&"text/html"==d.link[r].type&&(d.link[r].title,d.link[r].href),"alternate"==d.link[r].rel){o=d.link[r].href;break}try{d.media$thumbnail.url.replace("/s72-c/","/w"+thumb_width2+"-h"+thumb_height2+"-c/")}catch(t){s=d.content.$t,a=s.indexOf("<img"),b=s.indexOf('src="',a),c=s.indexOf('"',b+5),l=s.substr(b+5,c-b-5),-1!=a&&-1!=b&&c}var u,l=(u=d.published.$t).substring(0,10);u.substring(0,4),u.substring(5,7),u.substring(8,10);1==showpostthumbnails2&&document.write("<li>"),document.write('<h3><a href="'+o+'">'+i+"</a></h3>"),document.write('<div class="published"><span>'+l+"</span></div>");document.write("</li>")}document.write("</ul>"),document.write("</div>")}!function(s){s.fn.lazyload=function(t){var n={threshold:0,failurelimit:0,event:"scroll",effect:"show",container:window};t&&s.extend(n,t);var r=this;return"scroll"==n.event&&s(n.container).bind("scroll",function(t){var e=0;r.each(function(){if(!s.abovethetop(this,n)&&!s.leftofbegin(this,n))if(s.belowthefold(this,n)||s.rightoffold(this,n)){if(e++>n.failurelimit)return!1}else s(this).trigger("appear")});var i=s.grep(r,function(t){return!t.loaded});r=s(i)}),this.each(function(){var e=this;null==s(e).attr("original")&&s(e).attr("original",s(e).attr("src")),"scroll"!=n.event||null==s(e).attr("src")||n.placeholder==s(e).attr("src")||s.abovethetop(e,n)||s.leftofbegin(e,n)||s.belowthefold(e,n)||s.rightoffold(e,n)?(n.placeholder?s(e).attr("src",n.placeholder):s(e).removeAttr("src"),e.loaded=!1):e.loaded=!0,s(e).one("appear",function(){this.loaded||s("<img />").bind("load",function(){s(e).hide().attr("src",s(e).attr("original"))[n.effect](n.effectspeed),e.loaded=!0}).attr("src",s(e).attr("original"))}),"scroll"!=n.event&&s(e).bind(n.event,function(t){e.loaded||s(e).trigger("appear")})}),s(n.container).trigger(n.event),this},s.belowthefold=function(t,e){return(void 0===e.container||e.container===window?s(window).height()+s(window).scrollTop():s(e.container).offset().top+s(e.container).height())<=s(t).offset().top-e.threshold},s.rightoffold=function(t,e){return(void 0===e.container||e.container===window?s(window).width()+s(window).scrollLeft():s(e.container).offset().left+s(e.container).width())<=s(t).offset().left-e.threshold},s.abovethetop=function(t,e){return(void 0===e.container||e.container===window?s(window).scrollTop():s(e.container).offset().top)>=s(t).offset().top+e.threshold+s(t).height()},s.leftofbegin=function(t,e){return(void 0===e.container||e.container===window?s(window).scrollLeft():s(e.container).offset().left)>=s(t).offset().left+e.threshold+s(t).width()},s.extend(s.expr[":"],{"below-the-fold":"$.belowthefold(a, {threshold : 0, container: window})","above-the-fold":"!$.belowthefold(a, {threshold : 0, container: window})","right-of-fold":"$.rightoffold(a, {threshold : 0, container: window})","left-of-fold":"!$.rightoffold(a, {threshold : 0, container: window})"})}(jQuery),$(function(){$(".overlay img").lazyload({placeholder:"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhTy9jpIYIRyaE3rjvrQ5x0k8O9NOWTKF73k8zYUrOY7FOimuRuJVUTh7jk3XkHKt-ggoGzMXmyZlw8KQXvQvlCO3P0ht6iYBZ1292pN-mCHETdbGdKOHxREIMsmbIX257trNLMG4Xd5Iw/s1600/lazyblank.gif",effect:"fadeIn",threshold:"0"})});var num=1,num2=10,showpostthumbnails=!0,showpostthumbnails2=!0,numchars=150,thumb_width=360,thumb_height=504,thumb_width2=120,thumb_height2=120,no_thumb="https://via.placeholder.com/150",no_thumb2="https://via.placeholder.com/150";

Tại đây, thực hiện sửa các num2= ? số bài viết...

Tải xuống ngay

Live Demo GDrive MediaFire

Comment xuống phía dưới nếu có lỗi, hoặc khó khăn trong việc cài đặt để mình hỗ trợ nhé!

Search This Blog

Blogtuan.info