Cara Membuat Sitemap Untuk Blog ala Arlinadzgn

Cara Membuat Sitemap Untuk Blog ala Arlinadzgn

Cara Membuat Sitemap Untuk Blog ala Arlinadzgn
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 :
Jika ingin mengubah warna dan font, silahkan sesuaikan sendiri dengan template blog sobat.

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.

Sumber : arlinadzgn.com

Loading...

Share This :
Santai Bareng

Ayo bergabung bersama kami untuk Belajar & Berbagi Bersama di SANTAIBARENG.NET

IBX59EDC09435840