loading...

Cara Membuat Sitemap Keren Blogger

CARA MEMBUAT SITEMAP OTOMATIS KEREN PADA BLOGGER

Cara Membuat Sitemap Keren Blogger

Selamat Datang di Blog Orang IT . Postingan saya sebelumnya mengenai Pemendek Link paling mahal se Asia kemudian 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

Cara Membuat Sitemap Keren Blogger
Buat Laman Baru
2. Masukkan Script berikut dalam mode HTML , ganti yang berwarna merah dengan URL blog anda silahkan dipilih tampilan Daftar ISi yang anda inginkan :

Cara Membuat Sitemap Keren Blogger
Pilih Mode HTML

Sitemap 1 : Source Code 
 
<link href="//cdn.rawgit.com/tovic/dte-project/0ef9de902cf286a77272f9b3c6f8168c17ab61c6/accordion-toc-skin.css" rel="stylesheet"></link>

<div class="table-of-content" id="table-of-content">
<span class="loading">Memuat...</span></div>
<div class="credit-link">
<a href="http://helmykkediri.blogspot.co.id/" title="Accordion TOC by Helmy Kurniawan">▶ Accordion TOC</a></div>
<script>
var toc_config = {
    url: 'http://helmykkediri.blogspot.co.id/',
    containerId: 'table-of-content',
    showNew: 10,
    newText: ' &ndash; <strong style="font-weight:bold;font-style:italic;color:red;">Baru!</strong>',
    sortAlphabetically: {
        thePanel: true,
        theList: true
    },
    maxResults: 9999,
    activePanel: 1,
    slideSpeed: {
        down: 400,
        up: 400
    },
    slideEasing: {
        down: null,
        up: null
    },
    slideCallback: {
        down: function() {},
        up: function() {}
    },
    clickCallback: function() {},
    jsonCallback: '_toc',
    delayLoading: 0
};
</script>
<script src="//cdn.rawgit.com/tovic/dte-project/0ef9de902cf286a77272f9b3c6f8168c17ab61c6/accordion-toc-1.js"></script>
Hasilnya :
Cara Membuat Sitemap Keren Blogger
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://helmykkediri.blogspot.co.id/feeds/posts/summary?max-results=1000&amp;alt=json-in-script&amp;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 :
Cara Membuat Sitemap Keren Blogger
SItemap 2
 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://helmykkediri.blogspot.co.id/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc">
</script></div>
Hasilnya : 
Cara Membuat Sitemap Keren Blogger
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 . Postingan saya sebelumnya mengenai cara memperbaiki sumberdaya di blokir pada google webmaster tools


Follow Blog Orang IT dan jangan lupa Like Fanspage helmykkediri serta jangan lupa klik iklan yang ada di blog ini untuk perawatan admin
Tunggu bos . . .

7 Responses to "Cara Membuat Sitemap Keren Blogger"

  1. jossss..gan, trmksh...sekarang tampilan sitemap punyaku jadi kerennnn...
    silahkank mampir di :http://gadingmasvideo.blogspot.co.id

    BalasHapus
  2. kang bisa mnta toling di bikinin textarea buat script sitemap nya ga ? biar bisa copy . kalo di salin teks doang takut eror .soalnya punya saya ga jadi jadi sitemapnya ziqri.xyz

    BalasHapus
  3. akhirnya berhasil dipasang di blog saya...kemarin nyoba dari tuttorial lain dengan model sitemap yang sama tapi gak mau muncul kalo yang ini akhirnya mau.

    BalasHapus
  4. ini nih sitemap yang saya cari tertata rapih, elegant, dan pasti akan membuat pengunjung termanjakan saat membuka sitemap nya

    BalasHapus
  5. Terima kasih...
    Teknik 1 & 2 Bekerja...

    BalasHapus
  6. Hmm Terima kasih Kang Helmy,,, sudah saya terapkan and it work,,, keren sudah tebar manfaat...

    BalasHapus
  7. cara menambah artikel di sitemap bagaimana

    BalasHapus

Terimakasih telah membaca artikel di Blog Orang IT , berikut tata cara berkomentar yang baik dan benar

1. Dilarang menyisipkan link aktif dikomentar blog

2. Dilarang meletakkan URL langsung di komentar blog

3. Komentar tidak relevans tidak akan disetujui

4. Berkomentar minimal 5 kata

5. Jangan buang waktu anda untuk nyepam karena tidak akan saya tampilkan komentar anda

6. Komentar sara jangan pake fake akun , kayak pecundang saja

Semoga anda berkenan menaati aturan yang saya buat sekian dan terimakasih