cara membuat sitemap blog 4 tampilan keren dan berbeda cara membuat sitemap blog 4 tampilan keren dan berbeda - Berbagi Tutorial Menarik cara membuat sitemap blog 4 tampilan keren dan berbeda | Berbagi Tutorial Menarik

Iklan Semua Halaman

cara membuat sitemap blog 4 tampilan keren dan berbeda

Rabu, 11 Januari 2017


 cara membuat sitemap blog 4 tampilan keren dan berbeda

Hasil gambar untuk sitemaps
saya akan memberikan cara untuk membuat sitemap pada blog. Langsung saja ada 4 tampilan sitemap yang berbeda dan bagus-bagus, yaitu:

Berikut cara untuk membuat sitemap / daftar isi otomatis di Blogger :

1.Masuk ke akun blogger
2.Pilih menu 'Laman'
3.Buat laman baru di blog anda (Klik tombol 'Laman baru' > 'Laman kosong')
4.Kemudian Pilih mode 'HTML' bukan compose ya.
5.Dan beri judu padal Daftar Isi atau Sitemap (judul terserah anda) Masukkan kode utama sebagai berikut
6.Ganti kode 'mizipedia.com' yang bewarna merah dengan alamat blog anda
7.Kemudian Publikasikan

Daftar Isi / Sitemap dengan Thumbnail berkotak-kotak


<script 'text / javascript' style => var numposts = 999; showpostthumbnails var = true; var displayseparator = true; </ script> <script style = "display: none;"> <a href=" http://mizipedia.com"> Tutorial </a> </ p> <style type = "text / css"> .sitemap- kontainer {width: 100%; height: 105px; border-top: 2px #eee padat;} .sitemap-kontainer: hover {background-color: #fafafa;} .thumbnail {width: 60px; height: 90px; float: kiri; top: 0px;} .posttitle {height: 90px; float: kiri; line-height: 90px; margin-left: 25px; display: block; width: 80%; white-space: nowrap;} #postimg {margin-top: 10px; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; width: 60px; border: 2px #eee padat;} #list {list-style-type: none; padding-left: 0px; margin-left: 0px;} </ style>

Ganti kode http://mizipedia.com
Daftar Isi / Sitemap sederhana 100 % SEO Friendly


<script src=" http://mizipedia.com " type="text/javascript"></script>
<script src="http://masterbama.blogspot.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc"></script>

 Di atas ini adalah script sitemap sederhana 100 % SEO Friendly

Ganti kode 'mizipedia.com' yang bewarna merah dengan alamat blog anda
Daftar Isi / Sitemap Ber-scroll

<div style="background-color: #dde1e3; border: 1px solid #999999; height: 100px; overflow: auto; padding: 10px; width: 100%px;">
<script style="text/javascript" src="https://cdn.rawgit.com/D-dig/js/gh-pages/sitemap1.js"></script><script src="http://mizipedia.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc"></script>
</div>

Nilai '100' pada 'height' bisa anda rubah sesuai dari panjang daftar isi yang diinginkan. Ganti kode 'mizipedia.com' yang bewarna merah dengan alamat blog anda

Daftar Isi / Sitemap Pakai Tabel 

<div dir="ltr" style="text-align: left;" trbidi="on">
<style>
#tocTable {
  border:2px solid white;
  font:normal normal 11px/normal Verdana,Tahoma,Arial,Sans-Serif;
  color:#333;
  border-collapse:collapse;
  text-align:left;
  margin:0 0 5px;
}
#tocTable th,
#tocTable td {
  border:1px solid white;
  background-color:#fafafa;
  padding:10px 15px;
}
#tocTable th {
  background-color:#5d5d5d;
  font-weight:bold;
  color:white;
  text-shadow:0 1px 0 rgba(0,0,0,.3);
}
#th-1 {
  width:60%;
  background-color:#5A930D;
}
#th-2,#th-3 {width:20%}
#tocTable td.toc-header-col-1,
#tocTable td.toc-header-col-2 {
  padding:0 !important;
  background-color:#2372A7;
}
#tocTable td.toc-header-col-3 {background-color:#D7DEF0}
#tocTable a {
  display:block;
  text-decoration:none;
  color:white;
  padding:10px 15px;
  background:none;
}
#tocTable td.toc-header-col-1:hover,
#tocTable td.toc-header-col-2:hover {
  background-color:#174B6F;
  -webkit-box-shadow:inset 0 0 3px rgba(0,0,0,.4);
  -moz-box-shadow:inset 0 0 3px rgba(0,0,0,.4);
  box-shadow:inset 0 0 3px rgba(0,0,0,.4);
}
#tocSort {
  display:block;
  width:220px;
  font:normal bold 12px/normal Verdana,Tahoma,Arial,Sans-Serif;
  color:#333;
  cursor:pointer;
  border:none;
  outline:none;
  background-color:#eee;
  margin:0 0 2px 0;
  padding:5px;
}
</style>
<script>
var theTotalPosts  = 9999, // Tentukan jumlah maksimal posting
    theOptions     = "Sortir...",                // Label opsi 1
    theSortPosts   = "Sortir berdasarkan Abjad", // Label opsi 2
    theSortLabels  = "Sortir berdasarkan Label", // Label opsi 3
    theTitles      = "Judul Artikel",  // Header tabel 1
    theLabels      = "Label Artikel",  // Header tabel 2
    theDates       = "Bulan Terbit",   // Header tabel 3
    theBlankLabels = "Tak Berlabel",   // Label kosong
    theSiteUrl     = " http://mizipedia.com"; //
</script>
<script src="http://dte-project.googlecode.com/svn/trunk/toc-table-sort.js"></script></div>

Ganti kode 'mizipedia.com' yang bewarna merah dengan alamat blog anda.

thks semoga bermanfaat !!!

Bila Anda merasa memang artikel-artikel di blog ini bisa bermanfaat, maka Anda bisa membantu memberikan donasi melalui Paypal Dana hasil dari donasi akan digunakan untuk memperpanjang domain mizipedia.com - Terima kasih.