CARA MEMBUAT SITEMAP OTOMATIS
KEREN PADA BLOGGER
Selamat Datang kembali lagi setelah sekian lama gak ngepost cuy :D . Postingan kali ini akan
membahas tips blog Bagaimana cara membuat Peta Situs otomatis pada sebuah blog
dengan tampilan yang keren tentunya karena keberadaan peta sius ini sangat
penting untuk seorang blogger .
Sitemap
atau Peta Situs mirip seperti Daftar Isi yang menampilkan semua postingan anda
yang ada pada blog atau situs berdasarkan kategori label blog misal label
software , label game , label tutorial dan label trik tips komputer akan
ditampilkan dalam bentuk daftar isi lengkap sehingga memudahkan pengunjung
dalam me navigasi artikel blog anda.
Sitemap
adalah salah satu alat bantu untuk para webmaster yang mempermudah dalam
pengenalan peta situs di dalam website. Dengan begitu, mesin google dengan
mudah menjelajah dan meraih halaman-halaman yang ada di dalamnya. Sama halnya
dengan webiste pada umumnya, blog juga memerlukan sitemap agar mesin pencari
dengan mudah mendeteksi konten di dalamnya. Dalam sistem sitemap ini pengguna
dapat melakukan submit peta web berbasis XML langsung ke Google yang akan
membantu Google mengindeks halaman web dengan mudah.
Cara
Membuat Sitemap Daftar Isi Otomatis pada Blog :
1.
Login pada Dashboard anda , pilih menu laman dan buat laman baru dengan judul
misalnya Daftar isi
2. Masukkan
Script berikut dalam mode HTML , ganti yang berwarna merah dengan URL blog anda
silahkan dipilih tampilan Daftar ISi yang anda inginkan :
Sitemap
1 : Source Code
<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.rawgit.com/penaindigo/Pena-Indigo-Code/a134f9de/sitemappenaindigo.js"
type="text/javascript"></script>
<script
src="http://www.gabriels.tech/feeds/posts/default?max-results=9999&alt=json-in-script&callback=loadtoc">
</script></div>Hasilnya
:
Sitemap
2 : Source Code
<div
dir="ltr" style="text-align: left;"
trbidi="on">
<br
/></div><div 1px="1px" solid="solid"
style="height: 320px; overflow: auto; padding-bottom: 10px; padding-left:
10px; padding-right: 10px; padding-top: 10px; width: auto;">
<link
href="https://sites.google.com/site/republicofnote/script/SitemapV2.css"
media="screen" rel="stylesheet" type="text/css"
/>
<script
src="https://sites.google.com/site/republicofnote/script-1/daftarisipackv2.js"></script>
<script
src="http://www.gabriels.tech/feeds/posts/summary?max-results=1000&alt=json-in-script&callback=loadtoc"></script>
<script
type="text/javascript">
var
accToc=true;
</script>
<script
src="https://sites.google.com/site/republicofnote/script-1/daftarisiv2.js"
type="text/javascript"></script></div>
Hasilnya
:
Sitemap
3 : Source Code
<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:-moz-linear-gradient(right,#C2EAFE 0%,#055A85 40%);
background:-webkit-gradient(linear,left 10,right
80,color-stop(0.20,#055A85),color-stop(1,#C2EAFE));
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{t
ext-transform:uppercase;
}
.new{
color:#FF5F00;
font-weight:bold;
font-style:italic;
}
.postname{
font-weight:normal;
background:-moz-linear-gradient(right,#C2EAFE 0%,#fff 40%);
background:-webkit-gradient(linear,center 60,right
10,color-stop(0.60,#fff),color-stop(1,#C2EAFE));
}
.postname li{
border-bottom: #ddd 1px dotted;
margin-right:5px
}
</style>
<div id="toc">
<script
src="https://googledrive.com/host/0ByNodV_m9cVLR0pmWFgwZ1NmdW8/"
type="text/javascript"></script>
<script src="http://www.gabriels.tech/feeds/posts/default?max-results=9999&alt=json-in-script&callback=loadtoc">
</script></div>
Hasilnya
:
Sitemap 3
3. Simpan dan lihat hasilnya , jika anda kurang
puas silahkan cari di google
Demikian
postingan mengenai Cara Mudah Membuat Daftar Isi Otomatis pada Blog semoga
bermanfaat , jika ada yang ingin menambah silahkan .
