Bagaimana Cara Membuat Sitemap Keren Warna dan Responsive di Blogger

Ini mungkin artikel yang anda cari yaitu Bagaimana Cara Membuat Sitemap Keren Warna dan Responsive di Blogger



Apa sih Sitemap ataupun daftar isi web? ini

dirasa sangat berarti buat membagikan ruang data kepada tamu supaya mengenali segala isi postingan pada blog. Kali ini aku hendak membagikan tutorial trik membuat sitemap keren otomatis serta fast loading di web. Sesungguhnya sitemap default dari blogger telah ada, tetapi nampak biasa serta tidak menarik. Nah, dengan membuat sitemap blog keren sehingga bakal menajadi atensi tertentu dimata tamu serta ini bakal menjadikan pengunjung betah di web yang kita kelola.

Yang sangat menarik dari sitemap seo ini merupakan menampilkan sitemap otomatis cocok dengan label, jadi menunjukkan judul artikel cocok dengan label yang terdapat. artikel terkini hendak secara otomatis masuk dalam catatan, jadi kamu tidak butuh ribet memasukkan satu persatu. Memasang sitemap di web blogger pula tidak memerlukan skill buat memahami html, sebab kamu tinggal copas serta memasangnya pada taman statis.

Dengan terdapatnya sitemap ini tidak hanya mempermudah pengunjung dalam mencari postingan dengan sitemap yang nampak lebih keren pula membagikan kesan menarik pada pengunjung.

Untuk kamu yang tertarik buat mencoba nya silakan simak langkah- langkah nya dibawah ini .

Cara Membuat Sitemap Keren Warna dan Responsive di Blogger

1. Loggin Ke Blogger
2. Pilih Laman/Page  , Klik  Laman Baru/New Page


3. Pilih Mode HTML Lalu Copy kan kode di bawah ini

<div class="jontor"><script src="https://rawgit.com/rezamuhamad/rakinfo/master/sitemap.js"></script><script src="/feeds/posts/default?max-results=5000&alt=json-in-script&callback=rak_info_Load"></script></div><style type="text/css">.jontor{width:100%;border-collapse:collapse;text-align:left;overflow:hidden;margin:0 auto;} .jontor a{color:black;} .jontor p .rak_info_Label{background:#428bdd;color:#fff;text-decoration:none;display:block;padding:5px 0px 5px 10px;font:13px 'Arial';font-weight:bold;} .jontor ol li{position:relative;display:block;padding:.4em .4em .4em .4em;margin:.5em 0 .5em 2.5em;background:#ace6d5;color:#fff;text-decoration:none;transition:all .3s ease-out;} user agent stylesheetli{display:list-item;text-align:-webkit-match-parent;} .jontor ol li:before{content:counter(li);counter-increment:li;position:absolute;left:-2.5em;top:50%;margin-top:-1em;background:#bed572;color:#fff;height:2em;width:2em;line-height:2em;text-align:center;font-weight:bold;} .jontor ol li:hover:after{left:-.5em;border-left-color:#89abbc;} .jontorol li:hover{box-shadow:0 1px 3px rgba(0,0,0,0.12),0 1px 2px rgba(0,0,0,0.24);transition:all 0.3s cubic-bezier(.25,.8,.25,1);} .jontor ol li:after{position:absolute;content:'';border:.5em solid transparent;left:-1em;top:50%;margin-top:-.5em;transition:all .3s ease-out;} ol{counter-reset:li;list-style:none;font:12px 'Arial';padding:0;margin-bottom:2em;text-shadow:0 1px 0 rgba(255,255,255,.5);margin-left:26px;} .rak_info_Postname li:nth-of-type(odd){background:#f1f3f3;} .new{color:red!important;font-weight:700;font-style:italic;} user agent stylesheetol{display:block;list-style-type:decimal;-webkit-margin-before:1em;-webkit-margin-after:1em;-webkit-margin-start:0;-webkit-margin-end:0;-webkit-padding-start:40px;} </style>

4. Pastekan Kode Tersebut dan Klik Publikasikan.


5. Silahkan Anda Lihat Hasilnya.



Tambahan : Bagi sobat yang sudah ada sitemap di blognya dan tertarik untuk mengganti nya dengan sitemap ini anda tinggal mengganti kode HTML nya saja kemudian Update/Perbaharui

Nah itu dia Cara Membuat Sitemap Keren warna dan Responsive di Blogger.
Selamat Mencoba, Semoga Bermanfaat.

Share this post