Cara Membuat Sitemap Pada Halaman Statis Blog

Bloggerisn - Cara Membuat Sitemap Pada Halaman Statis Blog. Hai Sobat Blogger, kali ini Saya mau share tutorial cara membuat sitemap pada halaman statis blog sobat. Fungsi dari Sitemap ini adalah, membuat blog sobat lebih profesional dan memudahkan pengunjung blog sobat dalam memilih atau mencari artikel dan tentinya sangat membantu :D

Oke tidak perlu lama, simak cara pemasangannya dibawah ini :

Cara Pemasangan:

1. Buka Blogger.
2. Klik Template.
3. Buka Edit HTML.
4. Masukan kode dibawah ini tepat diatas tag ]]></b:skin> atau </style>.

/* CSS Full Sitemap Bloggerisn*/
#bp_toc {background:#ffaaa4;color:#666;margin:0 auto;padding:5px;}
span.toc-note {padding:20px;margin:0 auto;display:block;text-align:center;color:#ffcfcc;font-family:'Open Sans';font-weight:700;text-transform:uppercase;font-size:30px;line-height:normal;}
.toc-header-col1 {padding:10px;background-color:#f5f5f5;width:250px;}
.toc-header-col2 {padding:10px;background-color:#f5f5f5;width:75px;}
.toc-header-col3 {padding:10px;background-color:#f5f5f5;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:'Open Sans';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;}

Silahkan sobat sesuaikan CSS diatas dengan warna Blog Sobat. dan jika sudah, Simpan Template.

Jika telah selesai sekarang adalah pemasangan pada halaman statis
1. Klik Laman.
2. Buat Laman Baru.
3. Masukan kode HTML dibawah ini pada tab HTML bukan Compose.

<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>

Lalu Publikasikan Laman

Jika blog sobat sudah terdapat ratusan artikel, sebaiknya membatasi tinggi halaman dengan menambahkan style pada kode pertama. Seperti dibawah ini:

<div id="bp_toc" style="max-height:1300px;overflow:scroll;overflow-x:auto;">
</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>

Demo

Oke sobat blogger, demikian tutorial tentang Cara Membuat Sitemap Pada Halaman Statis Blog. Semoga membantu dan bermanfaat :)

Source

http://bloggerisn.blogspot.com/2015/05/cara-membuat-sitemap-pada-halaman-statis-blog.html

Suka Dengan Artikel Diatas? Bagikan Gratis:

• Tweet
• Share
• Share
• Share
• Share

Irham Satriawan

Saya adalah seorang yang sangat menyukai design dan juga dunia internet sobat bisa memanggil saya (CT), dengan blog ini semoga saya akan berbagi pengalaman saya kepada sobat semua.

Artikel Menarik Lainnya