Cara Membuat Sitemap Untuk Blog ala Arlinadzgn


Santaibareng.net. Kali ini Santai Bareng akan membagikan Cara Membuat Sitemap Untuk Blog ala Arlinadzgn. Banyak sekali pengunjung blog yang kadang kala ingin membaca sitemap atau daftar isi blog. Hal ini akan memudahkan pengunjung untuk membaca semua postingan sobat. Selain itu, membuat sitemap atau daftar isi blog, akan menambah kesan profesional dari blog itu sendiri. OK langsung saja.
Berikut Cara Membuat Sitemap Untuk Blog ala Arlinadzgn :

1. Buka akun blogger.
2. Pilih menu template > Klik Edit Html
3. Terapkan kode berikut tepat sebelum </style>

/* CSS Full Sitemap */
#bp_toc {background:#2ea9da;color:#666;margin:0 auto;padding:5px;}
span.toc-note {padding:20px;margin:0 auto;display:block;text-align:center;color:#ffffff;font-family:&#39;Open Sans&#39;;font-weight:700;text-transform:uppercase;font-size:30px;line-height:normal;}
.toc-header-col1 {padding:10px;background-color:#000000;width:250px;}
.toc-header-col2 {padding:10px;background-color:#000000;width:75px;}
.toc-header-col3 {padding:10px;background-color:#000000;width:125px;}
.toc-header-col1 a:link, .toc-header-col1 a:visited, .toc-header-col2 a:link, .toc-header-col2 a:visited, .toc-header-col3 a:link, .toc-header-col3 a:visited {font-size:13px;
text-decoration:none;color:#aaa;font-family:&#39;Open Sans&#39;;font-weight:700;letter-spacing: 0.5px;}
.toc-header-col1 a:hover, .toc-header-col2 a:hover, .toc-header-col3 a:hover {
text-decoration:none;}
.toc-entry-col1, .toc-entry-col2, .toc-entry-col3 {background:#fdfdfd;padding:5px;padding-left:5px;font-size:89%}
.toc-entry-col1 a, .toc-entry-col2 a, .toc-entry-col3 a{color:#666;font-size:13px;}
.toc-entry-col1 a:hover, .toc-entry-col2 a:hover, .toc-entry-col3 a:hover{color:#e76e66;}
#bp_toc table {width:100%;margin:0 auto;counter-reset:rowNumber;}
.toc-entry-col1 {counter-increment:rowNumber;}
#bp_toc table tr td.toc-entry-col1:first-child::before {content: counter(rowNumber);min-width:1em;margin-right:0.5em;}
td.toc-entry-col2 {background:#fafafa;}
Note :
  • Untuk mengubah warna dan font, silahkan sobat Sis otak atik disini
5. Simpan template.

Untuk Menampilkan Hasil Sitemap:
6. Pilih menu laman > Klik Laman Baru.
7. Ubah tab Compose menjadi HTML
8. Terapkan kode berikut :

<div id="bp_toc">
</div>
<script src="https://cdn.rawgit.com/Arlina-Design/redvision/master/sitemap-content.js" type="text/javascript"></script> <script src="/feeds/posts/summary?alt=json-in-script&amp;max-results=9999&amp;callback=loadtoc" type="text/javascript"></script>
<style scoped="" type="text/css">
#comments {display:none;}
</style>
9. Publikasikan dan selesai.

Baca juga : Cara Memasang Widget Daftar Atikel Berdasarkan Label (Bergambar)

Gimana sobat ? Mudah kan.
OK, sekian dulu. Selamat mencoba semoga berhasil dan bermanfaat.
Terima kasih.

Dapatkan artikel Tutorial Blog & Optimasi Blog lainnya di Barungeblog.com
Baca Juga!

Loading...