Berbagi Tutorial Seputar Blog Terserah Adminnya, Masalah?

Cara Membuat Sitemap Responsive Di Blog

Cara Membuat Sitemap Responsive Di Blog Sehari gak posting rasanya gimana gitu... Kali ini saya mau share nih Cara Buat Sitemap di Blog, caranya mudah hampir sama seperti postingan saya yang sebelumnya. Silahkan lihat Sitemap punya saya dengan mengklik demo dibawah.
DEMO
Apasih fungsi Sitemap??






Fungsi Sitemap adalah sebuah halaman yang digunakan untuk mempermudah pengunjung untuk mengetahui lebih lanjut isi dari suatu web/blog secara keseluruhan. Sitemap juga termasuk syarat untuk mengikuti Adsense seperti Google Adsense.

Mau tau lebih lanjut? simak cara dibawah ini :

1. Login dahulu ke Blogger

2. Setelah itu Copy semua script yang ada

<script src="https://googledrive.com/host/0B-P4_Fs3S76ydURacVd6TlJyWW8" type='text/javascript'></script>
<script src="http://tut-blogger.blogspot.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;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: #555; 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>


3. Setelah itu ganti http://tut-blogger.blogspot.com dengan url blog sobat.

4. Selanjutnya kita menuju ke Page dan buat New Page

Cara Membuat Sitemap Responsive Di Blog

5. Di Page kita menggunakan HTML(disebelah kanan Compose)

Cara Membuat Sitemap Responsive Di Blog

6.Pastekan seluruh scriptnya, lalu klik Publish

Cara Membuat Sitemap Responsive Di Blog

7. Setelah itu untuk mengatur Sitemap,mungkin anda sudah tau caranya,yaitu kita beralih ke Template dan klik Edit Template, lalu letakkan dimana letak Sitemap diinginkan.

Sekian tutorial kali ini semoga bermanfaat buat anda dan sobat semuanya, Terima Kasih :D

Share on Facebook
Share on Twitter
Share on Google+
Tags :

Related : Cara Membuat Sitemap Responsive Di Blog

40 comments:

  1. Makasih gan ? apakah ada hasil rieviewnya ? :)

    ReplyDelete
    Replies
    1. ad silahkan klik kata DEMO,baca baik-baik gan #8

      Delete
    2. Oke gan makasih lain kali kata demonya dibesarin atau ditaruh bawah :D
      Biar gak bingung

      Delete
  2. Nanti ane coba gan! Ngomong-ngomong makasih ya infonya

    ReplyDelete
  3. saran aja gan
    lain kali kode HTMLnya di ketik aja ga usah di screen biar konsumen gampang nge-copynya

    ReplyDelete
    Replies
    1. itu juga mudah kok gan...
      saran diterima gan makasih #5

      Delete
  4. wah responsive nih...
    coba dulu gan :-D

    ReplyDelete
  5. Sitemapnya beda dari yang lain Mas, berkolom-kolom. O ya sitemapnya beneran responsive ya ? :)

    ReplyDelete
  6. mantap, Sitemap ane responsive :D
    thx gan

    ReplyDelete
  7. ohh gitu yah gan
    izin nyoba moga2 aja berhasil

    ReplyDelete
  8. wah keren sitemap nya gan
    boleh ni di coba

    ReplyDelete
  9. Ooo Ternyata sitemap Mendukung Syara Adsense

    ReplyDelete
  10. ane mau coba nih gan, makasih atas infonya :v

    ReplyDelete
  11. sitemapnya oke juga
    ijin copas html

    ReplyDelete
  12. Thanks, sitemap memang cukup bermanfaat

    ReplyDelete
  13. Sangat bermanfaat postingan nya saya tunggu Artikel terbaru nya.Nice post

    ReplyDelete

Silahkan berikan komentar dan masukan anda di bawah ini, komentar dengan link tidak akan di approve