CARA MEMBUAT SITEMAP RESPONSIVE

Hai sobat, ane hadir lagi di kehidupan sobat. Di kesempatan kali ini ane akan bahas cara membuat sitemap responsive, pasti sobat-sobat semua khususnya yang punya blog pasti tau apa itu sitemap. Ok langsung aja ane buat tutorialnya...........

1. Masuk ke akun blogger sobat atau klik blogger.com
2. Pilih menu "laman" dan klik "laman baru"

3. Jika sudah pilih menu HTML, jangan compose

4. Kemudian copy kode dibawah ini

<script src="https://aisuka-project.googlecode.com/svn/sitemap.js" type="text/javascript"></script>
<script src="http://URL sobat/feeds/posts/default?max-results=9999&alt=json-in-script&callback=loadtoc"></script>
<style type="text/css">
.post-archive { width: 100%; padding: 20px 0; text-transform: capitalize; }
.post-archive h4 { border-bottom: 2px solid #EEEEEE; color: #333333; font-size: 20px; margin: 0 0 10px 2px; padding: 0 0 10px; }
.ct-columns-3 { -moz-column-count: 3; -moz-column-gap: 10px; -moz-column-rule: none; -webkit-column-count: 3; -webkit-column-gap: 10px; -webkit-column-rule: none; column-count: 3; column-gap: 10px; column-rule: none;}
.ct-columns-3 p { padding: 5px 0px; -moz-column-break-inside: avoid; -webkit-column-break-inside: avoid; -o-column-break-inside: avoid; -ms-column-break-inside: avoid; column-break-inside: avoid; display: inline-block; width: 100%; }
.ct-columns-3 p a { background: #fafafa; color: #333; display: block; border: 1px solid #FFFFFF; font-size: 14px; line-height: normal; outline: 1px solid #EEEEEE; padding: 10px 15px; -webkit-transition:all .25s ease-in-out; -moz-transition:all .25s ease-in-out; -o-transition:all .25s ease-in-out; transition:all .25s ease-in-out; }
.ct-columns-3 p a:hover { background: #ff8b62; color: #fff; }
@media screen and (max-width: 768px){ .ct-columns-3 { -moz-column-count: 1; -moz-column-gap: 0px; -moz-column-rule: none; -webkit-column-count: 1; -webkit-column-gap: 0px; -webkit-column-rule: none; column-count: 1; column-gap: 0px; column-rule: none; } }
</style>

5. Pastekan kode itu ke laman HTML tadi, kemudian klik publikasikan

Untuk demonya klik tombol di bawah ini

• Demo

Ganti tulisan URL sobat dengan URL blog sobat.

Subscribe to receive free email updates: