Cara Membuat Sitemap/Daftar Isi Blog
Cara Membuat Sitemap Daftar Isi Blogger otomatis keren simple responsive dengan javascript.
1. Cara Membuat Sitemap/Daftar Isi Blog (seluruh isi postingan)2. Cara Membuat Sitemap/Daftar Isi Blog Berdasarkan label, topik/kategori tertentu
3. Cara Membuat Sitemap/Daftar Isi Blog(dengan frame dan background image)
4. Cara Membuat Sitemap/Daftar Isi Blog(dengan frame scroll)
Halo sobat blogger kali ini carasingkat akan memberikan tutorial blog khusus mengenai cara membuat sitemap atau daftar isi sebuah blog.
Ada 4 point atau model tentang cara membuat sitemap/daftar isi blog, semuanya sekaligus akan saya bahas satu persatu, untuk itu ikui pandan dan langkahnya dengan benar dan jangan sampai k etinggalan agar trik ini work 100%
Daftar isi atau yang sering disebut sitemap, merupakan sebuah panel widget yang biasanya dipasang pada sebuah halaman website. Fungsi widget daftar isi sebenarnya hanya memudahkan pengunjung untuk mengetahui apa saja isi yang terdapat didalam blog. hal ini tentunya sangat membantu pengunjung dalam mencari artikel tertentu.
Sama halnya seperti membuat daftar isi pada suatu halaman makalah atau buku , tentu pasti anda juga sudah tau fungsinya untuk apa, nah didalam blog kita juga bisa membuat daftar isi layaknya seperti sebuah buku. sebenarnya pembuatan sitemap sendiri sangatlah mudah, kta hanya perlu menerapkan beberapa kode dengan benar di blog.
Beberapa referensi yang saya cari di google banyak sekali yang menyediakan artikel tentang cara membuat daftar isi atau sitemap pada suatu blog, namun setelah mencobanya satu persatu walhasil tidak ada yang work alias jalan sesuai keinginan.
Untuk itu saya memutuskan untuk memodif beberapa script yang tidak work tersebut sehingga mendapatkan hasil yang diinginkan, kali ini daftar isi/ sitemap yang saya bagikan lengkap untuk membuat seluruh daftar isi yang tertera di blog. bahkan tidak ada satupun yang ketinggalan.
contoh screen shot hasil pembuatan sitemap/daftar isi nya berikut ini :
Sitemap diatas lengkap menampilkan seluruh label dan kategori yang ada pada blog, bahkan postingan yang baru dipost akan dibuat daftar isi nya sebagai bacaan yang terhangat hot/new.
Nah penasaran untuk bagaimana cara pembuatanya silahkan simak langkah dan caranya berikut ini dengan seksama.
#Model 1
Cara Membuat Sitemap/Daftar Isi Blog(seluruh isi postingan)
Untuk membuat sitemap/daftar isi anda bisa langsung membuatnya dihalaman blogger
1. Silahkan login kedashboard blogger anda
2. Lalu pilih menu halaman >> buat halaman baru
3. Ketikan judul halaman anda lalu pilih menu mode HTML
4. Langkah selanjutnya silahkan paste script berikut ini
<div dir="carasingkat" style="text-align: justify;" trbidi="on">
<script style="text/javascript" src="https://cdn.rawgit.com/mohammadkahfi/SoloLinks/f9f8ca32/daftarisi.js"></script><script src="http://www.carasingkat.com/feeds/posts/default?max-results=9999&alt=json-in-script&callback=loadtoc"></script>
</div>
<script style="text/javascript" src="https://cdn.rawgit.com/mohammadkahfi/SoloLinks/f9f8ca32/daftarisi.js"></script><script src="http://www.carasingkat.com/feeds/posts/default?max-results=9999&alt=json-in-script&callback=loadtoc"></script>
</div>
5. Lalu simpan Dan Publish
Catatan :Diatas merupakan cara membuat daftar isi kesluruhan blog anda lalu bagaimanakah jika anda ingin membuat sitemap atau daftar isi hanya berdasarkan label atau kategori tertentu ??mari kita masuk ke model yang kedua
Silahkan ganti URL tulisan merah dengan URL blog anda, ingat jika blog anda mengaktifkan https, maka rubah url http pada tulisan merah dengan https
#Model 2
Cara Membuat Sitemap/Daftar Isi Blog(berdasarkan label,topik/kategori tertentu)
Nah jika anda ingin sekali menampilkan sitemap/daftar isi untuk pembuatan sitemap dengan label atau kategori tertentu seperti gambar diatas.membuatnya sama seperti langkah diatas hanya saja berbeda beberapa script/codingnya. oke silahkan lansung saja ikuti langkahnya berikut ini :
1. Silahkan login kedashboard blogger anda
2. Lalu pilih menu halaman >> buat halaman baru
3. pilih menu mode HTML dan isikan judul halaman anda
4. lalu pastekan script dibawah ini
3. pilih menu mode HTML dan isikan judul halaman anda
4. lalu pastekan script dibawah ini
<script src="https://cdn.rawgit.com/mohammadkahfi/SoloLinks/790c7e1c/label.js"></script>
<br />
<h3>
TIPS</h3>
<ul>
<script src="http://carasingkat.com/feeds/posts/default/-/Tips?orderby=published&alt=json-in-script&callback=startpost&max-results=999"></script></ul>
<br />
<br />
<h3>
TIPS</h3>
<ul>
<script src="http://carasingkat.com/feeds/posts/default/-/Tips?orderby=published&alt=json-in-script&callback=startpost&max-results=999"></script></ul>
<br />
Catatan :Silahkan ganti URL tulisan merah dengan URL blog anda, Silahkan ganti nama TIPS dengan Nama LAbel ANDA.ingat jika blog anda mengaktifkan https, maka rubah url http pada tulisan merah dengan https, jika anda ingin menambahkan 1 label lagi silahkan copy dari tag <h3>sampai tag <br/>, lalu ganti dengan label yang ingin anda masukan
#Model 3
Cara Membuat Sitemap/Daftar Isi Blog(dengan frame dan background image)
Nah jika anda ingin sekali membuat sitemap / daftar isi dengan kreasi background gambar dan beberapa frame color silahkan anda berksperimen dengan script berikut :
<div style="background-image: url(https://mmls.mmu.edu.my/wordpress/1141123847/wp-content/uploads/sites/28924/2016/02/Light-Texture-Brown-Wood-HD-Wallpaper1-1024x640.jpg); border: 1px solid #999999; height: 100%; overflow: auto; padding: 10px; width: 100%px;">
<script src="https://cdn.rawgit.com/mohammadkahfi/SoloLinks/f9f8ca32/daftarisi.js"></script><script src="http://carasingkat.com/feeds/posts/default?max-results=9999&alt=json-in-script&callback=loadtoc"></script>
</div>
<script src="https://cdn.rawgit.com/mohammadkahfi/SoloLinks/f9f8ca32/daftarisi.js"></script><script src="http://carasingkat.com/feeds/posts/default?max-results=9999&alt=json-in-script&callback=loadtoc"></script>
</div>
Catatan :Silahka ganti URL tulisan biru, dengan url gambar anda. Silahkan ganti URL tulisan merah dengan URL blog anda, ingat jika blog anda mengaktifkan https, maka rubah url http pada tulisan merah dengan https
#Model 4
Cara Membuat Sitemap/Daftar Isi Blog(dengan frame scroll)
Untuk yang model nomor 4 ini anda dapat mengkreasikannya dengan frame scroll , nah untuk pembuatannya sama dengan cara diatas dan tentunya dapat andamodif scriptnya sesuai keinginan ada berikut kodenya
<div style="background-color: #f9f9f9; border: 1px solid #999999; height: 200px; overflow: auto; padding: 10px; width: 100%px;">
<script src="https://cdn.rawgit.com/mohammadkahfi/SoloLinks/f9f8ca32/daftarisi.js"></script><script src="http://carasingkat.com/feeds/posts/default?max-results=9999&alt=json-in-script&callback=loadtoc"></script>
</div>
<script src="https://cdn.rawgit.com/mohammadkahfi/SoloLinks/f9f8ca32/daftarisi.js"></script><script src="http://carasingkat.com/feeds/posts/default?max-results=9999&alt=json-in-script&callback=loadtoc"></script>
</div>
Semua kode diatas dapat anda modifikasi sesuai keinginan. sampai sini dulu perjumpaan kita kali ini Demikian lah tutorial mengenai cara Membuat Sitemap/Daftar Isi Blogger semoga informasi ini dapat bermanfaat.
EmoticonEmoticon