Cara Membuat Recent Post By Label Diblogger

Cara Membuat Recent Post By Label 

• Cari kode ]]></b:skin>.
• Kemudian copy kode CSS dibawah ini lalu tempel diatas kode yang tadi dicari.

/* Recent Post by Label - jagoredesign.my.id */
#Magazine-jagoredesign1{box-shadow:unset!important;border: 1px solid #eeeeee!important;}
#Magazine-jagoredesign1{margin-bottom:20px;background:#fff;border-radius:10px;border: 2px solid #ffffff;}
.Magazine-jagoredesign1 ul{list-style:none;margin:0;padding:0}
.Magazine-jagoredesign1 li{margin:0;padding:0}
.Magazine-jagoredesign1 .widget{margin:0;padding:0}
.Magazine-jagoredesign1 .widget-content{padding:20px;margin:0;word-wrap:break-word;overflow:hidden}
.Magazine-jagoredesign1 h2,.Magazine-jagoredesign1 h2{display: block;position:relative;margin:0;padding:15px 20px;font-size:16px;font-weight:700;text-transform:uppercase;color:#333;border-bottom: 1px solid #e9e9e9;}
.Magazine-jagoredesign1 h2{margin:20px 0 0 0}
.Magazine-jagoredesign1 h2:before{content:'\f143'}
.arab .Magazine-jagoredesign1 .index{float:left}
.Magazine-jagoredesign1 .index{font-size:10px;float:right;font-weight:400}
.Magazine-jagoredesign1 .index a{display:flex;color:#3498db;padding:3px 8px;border-radius:5px;font-weight:500;border:1px solid #3498db}
.Magazine-jagoredesign1 .index a:hover{background:#3498db;color:#ffffff;border:1px solid #ffffff}
.Magazine-jagoredesign1 .index a:after{content:'';width:15px;height:15px;}
.Magazine-hrt_left{width:280px;width:45.7%;float:left;margin:0;padding:0 20px 0 0;border-right:1px solid #e9e9e9}
.Magazine-hrt_right{width:250px;width:47.5%;float:right;margin:0;padding:0}
ul.Magazine-hrt_thumbs{margin:0;padding:0}
ul.Magazine-hrt_thumbs li,ul.Magazine-hrt_thumbs2{margin:0;padding:0}
ul.Magazine-hrt_thumbs .cat_thumb{overflow: hidden;position:relative;margin:0 0 15px;padding:0;border-radius:5px;}
ul.Magazine-hrt_thumbs .cat_thumb img{vertical-align: middle;height:auto;width:100%;transition:all .6s ease;}
ul.Magazine-hrt_thumbs .cat_thumb img:hover{transform:rotate(-3deg) scale(1.2);border-radius:15px;}
ul.Magazine-hrt_thumbs2 li{margin:0 0 10px;padding:0 0 10px;border-bottom:1px solid #e9e9e9;min-height:70px}
ul.Magazine-hrt_thumbs2 li:last-child{border-bottom:none;margin:0;padding:0}
ul.Magazine-hrt_thumbs2 .cat_thumb2{float:left;margin:0 10px 0 0;width:100px;height:70px;overflow:hidden;border-radius:5px;}
ul.Magazine-hrt_thumbs2 .cat_thumb2 img{height:auto;transition:all .3s ease}
ul.Magazine-hrt_thumbs2 .entry-thumb2 img:hover{transform:rotate(-3deg) scale(1.2);border-radius:15px;}
span.Magazine-hrt_title{font-size:20px;font-weight:700;display:block;margin:0 0 10px;line-height:normal;text-transform:none}
span.Magazine-hrt_title2{font-size:14px;line-height:1.4em;margin:0 0 3px}
span.Magazine-hrt_title a{color:#27334e}
span.Magazine-hrt_title a:hover{color:#6783e5;text-decoration:none}
span.Magazine-hrt_summary{display:block;line-height:1.6em;font-size:13px;text-overflow:ellipsis;margin:10px 0 0 0}
span.Magazine-hrt_meta{display:block;font-size:11px;font-weight:400;color:#aaa;}
span.Magazine-hrt_meta:before{content:'\f017';display:inline-block;font-family:'Font Awesome 5 Free';font-size:13px;color:#aaaaaa;font-weight:400;font-style:normal;margin:0 5px 0 0}
span.Magazine-hrt_meta a{color:#aaa;display:inline-block}
span.Magazine-hrt_meta_date,span.Magazine-hrt_meta_more{display:inline-block;margin-right:10px}
span.Magazine-hrt_meta_comment{display:none}
span.Magazine-hrt_meta_comment a:before{content:'';width:13px;height:16px;vertical-align:-6px;display:inline-block;margin-right:2px;background:url("data:image/svg+xml,") no-repeat;padding-right:5px}
span.Magazine-hrt_meta_comment a:hover{color:#6783e5!important}
ul.Magazine-hrt_thumbs2 li a:hover,ul.Magazine-hrt_thumbs li a:hover{color:#6783e5;text-decoration:none}
@media screen and (max-width:1024px){.Magazine-jagoredesign1 .widget-content{padding:20px 25px}.Magazine-hrt_left{width:50%;float:left;margin:0;padding:0;border-right:none}.Magazine-hrt_right{width:46%;float:right;margin:0;padding:0}ul.Magazine-hrt_thumbs .entry-thumb{width:100%;height:auto}ul.Magazine-hrt_thumbs .entry-thumb img{width:100%;height:auto}ul.Magazine-hrt_thumbs li{margin:0;padding:0}span.Magazine-hrt_title2{font-size:13px;line-height:1.2em}span.Magazine-hrt_summary{font-size:11px}}
@media only screen and (max-width:768px){.Magazine-jagoredesign1 .widget-content{padding:10px 20px}.Magazine-hrt_right{width:48%;margin:0;padding:0}ul.Magazine-hrt_thumbs2 li{border-bottom:0}span.Magazine-hrt_title{margin:0 0 5px}ul.Magazine-hrt_thumbs li{margin:0 0 10px;padding:0 0 10px;border-bottom:0}}
@media only screen and (max-width:480px){span.Magazine-hrt_summary{font-size:14px}.Magazine-hrt_left{width:100%;float:right}.Magazine-hrt_right{width:100%;float:left}}
@media only screen and (max-width:320px){.Magazine-jagoredesign1 .widget-content{padding:10px 20px}.Magazine-jagoredesign1 h2{padding:10px 20px 1px 20px}.Magazine-hrt_right{width:100%;float:left;margin:0;padding:0}ul.Magazine-hrt_thumbs li{margin:0 0 10px;padding:0 0 10px}span.Magazine-hrt_title2{line-height:1.2em}}
@media screen and (max-width:260px){.Magazine-jagoredesign1 .widget-content{padding:10px}.Magazine-jagoredesign1 h2{padding:10px 10px 1px 10px}.Magazine-hrt_right{width:100%;float:left;margin:0;padding:0}ul.Magazine-hrt_thumbs li{margin:0 0 10px;padding:0 0 10px}span.Magazine-hrt_title2{font-size:18px;line-height:1.2em}}

• Kemudian copy javascript dibawah ini lalu tempel diatas kode </head>

<script type='text/javascript'>
//<![CDATA[
// magazine
function labelthumbs(t){for(var e=0;e<numposts;e++){var n,r=t.feed.entry[e],m=r.title.$t;if(e==t.feed.entry.length)break;for(var i=0;i<r.link.length;i++){if("replies"==r.link[i].rel&&"text/html"==r.link[i].type)var l=r.link[i].title,o=r.link[i].href;if("alternate"==r.link[i].rel){n=r.link[i].href;break}}
var u;try{u=r.media$thumbnail.url,u=u.replace("/s72-c/","/w"+thumb_width+"-h"+thumb_height+"-c/")}
catch(h){s=r.content.$t,a=s.indexOf("<img"),b=s.indexOf('src="',a),c=s.indexOf('"',b+5),d=s.substr(b+5,c-b-5),u=-1!=a&&-1!=b&&-1!=c&&""!=d?d:no_thumb}
var p=r.published.$t,w=p.substring(0,4),_=p.substring(5,7),f=p.substring(8,10),g=new Array;g[1]="January",g[2]="February",g[3]="March",g[4]="April",g[5]="May",g[6]="June",g[7]="July",g[8]="August",g[9]="September",g[10]="October",g[11]="November",g[12]="December",document.write('<span class="Magazine-hrt_left">'),document.write('<ul class="Magazine-hrt_thumbs">'),document.write("<li>"),1==showpostthumbnails&&document.write('<a href="'+n+'"><div class="cat_thumb lazy-ify"><span class="rollover"></span><img width="'+thumb_width+'" height="'+thumb_height+'" alt="'+m+'" src="'+u+'"/></div></a>'),document.write('<span class="Magazine-hrt_title"><a href="'+n+'" target ="_top">'+m+"</a></span>");var v="";if(document.write('<span class="Magazine-hrt_meta">'),1==showpostdate&&(v=v+'<span class="Magazine-hrt_meta_date">'+g[parseInt(_)]+" "+f+","+w+"</span>"),1==showcommentnum&&("1 Comments"==l&&(l="1 Comments"),"0 Comments"==l&&(l="0 Comments"),showcomment='<span class="Magazine-hrt_meta_comment"><a href="'+o+'">'+l+"</a></span>",v+=showcomment),1==displaymore&&(v=v+'<span class="Magazine-hrt_meta_more"><a href="'+n+'" class="url" target ="_top">Read More...</a></span>'),document.write(v),document.write("</span>"),document.write('<span class="Magazine-hrt_summary">'),"content"in r)var y=r.content.$t;else if("summary"in r)var y=r.summary.$t;else var y="";var k=/<S[^>]*>/g;if(y=y.replace(k,""),1==showpostsummary)if(y.length<numchars)document.write(""),document.write(y),document.write("");else{document.write(""),y=y.substring(0,numchars);var $=y.lastIndexOf(" ");y=y.substring(0,$),document.write(y+"..."),document.write("")}
document.write("</span>"),document.write("</li>"),document.write("</ul>"),document.write("</span>")}
document.write('<span class="Magazine-hrt_right">'),document.write('<ul class="Magazine-hrt_thumbs2">');for(var e=1;e<numposts2;e++){var n,r=t.feed.entry[e],m=r.title.$t;if(e==t.feed.entry.length)break;for(var i=1;i<r.link.length;i++){if("replies"==r.link[i].rel&&"text/html"==r.link[i].type)var l=r.link[i].title,o=r.link[i].href;if("alternate"==r.link[i].rel){n=r.link[i].href;break}}
var x;try{x=r.media$thumbnail.url.replace("/s72-c/","/w"+thumb_width2+"-h"+thumb_height2+"-c/")}
catch(h){s=r.content.$t,a=s.indexOf("<img"),b=s.indexOf('src="',a),c=s.indexOf('"',b+5),d=s.substr(b+5,c-b-5),x=-1!=a&&-1!=b&&-1!=c&&""!=d?d:no_thumb2}
var p=r.published.$t,w=p.substring(0,4),_=p.substring(5,7),f=p.substring(8,10);1==showpostthumbnails2&&document.write('<a href="'+n+'"><div class="cat_thumb2 lazy-ify"><img width="'+thumb_width2+'" height="'+thumb_height2+'" alt="'+m+'" src="'+x+'"/></div></a>'),document.write("<li>"),document.write('<span class="Magazine-hrt_title Magazine-hrt_title2"><a href="'+n+'" target ="_top">'+m+"</a></span>");var v="";document.write('<span class="Magazine-hrt_meta Magazine-hrt_meta2">'),1==showpostdate2&&(v=v+'<span class="Magazine-hr_meta_date">'+g[parseInt(_)]+" "+f+","+w+"</span>"),1==showcommentnum2&&("1 Comment"==l&&(l="1 Comments"),"0 Comment"==l&&(l="0 Comments"),showcomment='<span class="Magazine-hrt_meta_comment Magazine-hrt_meta_comment2"><a href="'+o+'">'+l+"</a></span>",v+=showcomment),1==displaymore2&&(v=v+'<span class="Magazine-hr_meta_more Magazine-hrt_meta_more2"><a href="'+n+'" class="url" target ="_top">Read More...</a></span>'),document.write(v),document.write("</span>"),document.write("</li>")}
document.write("</ul>"),document.write("</span>")};
//]]>
</script>
<script type='text/javascript'>
var numposts=1,numposts2=5,showpostthumbnails=!0,showpostthumbnails2=!0,displaymore=!1,displaymore2=!1,showcommentnum=!0,showcommentnum2=!1,showpostdate=!0,showpostdate2=!0,showpostsummary=!0,numchars=75,thumb_width=280,thumb_height=200,thumb_width2=100,thumb_height2=100,no_thumb="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4n83f0ZsxYJcGN5AtTvgA8iu6krRgEJxyAMvabfp8s2H_5MgUK4o63y_Oot8R9H70yexZ3_WGih-WcnX8_MO23540mQ1_CldXWXvr77TXiqWPoIPCJaAq2JkE4OleaBBbqs4YRCz7GSI/s340-Ic42/newsmartpik_thumb.png",no_thumb2="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjXdXgcutIKSxiKU4j5bIhqmg77pDtqvVpxYMNrqFr32vR0MNU27h_CdsTIXoVtuEhd9vWR0V5ndISQ36dT_XsALK1ngIMR9NAu0oUnQdpKcCEEtpGd7_VTGPf-g8Nt38NgHmSNYBMQxEA/s100-Ic42/newsmartpikthumb_small.png";
</script>

• Kemudian tambahkan markup widget Recent Post dibawah ini sebelum markup widget Blog1

<b:if cond='data:blog.url == data:blog.homepageUrl'>
      <div id='Magazine-jagoredesign1-wrapper'>
        <b:section class='Magazine-jagoredesign1' id='Magazine-jagoredesign1' maxwidgets='1' showaddelement='yes'>
          <b:widget id='HTML80' locked='true' title='' type='HTML' version='2' visible='true'>
            <b:widget-settings>
              <b:widget-setting name='content'>Blogger</b:widget-setting>
            </b:widget-settings>
            <b:includable id='main'>
<h2><data:title/><span class='index'>&lt;a href=&#39;/search/label/<data:content/>?&amp;max-results=8&#39;&gt;View All&lt;/a&gt;</span><data:content/></h2>
<div class='widget-content'>
<script>
document.write(&quot;&lt;script src=&quot;/feeds/posts/default/-/<data:content/>?orderby=published&amp;alt=json-in-script&amp;callback=labelthumbs&quot;&gt;&lt;/script&gt;&quot;);
</script>
</div>
</b:includable>
          </b:widget>
        </b:section>
      </div>
</b:if>

• Kemudian simpan template anda.
• Untuk pengaturan widgetnya, klian bisa buka menu tata letak lalu masukkan Label yang anda inginkan.