Update Terbaru, 30 April 2020
Sitemap atau daftar isi blog dirasa sangat penting untuk memberikan ruang informasi kepada pengunjung agar mengetahui seluruh isi artikel pada blog. Kali ini saya akan memberikan tutorial cara membuat sitemap keren otomatis dan fast loading di blog. Sebenarnya sitemap default dari blogger sudah tersedia, namun terlihat biasa dan tidak menarik. Nah, dengan membuat sitemap blog keren maka akan menajadi perhatian tersendiri dimata pengunjung dan ini akan menjadikan pengunjung betah di blog yang kita kelola.
Yang paling menarik dari sitemap seo ini adalah menampilkan sitemap otomatis sesuai dengan label, jadi menampilkan judul postingan sesuai dengan label yang ada. postingan terbaru akan secara otomatis masuk dalam daftar, jadi anda tidak perlu ribet memasukkan satu persatu. Memasang sitemap di blog blogger juga tidak membutuhkan skill untuk menguasai html, karena anda tinggal copas dan memasangnya pada halaman statis.
Baca Juga: Cara Membuat Menu Navigasi Responsive di Blogspot
Daftar Isi:
Sitemap SEO Keren dan Responsive Fast Loading
Berikut beberapa koleksi dari Pena Indigo untuk membuat sitemap keren. pilih salah satu sitemap dibawah ini lalu pasang pada laman blog anda. Jika anda memasang dengan benar maka sitemap sudah berhasil anda pasang di blog.
Sitemap Keren Responsive Versi 1
<style type="text/css">
#toc{width:99%;margin:5px auto;border:1px solid #2D96DF;
-webkit-box-shadow:4px 4px 8px 2px rgba(0,0,0, 0.2);
-moz-box-shadow:4px 4px 8px 2px rgba(0,0,0, 0.2);
box-shadow:4px 4px 8px 2px rgba(0,0,0, 0.2);}
.labl{color:#FF5F00;font-weight:bold;margin:0 -5px;
padding:1px 0 2px 11px;background: #3498DB;
border:1px solid #2D96DF;
border-radius:4px;-moz-border-radius:4px;
-webkit-border-radius:4px;box-shadow:3px 3px 1px #bbb;
-moz-box-shadow:3px 3px 1px #bbb;-webkit-box-shadow:3px 3px 1px #bbb;display:block;}
.labl a{color:#fff;}
.labl:first-letter{text-transform:uppercase;}
.new{color:#FF5F00;font-weight:bold;font-style:italic;}
.postname{font-weight:normal;background:#fff;margin-left: 35px;}
.postname li{border-bottom: #ddd 1px dotted;margin-right:5px}
</style>
<div id="toc">
<script src="https://cdn.jsdelivr.net/gh/penaindigo/Pena-Indigo-Code@a134f9def601a6f77332eccc35d3d20e0d3c7e49/sitemappenaindigo.js" type="text/javascript"></script>
<script src="/feeds/posts/default?max-results=9999&alt=json-in-script&callback=loadtoc">
</script></div>
Sitemap Keren Responsive Versi 2
<style type="text/css">
.tabbed-toc {margin:0 auto;background-color:#2f77bd;box-shadow: 0 0 7px rgba(5, 5, 5, 0.34);overflow:hidden;
position:relative;color:#333;border: 1px solid #9C9C9C;}
.tabbed-toc .loading {display:block;padding:10px 12px;font:normal bold 12px/normal Helmet,FreeSans,Sans-Serif;
color:white;}
.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;font:normal bold 12px/28px Helmet,Freesans,Sans-Serif;overflow:hidden;text-overflow:ellipsis;color:#fff;text-transform:uppercase;text-decoration:none;
padding:7px 15px;cursor:pointer;box-shadow: 0px 1px 1px rgb(255, 255, 255);}
.tabbed-toc .toc-tabs li a:hover {background-color:#4086E0;color:white;box-shadow: 0 0 7px rgba(0,0,0,.7);}
.tabbed-toc .toc-tabs li a.active-tab {background-color:#FFF;color:black;box-shadow: 0 0 7px rgba(0,0,0,.7);
z-index:5;margin:0 -1px 0 0;/* cursor:text; */}
.tabbed-toc .toc-content,.tabbed-toc .toc-line {width:80%;float:right;background-color:white;border-left:5px solid #1E84BC;box-sizing:border-box;}
.tabbed-toc .toc-line {float:none;display:block;position:absolute;top:0;right:0;bottom:0;box-shadow:0 0 7px rgba(0,0,0,.7);}
.tabbed-toc .panel {position:relative;z-index:5;font:normal normal 10px/normal Helmet,FreeSans,Sans-Serif;}
.tabbed-toc .panel li a {display:block;position:relative;font-weight:bold;font-size:12px;color:#000;line-height:20px;padding: 10px 12px;
text-decoration:none;outline:none;overflow:hidden;}
.tabbed-toc .panel li time {display:block;font-style:italic;font-weight:normal;font-size:10px;color:#666;float:right;}
.tabbed-toc .panel li .summary {display:block;padding:10px 12px 10px;font-style:italic;
border-bottom:4px solid #275827;overflow:hidden;}
.tabbed-toc .panel li .summary img.thumbnail {float:left;display:block;margin:0 8px 0 0;padding:4px;
width:72px;height:72px;border:1px solid #dcdcdc;background-color:#fafafa;}
.tabbed-toc .panel li:nth-child(even) {background-color:#66A9FF}
.tabbed-toc .panel li a:hover,.tabbed-toc .panel li a:focus,.tabbed-toc .panel li a:hover time,.tabbed-toc .panel li.bold a {
background-color:#333;color:white;outline:none;}
.tabbed-toc .panel li.bold a:hover,
.tabbed-toc .panel li.bold a:hover time {background-color:#222}
.post ol li::before {content: none;}
.post ol li {margin:0;}
@media (max-width:700px) {
.tabbed-toc {border:2px solid #333}
.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,.tabbed-toc .toc-tabs li a.active-tab {background-color:#2f77bd;box-shadow:2px 0 7px rgba(0,0,0,.4);}
.tabbed-toc .toc-tabs li a.active-tab {background-color:white;color:#333;}
.tabbed-toc .toc-content {border:none}
.tabbed-toc .toc-line,
.tabbed-toc .panel li time {display:none}
.tabbed-toc .panel li a{height: auto;}
</style>
<div class="tabbed-toc" id="tabbed-toc">
<span class="loading">Memuat…</span></div>
<script>
var tabbedTOC = {
blogUrl: "/", // Blog URL
containerId: "tabbed-toc", // Container ID
activeTab: 1, // The default active tab index (default: the first tab)
showDates: false, // `true` to show the post date
showSummaries: false, // `true` to show the posts summaries
numChars: 200, // Number of summary chars
showThumbnails: false, // `true` to show the posts thumbnails (Not recommended)
thumbSize: 40, // Thumbnail size
noThumb: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAA3NCSVQICAjb4U/gAAAADElEQVQImWOor68HAAL+AX7vOF2TAAAAAElFTkSuQmCC", // A "no thumbnail" URL
monthNames: [ // Array of month names
"Januari",
"Februari",
"Maret",
"April",
"Mei",
"Juni",
"Juli",
"Agustus",
"September",
"Oktober",
"November",
"Desember"
],
newTabLink: true, // Open link in new window?
maxResults: 99999, // Maximum post results
preload: 0, // Load the feed after 0 seconds (option => time in milliseconds || "onload")
sortAlphabetically: true, // `false` to sort posts by published date
showNew: 7, // `false` to hide the "New!" mark in most recent posts, or define how many recent posts are to be marked
newText: ' – <em style="color:red;">New!</em>' // HTML for the "New!" text
};
</script>
<script src="https://cdn.jsdelivr.net/gh/tovic/dte-project@2fd2d2971c3398029ea5e149696447243e7f4d94/tabbed-toc.min.js"></script>
Cara Memasang Sitemap Keren di Blog
Pertama, Silahkan login akun blogger anda, kemudian pilih “Laman” lalu klik tombol “Laman Baru” lihat gambar berikut:
Kedua, Isi judul laman dengan “Sitemap” atau “Daftar Isi“, Pilih Mode “HTML”
Ketiga, Pasang kode HTML sitemap pilihan anda, terakhir klik “Publikasikan”. Perhatikan gambar dibawah ini.
Keempat, Selesai dan lihat hasilnya.
Penting:
Jika mengalami eror atau tidak bisa tampil, silahkan hapus semua kode lalu paste kembali kode sitemap diatas dan langsung publikasikan tanpa mengembalikan ke mode compose.
Cara Membuat Sitemap XML untuk Submit Google Webmaster
Perlu diperhatikan bahwa sitemap ada 2 macam yaitu sitemap HTML dan sitemap XML. Untuk sitemap HTML seperti tutorial diatas yang dipasang pada laman blogger atau blogspot Anda, sedangkan sitemap XML untuk submit di google webmaster atau mesin pencari lainnya seperti bing atau yandex.
Berikut sitemap xml untuk blogspot atau blogger custom domain:
- Cukup menambahkan sitemap.xml diakhir url blog contoh:
https://penaindigo.blogspot.com/sitemap.xml - Sitemap atom yaitu menambahkan
feeds/posts/default?max-results=400jika ditambahkan pada url blog menjadihttps://penaindigo.blogspot.com/feeds/posts/default?max-results=400
Untuk submit sitemap di Google Webmaster Tools cukup menambahkan sitemap.xml saja lalu submit. Selesai.
Baca juga: Cara Mudah Membuat Fanspage Facebook Tampil di Blog
Sekarang sitemap pada blog anda sudah keren dan menarik, jangan lupa share tutorial ini agar bisa diketahui orang banyak dan lebih bermanfaat.
Sekian share info Cara Membuat Sitemap di Blog semoga dapat bermanfaat.
Kenapa punyaku kok gk bisa katanya pemberitaunnya di atas scriptnya error kenapa gan?
Sudah saya perbaiki mas, silahkan dicoba lagi. Sudah saya coba tidak eror. terima kasih sudah berkunjung.
sitemap yang versi 2 kok tampilannya cuma Memuat… gitu doang, solusinya gan?
Saya sudah cek diblog saya aman2 saja dan lancar. Mungkin bisa dicek terlebih dahulu apakah semua artikel sudah memiliki label atau belum?
Wah keren gan dengan cara pertama sudah berhasil dan bagus juga hasilnya gan.
Trimakasi tutornya gan
Mantap min sitemap yg kedua tampilan elegan bagus,, bagi saya msih pemula joss lah sangat bermanfaat info nya 🙂
#2018
Saya juga pemula Mas, semoga sitemapnya bermanfaat untuk membangun blog yang lebih baik.
sudah kupasang cakep keren
Nice gan, ijin praktik ya 🙂 masih newbie
silahkan mas, semoga bermanfaat.
terima kasih tutornya mas, tampilannya bagus ijin untuk copas saya masih baru
Silahkan mas, semoga bermanfaat.
wah ini dia sitemap yang bagus.
ijin pakai ya.
Bagus sitemapnya, saya pakai model yang seperti ini, sitemap blog lama saya pun juga saya ganti dengan yang ini. Terima kasih guys, sukses selalu untuk Anda.
Sukses juga buat anda. Selamat mencoba sitemapnya yang simple dan keren.
Silahkan mas, semoga pengunjung blognya lebih mudah untuk mencari artikel yang dicari.
perkenalkan saya blogger pemula, mas kok di blog saya sitemapnya gak jalan yah
Agar bisa jalan, saat memasukkan html jangan dikembalikan ke mode compose tapi langsung publish aja. sesuai dengan pengalaman cara ini berhasil. Terima kasih semoga dapat membantu.
terima kasih blognya sangat bermanfaat…
Sitemap Keren Responsive Versi 2 di saya ko malah blank ya om? kenapa ya…
Kalau terjadi blank, Setelah memasang kode sitemap pada mode HTML langsung publish aja, jangan dikembalikan ke mode compose.
Terima kasih Mas, kode sitemap dari Anda sukses dan work.
Salam kenal juga Mas..
wah keren nih sitemapnya responsive dan pasti pengunjung bakal termanjakan saat membuka sitemap blognya, wajib pakai diblog saya nih
Silahkan mas, pengunjung bisa dengan mudah mendapatkan artikel yang dicari. Selamat mencoba
makasih admin
bolehkah kode js nya saya reupload?
Silahkan mas, boleh juga dioprek agar tampilannya lebih menarik. selamat mencoba.
CSSnya mana soalnya modelnya berantakan
CSSnya sudah ada dibagian atas, silahkan ganti sesuai dengan keinginan.
Keren gan sitemap nya,makasih tutorialnya.nyari tutor di blog mana saja,dan akhirnya mendarat di blog ini ternyata tutornya detail.ternyata kesalahan saya sebelum nya yaitu setelah memasang html nya.saya klik compose hehe 😀
Iya mas Rizky, banyak blogger yang ingin pasang sitemap dengan kode yang sudah tersedia namun hasilnya sitemap tidak muncul. Akhirnya saja uji coba dan permasalahannya pada mode penulisan. Semoga dapat bermanfaat.
Mantap gan, baguss dan gampang praktekinnya.
Terima kasih…
Keren dan berhasil, Gan…
Wow cooool~
Banyak yang udah ga work di blog lain, thank you mas
Izin pasang sitemap nya ya mas
terima kasih banyak gan, yang ini sukses besar dan bagus..
Terima kasih…
Sudah berhasil memasang di blog saya…
maaf kalo kita publis lagi artikel baru apa langsung otomatis ada di sitemap mas
mohon penjelasannya
terimakasih
Sitemap yang saya bagikan ini sudah otomatis jadi setiap artikel baru akan secara langsung masuk pada daftar sitemap. Semoga bermanfaat
Thanx gan…
Sukses dipasang…
Mantap. Berhasil di blog saya, yang lain gak berhasil
Hahahaa…. mantaps gan, berhasil…. sebelumnya udah banyak coba tutorial yang lain, gagal total… terimakasih banyak.
gan, punya saya kok gagal terus ya? mohon bantuannya
Mohon perhatikan keterangan ini “Jangan klik mode Compose setelah memasang kode HTML”. Karena permasalahannya sering disitu.
Terima kasih sharingnya ya. It’s work in my blog. Saya coba dua duanya bisa dan sekarang saya pakai yang pertama.
Sama-sama, semoga dapat bermanfaat sehingga memudahkan pengunjung untuk mendapatkan artikel yang diinginkan.
terima kasih gan sharingnya gan, tapi kenapa ya pas diklik labelnya gak muncul daftar poastnya
URL blog pada scripnya sudah diganti dengan blognya mas Hasan belum? kalau belum silahkan diganti dulu. Semoga membantu
Wah keren banget gan.
Terimakasih tutorialnya sangat membantu.
Ijin pakai dan ijin disesuaikan dengan website saya
thanks gaess ini membantu saya .. saya pakai nomor 2 eh baru tahu ternyata harus di klik labelnya baru muncul artikel sebelah kirinya thanks ya sukdes selalu
Sama-sama Mas, Sitemap keren yang seo friendly memang sangat diperlukan oleh pengunjung untuk mendapatkan artikel yang dicari. Semoga blognya makin sukses.
saya pakai versi yang kedua, bagus dan rapi, terima kasih gan…
Saya coba pasang semua yang ada. tetapi staupun tidak bisa. kira-kira dimana masalahnya ya. mohon pencerahannya. terimakasih
Masih work kok gan, setelah pasang script di mode html langsung publish aja.
Ijin nanya gan. Apakah labelnya bisa dipilih? Maksudnya, apakah bisa saya tentukan label yang muncul dan mana label yang tidak muncul?
Bisa Mas Dicky, Namanya sitemap otomatis sesuai dengan label tertentu. Untuk tutorialnya akan segera dibuatkan. Ditunggu ya..
Thanks gan tutornya work
Maaf bang atau mas, sitemap nya di blog cuma bengong ya… di urlnya cuma begini, namablog.blogspot.co.id/#, ga bisa lihat sitemapnya, apa almt urlnya salah?cara nya gmn ya…pls help..thanks
Untuk mengambil URL yang valid, sebaiknya buka blog anda kemudian copy url home page lalu paste pada tempat yang sudah disediakan pada script. Pada komentar diatas sebaiknya pada akhiran url jangan ditambahi pagar # hilangkan saja.
mantep pak bro..ijin sruput
Monggo Mas Aufa, sitemap keren seo friendly siap menghiasi tampilan blog.
Mas ko sitemap nya ga permanen yah … Apa cuman di postingan itu doang yah minta pencerahan
Maksudnya tidak permanen gmna ya? sitemap ini dipasang pada laman statis dan akan update otomatis ketika ada artikel baru.
Gan mau nanya gmn caranya biar sitemapnya bisa berurutan sesuai abjad..??
yang saya maksud bukan urutan abjad labelnya..
Contoh : “label tutorial” tapi hasil urutannya ga sesuai abjad melainkan urutannya sesuai terakhir di publish..
Untuk itu harus edit kode .js, kalau menurut saya keren begitu Mas, so artikel yang baru sudah ditandai dengan keterangan New!.
mantap gan, scriptnya work =D
makasih gan, hehe
Pas diuji muncul 1 kesalahan
“Peta situs Anda terlihat seperti halaman HTML. Pakai format peta situs resmi saja.”
gimana solusinya Mas
Tidak masalah Mas, yang penting tampilan sitemapnya dapat terlihat dan memudahkan pengunjung untuk mencari artikel yang diinginkan.
punyaku kok cuma tampil garis biru ya?
Script sudah saya perbaiki, silahkan dicoba lagi untuk mendapatkan sitemap keren dan otomatis.
This is 100% work.
keren mas jadinya, thanks ya
Mas, di saya kok cuma tulisan “Memuat…” doang ya yang muncul…?
Ket: Sudah saya isi blog dg punya saya..
Mode sudah HTML, kalau saya pindah pada mode compose hanya terlihat kata “Memuat…” aja.
blogsaya(dot)blogspot.co.id/p/sitemap.html
Yg didaftarkan ke google search console apakah pakai /p/ itu atau
blogsaya(dot)blogspot.co.id/sitemap.html ini ya mas?
Sudah saya cek diblognya Mas Lukman, ternyata semua postingan tidak memiliki label atau tag. Jadi silahkan perbaiki dulu dengan memberikan label pada semua poastingan atau artikel. Pertanyaan yang kedua, untuk page atau halaman statis blogger memang menggunakan /p/ namun untuk daftar ke google webmaster bukan sitemap yang itu, tapi cukup menambahkan sitemap.xml saja pada halaman submit sitemap.
mantaf mas, pantesan belum dikasih label di postingannya
sitemap yg ke 1 knp tulisannya ada yg hitam dan biru ya ? ga seperti digambar biru semua? solusinya gmna?
Saya sudah coba normal aja, terkadang beda template hasilnya beda. coba gunakan sitemap yang kedua.
izin ctrl+d dulu ya bang
sebelumnya trimakasih atas informasi yang sangat bermanfaat ini 🙂
Terimakasih mas, ijin comot buat blog saya… sukses terus
Mas saya sudah praktekan dan muncul sitemapnya namun sayang hanya satu kategori aja dan itupun ga semua post muncul dikategori itu.
Kok bisa ya? saya sudah coba di blog yang lain lancar aja tidak ada masalah. Pake sitemap versi brpa?
Work gan. Aku pake yang ke dua. Biasanya yang pertama tapi udah bosen jadinya coba yang ke dua, hehe..
Keren banget Bang. Makasih atas ilmu yang bermanfaatnya…
Dua2 Nya keren mas bro, saya coba yang pertama. Kerennnn
Terima kasih “script” nya om…
bermanfaat sekali
masi ttp ada yang error gan.. tidak semua daftar isi tercantum kedalamnya..
Saya coba diblog yang lain lancar gan, itu ada 2 pilihan pilih yang terbaik aja.
Keren …
Terima kasih tutorialnya gan .. Sangat membantu 🙂
thanks infonya gan ijin nyoba
mas, apakah bisa di edit sitemap-nya menjadi dropdown? Caranya bagaimana?
Untuk yang versi dropdown sudah banyak yang share Mas, silahkan dicari di internet. Untuk yang saya bagikan silahkan kalau mau dimodifikasi, caranya cukup rumit jadi tidak bisa share disini.
Sitemap saya sudah running normal,tadinya saya coba gagal di blog saya motroz(dot)blogspot(dot)com .Thanks sudah sharing,Mas
Makasih kodenya Min.. udah saya pakai ke blog. Pengen nunjukin hasilnya, tapi malu karena jelas jenis blognya tabu untuk dibaca wkwk.. Sekali lagi makasih Min.. 🙂
ijin copas master guru..
saya mau iseng2 bikin blog…
wah hebat. ini lain daripada yang lain. Izin praktik mas. terima kasih telah berbagi
Silahkan Mas, sitemapnya masih hangat buat dipopulerkan. Agar tampilan makin keren dan pengunjung lebih mudah membaca artikel yang diinginkan.
tearima kasih ya gan
Terimakasih gan info nya mau praktek
Terima kasih banyak mas, sudah saya coba dan berhasil
Saya gunakan di blog saya dan hasilknya keren banget :)..Txs ya mas sudah berbagi
bang admin itu biar label new – nya jadi sedikit gitu gimana masa di blog saya semua artikel ber label new semua,
Saya sudah coba semuanya lancar, hanya artikel terbaru saja yang ada keterangan new. Saran saya gunakan pilihan sitemap lainnya untuk mengetahui letak kesalahannya.
barusan nyoba kok ndak berhasil nya, padahal sudah diganti nama web nya. knp ya ?
Pastikan pemasangan lewat mode HTML dan langsung publish aja jangan dipindah ke mode compose. Biasanya permasalahan itu yang sering terjadi. Semoga dapat membantu
Terimakasih bro, sangat membantu.
Btw, cara ganti warna biru nya gimana ya?
Sama-sama Mas Agas, untuk mengganti warna biru harus edit script .js terlebih dahulu baru bisa melakukan editing. Kalau belum paham sebaiknya gunakan yang ada aja.
ini cmn support http ya mas? di https selalu tidak tampil
Script sudah saya perbaiki, sekarang sudah support https. Bisa dicoba keduanya mungkin ada salah satu yang bisa dipakai.
mantap jiwa pilihan no 1 ane suka
Silahkan dipakai agar pengunjung lebih mudah untuk mencari artikel yang diinginkan.
terimakasih banyak gan, infonya sangat bermanfaat sekali, sukses slalu…..
Thanks ya mas, berhasil saya terapkan
Mantab Kode htmlnya, sitemap blog saya jadi lebih keren…terima kasih mas, Sukses slalu. Amin
Mantap Kang, its work. terimakasih banyak
makasi infonya gan izin coba ya..
Sebelumnya menambahkan laman sitemap ngikut tutorial di blog sebelah, tapi muncul peringatan di search console. Saya coba yg ini semoga ga ada peringatan di search console
Mas Huda, kalau untuk sitemap search console tidak memakai sitemap ini. Mas cuma menambahkan sitemap.xml saja. Karena sitemap ini hanya untuk pembaca blog saja.
Kalau saya hanya ingin menampilkan satu label aja gimana caranya mas?
Untuk menampilkan sitemap dengan satu label saja harus edit script terlebih dahulu.
Lain waktu akan saya posting tutorial membuat sitemal satu label atau sitemap perkategori. Mohon ditunggu ya.
Hi mas. Terima kasih tutorialnya
Tadinay saya coba yang versii 2 tapi gagal. Nda muncul menunya
Nah yang model no 1 yang berhasil
Terima Kasih ya mas
Salam dari Blogger Pontianak
Salam kenal juga dari Blogger Jepara, Sitemap memang penting untuk dipasang. Agar pengunjung bisa dengan mudah untuk mencari artikel yang diinginkan.
Yang model 1 gak bisa diciutkan gitu ya mas? Contohnya, kan menurut label tapi saya pengen diciutkan seperti model 2 biar nanti pengunjung yang milih label sama kontennya.
Terima kasih tutorialnya mas. semoga mas sukses selalu. amin
mantap saya suka….
Muantap tampilanya, ijin sedot gan
semoga sukses selalu & semakin banyak pengunjung blognya
Amin, semoga Kang Ayik juga semakin sukses.
Terimakasih ka. Jazakallah khairan
Sama-sama semoga blognya makin sukses.
Thanks to Mas Zain, tutorialnya sangat membantu saya. dan blog saya udah ada Daftar Isinya. 😀
Terimakasih mas Sitemapnya work dengan sempurna, tinggal menyesesuiakan dengan theme blog aja supaya serasi warnya..
Admin Pena Indigo, Mas Zain terima kasih banyak sitemapnya sangat bagus. Izin menggunakan sitemap dua.
Terkait sitemap dua. Kira kira bisa atau tidak mas, warnanya dari biru diubah ke hijau, dan caranya bagaimana mas?
Adakah tutorial terkait hal ini?
Sekali lagi terima kasih banyak mas, salam hangat
Untuk mengubah warna harus edit css terlebih dahulu, dan ini cukup rumit. Banyak sekali tutorial edit kode css, Namun di blog ini belum tersedia.
keren gan ijin copas ya sitemap nya
Silahkan Mas, langsung aja pasang di blognya agar pengunjung lebih mudah mencari artikel yg diinginkan.
Trims Gan, saya pake di blog saya
udah coba Kueren
thans ya gan tipsnya
Bagaimana cara mengubah Warna Font Label (css Labl)?
saya ubah tidak bisa, hanya baground yang bisa.
Blog di kuakecsitubondo(dot)online/p/daftar-isi.html
Saya lihat ada keterkaitan kode link dengan post-body, jadi untuk lebih mudahnya ganti aja pada bagian background judul label. Silahkan edit bagian .labl (background: #3498DB;) bisa ganti dengan warna putih #fff. Semoga dapat membantu.
Terimakasih tutorialnya, saya pakai yg nomor 1. karena saya coba yang nomor 2 tapi loading saja tampilannya
Kok punya saya gak muncul sitemap nya sih ??
saya blogger baru mau bertanya cara mengecek kinerja sitemap gimana ya? dan sitemap itu apa ya?
Perlu diperhatikan, sitemap itu ada 2 macam; 1. sitemap sebagai daftar isi blog, ini akan menampilkan seluruh postingan blog yang dapat dengan mudah diakses oleh pengunjung biasanya ditampilkan perkategori/label. 2. sitemap untuk mesin pencari seperti Google Webmaster Tools agar seluruh artikel bisa dengan mudah dikenali oleh mesin pencari. Silahkan baca penjelasannya disini: https://penaindigo.com/cara-daftar-blog-di-google-webmaster-tools/
Seperti itu penjelasannya, jika masih bingung boleh ditanyakan kembali. terima kasih
Makasih sahabat scriptnya…
Ijin sedot ya, aku mau pakai diblog aku, semoga blog ku bisa keren juga kayak blog ini.
Sama-sama gan, semoga blognya tambah mantap dan keren.
Keren sitemap nya, mas Zain. Permisi, boleh copas ya? Aku pakai versi 1.
Mau tanya, aku coba versi 2 tapi kolom labelnya koq terlalu sempit? Bagaimana cara mengubahnya agar lebih lebar?
Makasih banyak info dan tanggapannya.
Silahkan mas dipakai sitemapnya, versi 2 saya coba kolomnya normal-normal saja. Namun jika masnya ingin lebih lebar bisa edit bagian ini .tabbed-toc .toc-tabs li a silahkan tambahkan height: 35px; atau sesuai selera dan bagian lis post edit yang ini .tabbed-toc .panel li a silahkan tambahkan height: 35px (silahkan sesuaikan sendiri). Atau edit bagian paddingnya juga bisa (padding yang depan).
Semoga dapat membantu.
DARI SEKIAN BNYAK BLOG TUTOR CARA MMEBUAT SITEMAP 😀 cuman blog abang yg work thank you verry much bang sukses selalu
keren sitemapnya mas…. ijin copas mas…..
thank you very much…….
sukses selalu mas…
Silahkan mas, semoga blognya juga tambah sukses.
Work Gan Thank You.. 😀
Terima kasih mas zain atas tutorial sitemapnya sudah berhasil saya pasang di blog saya.versi 2 yg saya pakai.salam kenal mas zain.
Sama-sama Mas Dani, yang versi 2 memang keren dengan sentuhan tabulasi. Semoga tambah sukses blognya dan salam kenal juga sari saya.
Thanks info nya. Sangat bermanfaat dan berhasil. Mohon izin diaplikasikan mas.
Dah aku ikuti caranya berkali kali tetapi ku klik view hasilnya kode httml td itu napa
Itu karena pemasangan yang salah, untuk memasukkan kode html pada halaman harus memilih mode HTML bukan COMPOSE. Silahkan dicoba dan semoga berhasil.
wahhh thanks gan, work! aku pake yang versi 2
Terima Kasih banyak gan !
makasih banyak bro,,berhasil pasang yg versi 2 keren banget, sdh lama nyari2 kode sitemap keren kebanyakan error,akhirnya pake ini berhasil
Sama-sama Mas Anam, Insyallah kalau ada eror langsung saya perbaik.
thank you so much
Ijin comot gan.. semua script berhasil diterapkan dan bagus hasilnya. Mantap nih
work kak, makasih sudah share
Makasih …tersangat bermanfaat
Wah… terima kasih, sangat membantu sekali.
Sippp
Terima kasih
Terima kasih banyak, semoga kebaikan nya di balas sama yang di atas….
mas kenapa sitemap yg ke dua artikel yg muncul ada di bawah ya?
Sudah saya cek dan ternyata paddingnya 2.5 yang seharusnya 0.
Jadi silahkan tambahkan kode berkut:
.widget .post-body ul {padding: 0;}
Langsung saya pakai mas di blog saya, mantaf bang semoga bisa lebih ke index hehe
Kalau sitemap yang ini untuk pengunjung bukan untuk search engine jadi tidak ada pengaruhnya pada index.
Kalau masalah indek itu submit sitemap di google webmaster atau bing, tutorialnya sudah ada di blog ini.
Terima kasih
Luar biasa, saya merasa terbantu sekali dengan tips cara membuat sitemap ini. 100% works.
Padahal sebelumnya sudah mencoba memakai banyak sitemap tetapi nampaknya belum berjodoh. Akhirnya ketemu tutorial disini.
Terimakasih, sukses selalu untuk penadindigo.
Ini yang ane cari, gan. Soalnya kuatir sama yang rawgit ane. Boleh pakai ya Gan dan tengkiyu banyak, agan memang jempolan sumbernya langsung cdn dan jauh lebih meyakinkan he he he
Sudah saya gunakan dan berhasil gan
cuman ada beberapa masalah karena setelah saya daftarkan ke webmaster
terdapat error dan disarankan menggunakan Sitemap yang resmi
ada solusi gan?
Sitemap untuk google webmaster memang beda dengan sitemap ini. Sitemap ini untuk pengunjung saja gan, kalau sitemap untuk webmaster gunakan sitemap.xml
Izin copas kode sitemap bang, sama buat tutorial baru tentang sitemap. Artikel sangat bermanfaat terutama bagi saya yang masih awam banget di blog.
Silahkan Mas dipasang, jangan lupa kasih sumber link ya!
Terimakasih gan. Saya sudah pakai dan work.
gan kok pas di pasang site map kaya gini rata2 postingan saya ga ke baca semua ya ??
jadi yang muncul hanya beberapa saja di site map nya
itu gimana ya caranya
agar seluruh postingannya muncul semua di site map
Gunakan sitemap versi 1 atau 2?
Terimakasih banyak apa yang Anda bagikan sangatlah bermanfaat.
Terima kasih gan infonya, sudah saya pake…salam blogger
Terima Kasih, berhasil.
Gan saya menggunakan sitemap yang ke 2, tapi postingan terbaru ada di bawah ya?
Bagaimana caranya supaya postingan terbaru ada di atas?
Artikel diurutkan sesuai dengan abjad, jadi otomatis mengikuti urutan yang ada. kalau postingan terbaru ada keterangan new.
Terima kasih untuk solusinya, Admin. Blog saya sudah punya Sitemap seperti yang diarahkan untuk versi 1 diatas.
Mohon Ijin saya pakai versi yang kedua, bagus dan rapi, terima kasih banyak
Mantap gan saya suka, dan sudah saya pakai.
makasih saya pakai versi kedua, its work gan,, pas warna nya dengan template saya hehe
makasih ya gan untuk tutorialnya, sekarang jadi punya sitemap yang cakep hihihi
terima kasih sultan ….
Mas.. biar pengurutan postnya sesuai date gimana?
Ini sitemap nya diurutkan berdasarkan huruf kurang pas di blog saya
mantap tutorialnya hu, thx
Suwun mas, joss tutoriale.
Salam blogger Jepara.
Sama-sama mas, salam juga kebetulan Blogger Jepara
Keren banget tutorialnya. Alhamdulillah, saya langsung terpasang. terima kasih, ya….ditunggu tips2 berikutnya.
Ada yang harus di ganti ga bang di Scriptnya?
Tidak, langsung pasang saja dan akan secara otomatis muncul di blog.
Blog ane nambah ccuwaakep gan, pake yang versi 1 pas banget dengan coloring blognya, thanks ya gan.
Keren mas, saya modifikasi dikit warnanya supaya match sama blog saya.
Artikel nya menarik kak,udah tak coba di blog saya ngefek kak,mau coba bikin Thema kak,bikin artikel yang bahas tuntas kak biar laris
Membuat theme cukup ribet dan memerlukan banyak waktu, jadi saya belum bisa membuatnya. Paling hanya untuk konsumsi sendiri.
mantab agand, lgsg work
Bagus gan, makasih bermanfaat sekali :D, saya memakai yang sitemap 1. Saya pakai ya gan, makasih 🙂
Silahkan dipakai gan agar pengunjung lebih mudah mencari artikel yang diinginkan. Semoga bermanfaat
makasih banyak untuk sharingnya mas 🙂 akhirnya nemu code yang bisa muncul. Setelah nyoba dari beberapa provider hasilnya kosog terus yang ini akhirnya berhasil 🙂
semua tutorialnya keren mas, terimakasih langsung dicoba..
mantul gan..
pas banget lagi bikin blog baru
masih blm ada postingan jadi masih belum keliatan semuanya hehe
nice share gan
Oke gan, semoga semangat membuat artikelnya dan blog berkembang dengan baik.
Thanks gan, sangat membantu..
Sy kepincut sm versi 2 tapi gagal terus, versi 1 pun jadi deh.. thank you so much.. good luck ye!
Gagal ya Mas? nanti coba saya cek kembali masih berfungsi atau tidak.
terima kasih gan, tutor dan kodenya. semakin banyak artikel, semakin lama engunjung scroll halaman. he.. he.. he…
Terimakasih gan, sudah aktif sitemap saya.. mantul tutorialnya…
horreee sitemap saya berhasil om, terimakasih banyak, sangat bermanfaat.
Alhamdulillah, bisa diterapkan di blog saya setelah di copy scriptnya dan di pratinjau. jadi saya izin copas yaa min… Terima Kasih min…..
sitemap keren.. izin pakai min.. sukses selalu..
Sangat Membantu nihh
Mas, ini sitemap yg digunakan untuk pengindexan di google bukan? Kalau untuk index artikel ini, sitemapnya yg mana ya? Soalnya saya masih bingung untuk bikin sitemap yg untk terindex di google atau bing. Mohon penjelasannya.
Sitemap ini untuk pengunjung saja atau disebut sitemap HTML, untuk submit sitemap di webmater bisa gunakan sitemap xml. Pengguna blogspot atau blogger bisa menggunakan sitemap.xml kalau pengguna wordpress bisa isnstal plugin google xml sitemap.
mantap sitemapnya, terimakasih sudah membuka wawasan baru tentang blogger
Terimakasih gan, tutorial yg sangat membantu saya 😄 ijin make yg v2 ya 🙏🙏
Silahkan mas, tampilan sitemap HTML versi 2 memang keren cocok untuk blog jenis apa aja.
Siip, Keren yang kedua mas. Mantap ster.
Iya Mas, yang kedua memiliki tampilan yang simpel menggunakan tab jadi lebih menarik aja.
Mantap gan ijin copas ya
keren banget mas…ijin terapkan ya
Mantap banget Deh Tutorialnya Terima Kasih banyak Mas…:)
Saya baru pindah domain dari blogspot ke domain TLD. Semua tema juga saya rubah. Terimakasi atas tips nya karena website saya bisa tampil lebih keren lagi. Makasih makasih ……
Kembali kasih, sukses selalu bloggingnya.
saya ambil yg kedua mas.keren bangat.terima kasih mas 🙂
Kembali kasih gan, semoga pengunjungnya lebih mudah mencari artikel yang diinginkan.
wah mantap kak, untuk pemula seperti saya sangat bermanfaat kak, terima kasih kk. alhamdulillah berhasil.
ini apa akan muncul semua daftar kontennya ?
saya taruh samping, klo banyak apa ya ga jauh menjulur kebawah ?
terimakasih
Sebaiknya gunakan halaman statis untuk memasang sitemap di blog agar terlihat rapi.
Terimakasih mas infonya tentang menambahkan sitemap di blog. Mantap
mas, kok di blogku gak bisa yah? cm memuat aja…padahal sdh sesuai tutrial..apa templatenya atau apa..?
matursuwun mas..
Bisa saja themenya gan, bisa dicoba versi yang lain.
thanks mas berhasil dipasang dan tampilannya enak dipandang
Waduh, saya kok menerbitkan halaman-halaman itu malah di postingan biasa seperti saat membuat artikel, nukan di halaman sepert pada tutorial ini. Kira-kira efeknya apa, Mas? Menurut sampean saya pos ulang dan pidahkan di halaman atau dibiarkan saja, Mas? Terima kasih sebelumnya.
Harus dihalaman statis karena ini bukan untuk post tetapi widget blog.
wah site mapnya bagus, izin pake ya mas. terima kasih infonya
Terima kasih petunjuknya mas, blog ku sudah keren dengan Sitemap keren anda
Semoga blognya semakin berkembang kak.
Terima kasih sangat bermanfaat Artikel nya untuk blog pemula seperti saya
Thanks Mas, beneran simple. Semoga berkah
Izin pakai kodenya ya. Alhamdulillah, saya coba dua-duanya bisa, tapi yang kedua tampilannya sedikit berantakan di tampilan dekstop blog saya (judul labelnya kepotong, sama daftar postingannya posisinya di bawah, gak di sebelah atas samping labelnya) tapi kalau di tampilan selulernya terlihat cukup normal, mungkin karena pengaruh lebar blog atau yang lain, saya nggak terlalu ngerti, hehe…. Jadi, akhirnya saya pakai yang pertama. Sayang sekali sebenarnya, karena postingan di blog saya sudah cukup banyak dan ada banyak kategorinya, jadi versi yg kedua sebenarnya lebih cocok dipakai biar nggak terlalu panjang daftarnya.
Terima kasih
wah sitemapnya keren mas, ijin share juga di blog saya
SUMPAH INI KEREN BANGET….SEHAT DAN SUKSES SELALU BUAT ABANG YA…IJIN COPAS BANG
Terimakasih kak Sangat work
Kalo terjadi error pada sitmap ke 2 yang blogurl” isi dengan url blog kalian”
maksih tambahannya, bisa digunakan teman-teman lainnya.
thanks brother keren banget tampilan sitemapnya, izin pakai skripnya ya.
Simple dan mudah setingnya Bang
makasih Om atas sharing info cara buat sitemap-nya ^_^