Cara Memasang Sitemap Widget Halaman Statis Di Blogger
Cara Memasang Sitemap Widget Halaman Statis di Blogger - Sitemap atau daftar isi blog berisi daftar semua postingan yang sudah di terbitkan. Sitemap sangat berkhasiat bagi para pengunjung. Sehingga mereka dapat lebih gampang untuk mencari artikel yang ada di blog kita.
Sedangkan untuk blog yang sudah mempunyai berbagai postingan, aku mewajibkan untuk menambah Sitemap. Jika tidak, bagaimana caranya biar pengunjung lebih gampang mencari postingan yang dibutuhkan?
Note : Sitemap ini mempunyai fitur animasi pada bab bacground.
2. Ganti alamat url yang sudah aku tandai, dengan alamat website milikmu.
Beri nama halaman tersebut dengan nama "Sitemap" atau terserah kamu. SIMPAN!
3. Silahkan kalian buka halaman Sitemap Blog milik kalian.
Untuk Demo, silahkan klik tombol dibawah ini!
DEMO
Sedangkan untuk blog yang sudah mempunyai berbagai postingan, aku mewajibkan untuk menambah Sitemap. Jika tidak, bagaimana caranya biar pengunjung lebih gampang mencari postingan yang dibutuhkan?
Note : Sitemap ini mempunyai fitur animasi pada bab bacground.
Cara Memasang Sitemap Widget Halaman Statis
1. Pertama, masuk ke Dashboard Blogger > Halaman > Tambah Halaman Baru > Ubah ke HTML Mode. Lalu tambahkan instruksi berikut ini.
<div class="tabbed-toc" id="tabbed-toc"></div><script> var tabbedTOC={blogUrl:"https://iartikelindo.blogspot.com",containerId:"tabbed-toc",activeTab:1,showDates:!0,showSummaries:!1,numChars:200,showThumbnails:!0,thumbSize:60,noThumb:"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAA3NCSVQICAjb4U/gAAAADElEQVQImWOor68HAAL+AX7vOF2TAAAAAElFTkSuQmCC",monthNames:["Januari","Februari","Maret","April","Mei","Juni","Juli","Agustus","September","Oktober","November","Desember"],newTabLink:!0,maxResults:99999,preload:0,sortAlphabetically:!0,showNew:7,newText:' – <em style="color:red;">New</em>'}; </script><br /> <script src="https://rawcdn.githack.com/galih977/hello-world/70cb997c72692b723a05ce9ec6cc52b68198a45c/daftarisigradient.js"></script><br /> <style scoped="" type="text/css"> .tabbed-toc{margin:0 auto;position:relative;background:linear-gradient(-45deg,#EE7752,#E73C7E,#23A6D5,#23D5AB);background-size:400% 400%;animation:Gradient 15s ease infinite} .tabbed-toc .loading{display:block;padding:2px 12px;color:#fff} .tabbed-toc ul,.tabbed-toc ol,.tabbed-toc li{margin:0;padding:0;list-style:none} .tabbed-toc .toc-tabs{width:20%;float:left} .tabbed-toc .toc-tabs li a{display:block;overflow:hidden;color:#fff;text-decoration:none;padding:12px;font-size:13px;transition:all .3s} .tabbed-toc .toc-tabs li a:hover{background-color:rgba(0,0,0,0.05)} .tabbed-toc .toc-tabs li a.active-tab{background:rgba(0,0,0,0.05);position:relative;z-index:5;margin:0 -1px 0 0} .tabbed-toc .toc-content,.tabbed-toc .toc-line{width:80%;float:right;background-color:#fff;box-sizing:border-box} .tabbed-toc .toc-line{float:none;display:block;position:absolute;top:0;right:0;bottom:0} .tabbed-toc .panel{position:relative;z-index:5} .tabbed-toc .panel li a{color:#1277cb;display:block;position:relative;font-weight:500;font-size:14px;padding:6px 12px;overflow:hidden} .tabbed-toc .panel li time{display:block;font-weight:normal;font-size:11px;color:#666;float:right} .tabbed-toc .panel li .summary{display:block;padding:10px 12px 10px;font-size:13px} .tabbed-toc .panel li .summary img.thumbnail{float:left;display:block;margin:5px 8px 0 0;width:72px;height:72px;background-color:#fafafa} .tabbed-toc .panel li{background-color:#f9f9f9;margin:0} .tabbed-toc .panel li:nth-child(even){background-color:#fff} .tabbed-toc .panel li a:hover,.tabbed-toc .panel li a:focus,.tabbed-toc .panel li.bold a{background-color:rgba(0,0,0,0.03);outline:none} .tabbed-toc .panel li a em{background:#f39c12;color:#fff!important;font-style:initial;font-size:11px;margin:0 0 0 5px;padding:2px 10px;border-radius:22px} .tabbed-toc .panel li:before{display:none} @-webkit-keyframes Gradient{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}} @-moz-keyframes Gradient{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}} @keyframes Gradient{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}} @media (max-width:768px){.tabbed-toc .toc-tabs,.tabbed-toc .toc-content{overflow:hidden;width:auto;float:none;display:block}.tabbed-toc .toc-tabs li{display:inline;float:left}.tabbed-toc .toc-tabs li a.active-tab{background-color:rgba(64,64,64,0.1)}.tabbed-toc .toc-content{border:none}.tabbed-toc .toc-line,.tabbed-toc .panel li time{display:none}} </style>2. Ganti alamat url yang sudah aku tandai, dengan alamat website milikmu.
Beri nama halaman tersebut dengan nama "Sitemap" atau terserah kamu. SIMPAN!
3. Silahkan kalian buka halaman Sitemap Blog milik kalian.
Untuk Demo, silahkan klik tombol dibawah ini!
DEMO
