Hay sobat lapaklama.com, Pada kesempatan kali ini saya ingin menyebarkan panduan mudah Cara Membuat Daftar Isi di Blogger Keren Terbaru 2018. Daftar isi ialah merupakan daftar artikel yang ada didalam suatu blog/website dengan memperlihatkan internal link kepada semua artikel tersebut. Dengan daftar isi ini akan mempermudah pengunjung menemukan artikel yang mereka inginkan.
Sebenarnya saya tidak hanya pertama kali saja menciptakan artikel daftar isi menyerupai ini, Pada kesempatan-kesempatan sebelumnya saya juga sudah pernah menciptakan panduan cara menciptakan daftar isi di blog blogger ataupun wordpress, Namun diartikel ini daftar isi yang akan kita buat mempunyai desain yang keren yang penuh dengan warna yang sanggup menarik pengunjung untuk membaca artikel-artikel di blog kita.
Panduan Cara Membuat Daftar Isi di Blogger Keren Terbaru 2018 ini saya dapatkan dari blog Namima. Jika kau tertarik dengan daftar isi menyerupai gambar dibawah ini. Silahkan simak tutorial Cara Membuat Daftar Isi di Blogger Keren Terbaru 2018 dibawah ini.
Cara Membuat Daftar Isi di Blogger Keren Terbaru 2018
Langkah 1: Masuk kedalam dasboard blogger kau memakai akun Gmail yang sudah kau miliki.
Langkah 2: Kemduian pilih Menu Halaman dan Tambah Halaman Baru. dan pindahkan mode penulisan dari Compose ke HTML.
Baca Juga: Cara Membuat Sitemap Blog dengan Gaya Timeline
Langkah 4: Tambahkan Script dibawah ini kehalaman Tersebut dan ganti Link aciknadzirah.blogspot.com/ dengan link blog yang kau miliki. Selesai.
<div class="tabbed-toc" id="tabbed-toc"></div>
<script>
var tabbedTOC={blogUrl:"aciknadzirah.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>
<script src="https://rawcdn.gith4ck.com/Indzign/InSEO/master/daftarisikeren.js"></script>
<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>
Nah itulah panduan mudah Cara Membuat Daftar Isi di Blogger Keren Terbaru 2018, Jika kau suka dengan konten menyerupai ini, Silahkan share artikel ini kemedia sosial yang kau miliki. Terimakasih.
Sumber aciknadzirah.blogspot.com