Recent Post By Label Untuk Mengganti Halaman Kategori Di Menu

Menu pada blog adalah merupakan satu elemen penting di blog kita, dimana tujuannya adalah untuk memudahkan pengunjung kita menemukan halaman tertentu di blog sesuai tautannya yang telah kita buat kategorinya (label).

INFO, Penting untuk diketahui bahwa membuat tautan pada menu dengan menggunakan scrip seperti dibawah ini adalah suatu tindakan yang kurang relevan untuk Google Adsense.

"http :// codexscript. blogspot. co.id / search / label / Script%20Blogger"

Tidak relevan bukan hanya pada Google Adsene saja, juga berdampak pada Search Console , Structured Data Testing Tool, PageSpeed Insights, Rich Results Test, akhirnya blog kita tidak akan pernah masuk halaman pertama pencarian di google.

NAH, untuk itu lah kita perlu melakukan modifikasi pada tautan menu di blog kita. Agar selalu tampil dalam halaman statis. Bagaimana caranya..??? Silahkan ikut tip dibawah ini "Bila Anda Mau..??"

Untuk pengguna BLOGGER halaman statis dapat dilihat dari penggunaan /p/ pada akhir domain

codexscript.blogspot.co.id/p/script-blogger

PERTAMA
Siapkan sebuah halam statis yang akan kita gunakan sebagai lokasi pendaratan postingan berdasarkan kategori (label)

Contoh, bila anda telah membuat label Script Blogger maka kita akan membuat halaman statis dengan nama tersebut, tujuannya adalah agar memaksimalakan pencarian pada google search.

Buat Halaman baru (Pages)
Tulis Judul dengan nama label yang ada "Script Blogger" berikan keterangan deskripsinya, lalu masukkan kode script berikut:

<div id="result-desc">


</div>


<ul id="feed-container"></ul>


<div id="feed-nav">


</div>


<script type="text/javaScript">


var label="Template";


</script>

Ganti kode Script Blogger yang saya tandai di atas dengan LABEL yang ingin Anda tampilkan. Perlu diperhatikan, penulisan label ini harus sesuai dengan label sebenarnya, jika label yang diberikan dengan huruf pertamanya besar maka penulisan label di atas pun harus sama. Setelah itu Publikasikan lah halaman yang baru dibuat.

Liat hasil halaman statis yang baru dibuat, catatlah url dari halam statis tersebut.

CATATAN bagi pengguna BLOGGER
Bila blog Anda menggunakan akhiran domain .co.id maka ganti dengan .com
contoh

codexscript.blogspot.co.id;/p/script-blogger


mejadi


codexscript.blogspot.com/p/script-blogger

KEDUA
Masuk ke Pengaturan Tema > Edit HTML.
Cari kode </head> Lalu copy / pastekan Code di ini tepat diatas </head>

<b:if cond='data:blog.url == &quot;Copy Url Halaman Statis Tadi Disini;quot;'>

<style type='text/css'>

#table-outer{padding:7px 10px;margin:0 auto}

#table-outer table{width:auto;margin:0 auto}

#table-outer form{font:inherit}

#table-outer label{display:block;text-align:right;margin:0 10px 0 0;padding:4px 0 0}

#table-outer select[disabled]{opacity:.4}

#post-searcher{display:block;margin:0;padding:0}

#table-outer input,#table-outer select{width:100%;border:1px solid #dedede;border-radius:5px;margin:0;padding:5px;font-family: Roboto,sans-serif!important;font-size:16px!important;font-weight:500!important;text-transform:capitalize!important;outline:0;color:#333!important;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}

#table-outer select option{min-height:1.4em!important;}

#table-outer input#feed-q{padding:5px 10px!important;}

#feed-container{background:#fff;display:block;clear:both;margin:0;padding:0;list-style:none;overflow:hidden;position:relative;border-top:none}

#feed-container li{list-style:none;margin:0;padding:0;border-top:1px solid #eee;color:#555;width:auto;float:left;display:inline}

#feed-container li .inner{margin:15px 0;height:auto;overflow:hidden;word-wrap:break-word;text-overflow:ellipsis}

#feed-container li a{text-decoration:none;color:#2C2C2C;font-weight:500}

#feed-container li a:hover{text-decoration:none;color:#E94141}

#feed-container li .news-text{margin-top:5px;line-height:1.3em!important}

#feed-container li img{margin:0 15px 5px 0;padding:7px 7px 7px 0;float:left;display:block;}

#result-desc{margin:0;padding:0;}

#result-desc div,#result-desc span{display:block;margin:0;padding:5px 0 7px;color:#D64D52}

#result-desc div{color:inherit}

#feed-nav{margin:10px 0 30px;text-align:center;font-weight:500}

#feed-nav a,#feed-nav span{border:1px solid #dedede;border-radius:5px;padding:0;color:#757575;text-decoration:none;display:block;height:30px;line-height:32px}

#feed-nav a,#feed-nav span:hover{color:#1B1B1B}

#feed-nav a:active,#feed-nav a:hover{color:#555}

#feed-nav span{cursor:wait}

@media (max-width:600px){#table-outer table{margin:0 auto;width:100%}

#feed-container,#table-outer{margin:0 auto}

#feed-container li .inner{margin:5px auto;height:auto}

#feedContainer li{float:none;display:block;width:auto;height:auto}

#feed-container li .news-text, #feedContainer:after,#feed-container li img{display:none!important}

}

.post-body{min-height:300px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgijDAvXjfKleC5IIZtWbZpmuV1ptz_lDGPvR-A1KZ4pmT7To6RI-05d9cxZ5RAZvZBfE4a7iatP6nq8l4usfTVQIS47CYyIznNIZDvGv4MdfXjf39oYYiOn4B_N8z6I-Tbfp5rDVqMNPQ/w220-h19-no/ajax-loader+%25281%2529.gif)50% 50% no-repeat!important;}

</style>

</b:if>

Gantilah Copy Url Halaman Statis Tadi Disini dengan Url halam Statis yang Anda copy tadi
contoh

codexscript.blogspot.com/p/script-blogger

Bila Anda ingin membuat Menu Halaman Statis lebih dari satu maka gunakan kode conditional tag ini

<b:if cond='data:blog.url in {&quot;Copy Url Halaman Statis Tadi Disini&quot; , &quot;Copy Url Halaman Statis Tadi Disini&quot; , &quot;Copy Url Halaman Statis Tadi Disini&quot;}'>

<b:if cond='data:blog.url == &quot;Copy Url Halaman Statis Tadi Disini&quot;'>

KETIGA
Cari kode </body>. Lalu pastekan scrip ini tepat diatas </body>.

<b:if cond='data:blog.url == &quot;Copy Url Halaman Statis Tadi Disini&quot;'>


<script type='text/javascript'>


//<![CDATA[


