Manfaat memasang recent post berdasarkan label di halaman statis ini akan tampil di pencarian google karena kita memasangkan halaman statis pada menu blog sehingga akan terindex oleh google kemudian pencarian google akan muncul nama link kategori blog kalian, jadi alangkah baiknya memasang widget recent post by label untuk mengganti halaman kategori di menu. baca juga Cara membuat widget random post bergerak pada blog
Untuk pemasangan widget itu sendiri tidak terlalu rumit cukup sederhana dan pemasangan widget ini tidak akan memberatkan loading blog anda, bahkan dengan memasang widget ini akan lebih nyaman untuk di lihat oleh pengunjung setia anda.
CARA MEMASANG RECENT POST BERDASARKAN LABEL UNTUK MENU BLOG
# Langkah 1: Masuk ke halaman dashboard blogger.com
Seperti biasa sebelum kita mengelola blog kita harus login terlebih dahulu dengan memasukan email dan password yang telah didaftarkan. Kemudian pilih menu Dashboard > Tema > Edit HTML.
# Langkah 2: Masukan script Fontawesome pada editor template
Masukan script HTML Fontawesome pada halaman editor blog, simpan script ini sebelum </head>
<script type='text/javascript'>
//<![CDATA[
function loadCSS(e, t, n) { "use strict"; var i = window.document.createElement("link"); var o = t || window.document.getElementsByTagName("script")[0]; i.rel = "stylesheet"; i.href = e; i.media = "only x"; o.parentNode.insertBefore(i, o); setTimeout(function () { i.media = n || "all" }) }
loadCSS("https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css");
//]]>
</script>Setelah copy & paste HTML diatas dan dimasukan di editor template anda kemudian tekan tombol simpan.
# Langkah 3: Membuat halaman statis dengan recent post by label
Pada langkah ini bertujuan untuk membuat halaman statis yang berisi postingan sebelumnya yang diurutkan kemudian disortir berdasarkan label atau kategori yang akan dipilih oleh anda. Caranya pilih menu Dashboard > Halaman > Entri baru. masukan script ini dibawah ini.
<div id="recentpostsae">
</div>
<div id="recentpostnavfeed">
</div>
<style scoped="" type="text/css">
*{padding:0;margin:0;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;-box-sizing:border-box}
a,a:link,a:visited{text-decoration:none;transition:all .3s}
button,input[type="button"],input[type="reset"],input[type="submit"],.button{border:0;color:#fff;cursor:pointer;font-size:14px;font-weight:400;padding:12px 16px;white-space:normal;width:auto;border-radius:3px;outline:0}button:focus,button:hover,input[type="button"]:focus,input[type="button"]:hover,input[type="reset"]:focus,input[type="reset"]:hover,input[type="submit"]:focus,input[type="submit"]:hover,.button:focus,.button:hover{color:#fff}
#recentpostnav{border:1px solid #585858;width:100%;margin:0 auto}
#recentpostsae{margin:0}
#recentpostsae .recentpostel{width:48.9%;background:#fff;display:inline-block;margin:0 20px 10px 0;padding:15px;overflow:hidden;box-shadow:0 2px 3px rgba(0,0,0,0.06),0 2px 3px rgba(0,0,0,0.1)}
#recentpostsae .recentpostel:nth-child(even){margin:0 0 10px 0}
#recentpostsae .recentpostel img{background:#ecf0f1;padding:0;float:left;margin:0;margin-right:13px;width:72px}
#recentpostsae .recentpostel h6,.recentpostel h6 a{text-decoration:none;font-size:14px;font-weight:400;margin:0;color:#000}
#recentpostsae .recentpostel:hover{background-color:#fefefe}
#recentpostsae .recentpostel p{font-size:12px;text-align:left;color:#555;line-height:normal;margin:5px 0}
#recentpostload{letter-spacing:-10px;text-align:center;background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhN2iBNUkg8VmVKThf2nvTtLXKwd3F-X29AieBBaZh6psKey5BCzQOQbixBjm5rvvhgkaad5LLGDuScU1yhcuaoITnqJ-KIaHYYfjEY0EB5DFtS0Ussaxa0hDdabXomtlF4obFmlS0PPMXC/s1600/ellipsis-preloader.gif) no-repeat 50% 50%;height:470px}
#recentpostnavfeed{display:table;padding:5px 10px 5px 0;text-align:left;margin:15px auto}
#recentpostnavfeed a{color:#141414;font-size:12px;font-weight:400;display:block;padding:5px 10px}
#recentpostnavfeed span{padding:0;cursor:pointer;transition:all .3s}
#recentpostnavfeed .next,#recentpostnavfeed .previous{position:relative;overflow:hidden;display:inline-block;background:#fff;color:#222;padding:10px 16px;font-size:1rem;border-radius:99em;box-shadow:0 2px 3px rgba(0,0,0,0.06),0 2px 3px rgba(0,0,0,0.1)}
#recentpostnavfeed .next{float:right;margin:0 0 0 10px}
#recentpostnavfeed .previous{float:left;margin:0 10px 0 0}
#recentpostnavfeed .home{text-align:center;display:table;background:#fff;color:#222;font-size:1rem;float:none;padding:10px 16px;border-radius:99em;margin:auto;box-shadow:0 2px 3px rgba(0,0,0,0.06),0 2px 3px rgba(0,0,0,0.1)}
#recentpostnavfeed a:hover,#recentpostnavfeed span.noactived{color:#ccc}
#recentpostnavfeed i{font-family:fontawesome;font-style:normal}
#recentpostnavfeed .next:hover,#recentpostnavfeed .previous:hover,#recentpostnavfeed .home:hover{background:#fff;color:#222;box-shadow:0 10px 21px rgba(0,0,0,0.15),0 6px 6px rgba(0,0,0,0.12)}
@media screen and (max-width:993px){#recentpostsae .recentpostel{width:100%;margin:0 0 10px 0}}
</style>
<script type='text/javascript'>
//<![CDATA[
var numfeed = 14;
var startfeed = 0;
var urlblog = "https://www.sobathusen.com/";
var charac = 0;
var urlprevious, urlnext;
function arlinafeed(e,t){for(var n=e.split("<"),r=0;r<n.length;r++)-1!=n[r].indexOf(">")&&(n[r]=n[r].substring(n[r].indexOf(">")+1,n[r].length));return n=n.join(""),n=n.substring(0,t-1)}function showrecentpostsae(e){var t,n,r,a,i,s="";urlprevious="",urlnext="";for(var l=0;l<e.feed.link.length;l++)"previous"==e.feed.link[l].rel&&(urlprevious=e.feed.link[l].href),"next"==e.feed.link[l].rel&&(urlnext=e.feed.link[l].href);for(var d=0;d<numfeed&&d!=e.feed.entry.length;d++){t=e.feed.entry[d],n=t.title.$t;for(var l=0;l<t.link.length;l++)if("alternate"==t.link[l].rel){r=t.link[l].href;break}i="content"in t?t.content.$t:"summary"in t?t.summary.$t:"",a="media$thumbnail"in t?t.media$thumbnail.url:"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEinXLsQcYMm4W0IRvmBhjmpI-weqf9XXS2YD7vSlOTP-G7OEOdgIZa82NfF5E-_F03LLAsmRXJeD78jdBZPgit4B4ylYI_mvvTNPLHCG23LfaK6XX94NPyW8Q00GhUAclENL5TvyhoXWzTH/s1600/no-image.png",s+="<div class='recentpostel'>",s+="<a href='"+r+"'><img src='"+a+"' /></a>",s+="<h6><a href='"+r+"'>"+n+"</a></h6>",s+="<p>"+arlinafeed(i,charac)+"</p>",s+="</div>"}document.getElementById("recentpostsae").innerHTML=s,s="",s+=urlprevious?"<a href='javascript:navigasifeed(-1);' class='previous'><i class='fas fa-arrow-left'></i></a>":"<span class='noactived previous'><i class='fas fa-arrow-left'></i></span>",s+=urlnext?"<a href='javascript:navigasifeed(1);' class='next'><i class='fas fa-arrow-right'></i></a>":"<span class='noactived next'><i class='fas fa-arrow-right'></i></span>",s+="<a href='javascript:navigasifeed(0);' class='home'><i class='fas fa-home'></i></a>",document.getElementById("recentpostnavfeed").innerHTML=s}function navigasifeed(e){var t,n;-1==e?(t=urlprevious.indexOf("?"),n=urlprevious.substring(t)):1==e?(t=urlnext.indexOf("?"),n=urlnext.substring(t)):n="?start-index=1&max-results="+numfeed+"&orderby=published&alt=json-in-script",n+="&callback=showrecentpostsae",incluirscript(n)}function incluirscript(e){1==startfeed&&removerscript(),document.getElementById("recentpostsae").innerHTML="<div id='recentpostload'></div>",document.getElementById("recentpostnavfeed").innerHTML="";var t=urlblog+"/feeds/posts/default/-/Photoshop"+e,n=document.createElement("script");n.setAttribute("type","text/javascript"),n.setAttribute("src",t),n.setAttribute("id","arlinalabel"),document.getElementsByTagName("head")[0].appendChild(n),startfeed=1}function removerscript(){var e=document.getElementById("arlinalabel"),t=e.parentNode;t.removeChild(e)}onload=function(){navigasifeed(0)};
//]]>
</script>Copy & Pastekan script diatas pada mode HMTL sebelum menyimpan, edit terlebih dahulu kode yang saya tandai blok warna biru pada script tersebut.
Catatan :
var numfeed = 14;
14 diatas adalah jumlah postingan setiap halaman akan ditampilkan 14 recent post atau 14 postingan sebelumnya.
Catatan :
var urlblog = "https://www.sobathusen.com/";
Ganti url tersebut dengan url alamat blog anda
Catatan :Terakhir beri judul pada halaman tersebut kemudian Publikasikan.
/feeds/posts/default/-/Photoshop
Ganti label yang ditandai diatas dengan label yang akan nanti ditampilkan.
# Langkah 4: Memasang Halaman Statis Ke Menu Blog
Terakhir pasang halaman statis ke menu blog dengan cara masuk ke Dashboard > Tema > Edit HTML. Kemudian cari menu dengan menekan tombol CTRL+F salin link halaman statis yang tadi dibuat kemudian pastekan di menu blog terakhir Simpan.
Anda dapat membuat beberapa menu kategori lainnya berdasarkan label dengan cara yang sama seperti diatas.
Sekian cara membuat recent post berdasarkan label untuk menu kategori blog, semoga bermanfaat dan membantu kalian yang mencari artikel yang dibahas ini. jika masih kesulitan dalam pembuatan bisa berkomentar di kolom yang telah disediakan. begitulah Memasang Recent Post Berdasarkan Label Untuk Menu Blog semoga membantu dan bermanfaat.