Cara Membuat Peta situs Template Median UI

Cara Membuat Peta situs Template Median UI



Apa Itu Peta Situs ? 

Peta situs atau sering disebut juga dengan Sitemap dapat di artikan sebagai kerangka website yang menggambarkan denah atau isi website itu sendiri, Sitemap atau Peta Situs memuat informasi memuat halaman apa saja yang terdapat pada blog atau website tersebut secara sederhana site map atau peta situs dapat flowcart atau dlama sebuh daftar

Fungsi Peta Situs 

1. Mempermudah pengunjung menemukan website atau blog kita    
    Adanya SiteMap di website kita tentunya akan mempermudah para pengunjung kita untuk mengetahui isi dari situs tersebut

2. Visibilitas Website                              
     Sitemap membawa pengaruh besar dalam sebuah website di mesin telusur karna ini di jadikan rujukan mesin pencari untuk merayapi isi website tesebut

3. Website Cepat Terindeks                        
    Apabila kamu tidak menggunkan Peta Situs, Robot search engine akan tetap dapat merayapi situs kamu tetapi membutuhkan waktu karana robot search engin akan menjelajahi dan mengindeks situs kamu secara perlahan dan masih banyak lagi fungsi nya 

Jika kamu sudah mengetahui fungsi dan apa itu peta situs pada tahap berikut nya kita akan memasuki langkah dalam membuat peta situs tesebut dan jangan lupa seperti judul nya saya hanyamembagikan  nya untuk template Median UI saja simak dengan baik 

Cara Pemasangan SiteMap / Peta Situs

  1. Buatlah Halam pada Postingan dengan judul Sitemap
  2. Kemudian Beralih dari Mode Compose Views Ke Mode HTML Views
  3. Kemudian Copy Dan Paste Kode di bawah ini kedalam Mode HTML Views tersebut                     
    <div class='postSection sitemaps' id='sitemaps'>
      <div class='loading'>Loading....</div>
    </div>
    
    <script>/*<![CDATA[*/
    /* Blogger Sitemap Dropdown: change i.src="..." with your url */
    var toc_config = {containerId:'sitemaps', showNew:0, sortAlphabetically:{thePanel:true, theList:true}, activePanel:1, slideSpeed:{down:400, up:400}, slideEasing:{down: null, up: null}, slideCallback:{down:function(){}, up:function(){}}, clickCallback:function(){}, jsonCallback:'sitemaps',delayLoading: 0};
    window.onload = function(){
    !function(e,o){var t=o.getElementById(toc_config.containerId),c=o.getElementsByTagName("head")[0],n=[];e[toc_config.jsonCallback]=function(e){for(var o,c,i=e.feed.entry,a=e.feed.category,l="",s=0,d=a.length;d>s;++s)n.push(a[s].term);for(var r=0,f=i.length;f>r;++r)(toc_config.showNew||toc_config.showNew>0)&&r<toc_config.showNew+1&&(i[r].title.$t+=" %new%");i=toc_config.sortAlphabetically.theList?i.sort(function(e,o){return e.title.$t.localeCompare(o.title.$t)}):i,toc_config.sortAlphabetically.thePanel&&n.sort();for(var g=0,h=n.length;h>g;++g){l+='<div class=\"sitemapBox\"><h4 class=\"sitemapTitle\">'+n[g]+'</h4>',l+='<div class=\"sitemapContent\"><ol>';for(var _=0,p=i.length;p>_;++_){o=i[_].title.$t;for(var w=0,u=i[_].link.length;u>w;++w)if("alternate"==i[_].link[w].rel){c=i[_].link[w].href;break}for(var v=0,m=i[_].category.length;m>v;++v)n[g]==i[_].category[v].term&&(l+='<li><a href=\"'+c+'\" title=\"'+o.replace(/ \%new\%$/,"")+'\">'+o.replace(/ \%new\%$/,"")+'</a></li>')}l+='</ol></div></div>'}t.innerHTML=l }; var i=o.createElement("script");i.src="https://yourdomain.com/feeds/posts/summary?alt=json-in-script&max-results=9999&callback="+toc_config.jsonCallback,"onload"==toc_config.delayLoading?e.onload=function(){c.appendChild(i)}:e.setTimeout(function(){c.appendChild(i)},toc_config.delayLoading)}(window,document);
    }
    /*]]>*/</script>
    
    <style>
    .sitemaps{font-size:14px}
    .sitemapBox{padding:15px;border:1px solid var(--content-border);border-radius:5px}
    .sitemapBox:not(:last-child){margin-bottom:20px}
    .postEntry .sitemapTitle{margin-top:0; font-size:14px;font-weight:400;font-family:var(--body-font)}
    .sitemapTitle:before{content:'Label: '; font-size:90%;opacity:.8}
    .sitemaps ol{list-style:none;margin:0;padding:0;counter-reset:sitemap-count}
    .sitemaps li{display:flex;align-items:baseline}
    .sitemaps li:not(:last-child){margin-bottom:0}
    .sitemaps li:before{content:counter(sitemap-count) '.';counter-increment:sitemap-count;flex-shrink:0;width:25px;font-size:13px;font-family:var(--font-body);line-height:normal; opacity:.7}
    
    .darkMode .sitemapBox{border-color:rgba(255,255,255,.1)}
    </style>
  4. Kemudian Simpan dan lihat hasil nya pada halaman yang kamu buat tadi
Nah itulah sedikit fungsi dan apa itu sitemap / atau daftar isi semoga artikel ini bermanfaat demikianlah artikel kali ini dan sampai jumpa pada artikel - arikel berikut nya 

Mau donasi lewat mana?

Paypal
Bank BRI - An.Muhamad Arsad / Rek - 2345xxx
Traktir creator minum kopi dengan cara memberi sedikit donasi. klik icon panah di atas