document.write;var loadToc,loadCategories,_toc={init:function(){var e={homePage:"http://"+window.location.hostname,maxResults:10,numChars:270,thumbWidth:140,thumbHeight:95,navText:"Tampilkan artikel selanjutnya &#9660;",resetToc:"Kembali ke Awal",noImage:"http://2.bp.blogspot.com/-11FkySHGB5Y/TpZ6SSbsF2I/AAAAAAAAA94/zK10UaL7jgo/s1600/images.jpeg",loading:"<span>Memuat...</span>"},t=(window,document),n=function(e){return t.getElementById(e)},a={e:n("result-desc"),f:n("feed-container"),g:n("feed-nav"),h:t.getElementsByTagName("head")[0],i:0,j:null,k:"published",l:0,m:""},l={a:function(){old=n("temporer-script"),old.parentNode.removeChild(old)},b:function(e){var i=t.createElement("script");i.type="text/javascript",i.id="temporer-script",i.src=e,n("temporer-script")&&l.a(),a.h.appendChild(i)},c:function(t,n,i){a.i++,a.e.innerHTML=e.counting,a.g.innerHTML=e[1==t?"searching":"loading"],0===t?l.b(null!==n?e.homePage+"/feeds/posts/summary/-/"+n+"?alt=json-in-script&start-index="+(a.i*e.maxResults+1)+"&max-results="+e.maxResults+"&orderby="+i+"&callback=loadToc":e.homePage+"/feeds/posts/default/-/"+label+"?alt=json-in-script&start-index="+(a.i*e.maxResults+1)+"&max-results="+e.maxResults+"&orderby="+i+"&callback=loadToc"):1==t&&l.b(e.homePage+"/feeds/posts/default/-/"+label+"?alt=json-in-script&start-index="+(a.i*e.maxResults+1)+"&max-results="+e.maxResults+"&q="+n+"&orderby="+i+"&callback=loadToc"),a.j=null!==n?n:null,a.l=t,a.a.disabled=!0,a.b.children[0].disabled=!0},d:function(n){var i;if(a.g.innerHTML="",a.e.innerHTML="<div>Total: "+n.feed.openSearch$totalResults.$t+" Posts</div>","entry"in n.feed){for(var r,s,o,d,c=n.feed.entry,u="0 Komentar",m=0;m<e.maxResults&&m!=c.length;m++){r=c[m].title.$t,o="summary"in c[m]?c[m].summary.$t.replace(/<br ?\/?>/gi," ").replace(/<(.*?)>/g,"").replace(/<iframe/gi,"").substring(0,e.numChars):"",d="media$thumbnail"in c[m]?c[m].media$thumbnail.url.replace(/\/s[0-9]+\-c/,"/s"+e.thumbWidth):e.noImage.replace(/\/s[0-9]+\-c/,"/s"+e.thumbWidth);for(var h=0,b=c[m].link.length;b>h;h++)s="alternate"==c[m].link[h].rel?c[m].link[h].href:"#";for(var p=0,g=c[m].link.length;g>p;p++)if("replies"==c[m].link[p].rel&&"text/html"==c[m].link[p].type){u=c[m].link[p].title;break}i=t.createElement("li"),i.innerHTML='<div class="inner"><img style="width:'+e.thumbWidth+"px;height:"+e.thumbHeight+'px;" src="'+d+'" alt="'+r+'"><a class="toc-title" href="'+s+'" target="_blank" title="'+r+'">'+r+'</a><div class="news-text">'+o+'&hellip;<br style="clear:both;"></div></div>',a.f.appendChild(i)}i=t.createElement("a"),i.href="#load-more",i.innerHTML=e.navText,i.onclick=function(){return l.c(a.l,a.j,a.k),!1}}else i=t.createElement("a"),i.href="#reset-content",i.innerHTML=e.resetToc,i.onclick=function(){return a.i=-1,a.e.innerHTML=e.counting,a.f.innerHTML="",l.c(0,null,"published"),a.a.innerHTML=a.a.innerHTML,a.b.children[0].innerHTML=a.b.children[0].innerHTML,!1};a.g.appendChild(i),a.a.disabled=!1,a.b.children[0].disabled=!1}};loadToc=l.d,loadCategories=l.e,l.b(e.homePage+"/feeds/posts/default/-/"+label+"?alt=json-in-script&start-index="+(a.i+1)+"&max-results="+e.maxResults+"&orderby=published&callback=loadToc"),l.b(e.homePage+"/feeds/posts/default/-/"+label+"?alt=json-in-script&max-results=0&orderby=published&callback=loadCategories"),a.a.onchange=function(){a.i=-1,a.f.innerHTML="",a.g.innerHTML=e.counting,a.b.children[0].innerHTML=a.b.children[0].innerHTML,l.c(0,null,this.value),a.k=this.value},a.c.onsubmit=function(){return a.i=-1,a.f.innerHTML="",a.m=a.d.value,l.c(1,a.d.value,a.k),!1}}};_toc.init();


//]]>


</script>


</b:if>

Untuk conditional tag-nya silahkan samakan dengan conditional tag untuk CSS pada langkah kedua di atas.

OKE, sekarang simpalah setiap perubahan pada template yang sudah kita buat.

KEEMPAT
Sesuaikan tautan menu pada navigasi Anda dengan link yang telah dibuat pada halaman statis tadi.

Sehingga setiap kali kita melakukan klik pada navigasi menu akan diarahkan pada halaman statis tadi.

KELIMA
SELESAI, silahkan mencoba Navigasi Menu yang telah kita buat tadi.

Apabila Anda kurang mengerti silahkan menanyakan langsung pada kolom komentar.

Terimakasih

Recent Post By Label Untuk Mengganti Halaman Kategori Di Menu 2018-01-24T13:00:00+07:00 Rating: 4.5 Diposkan Oleh: Masyarakat Belajar