Membuat Peta Situs dengan Tampilan Grid

Peta Situs Grid
Cara Membuat Peta Situs dengan Tampilan Grid untuk Blogger - Pada kesempatan kali ini, admin akan membagikan cara membuat peta situs(sitemap) dengan tampilan grid. Anda dapat menaruh peta situs ini sebagai widget ataupun menaruhnya sebagai halaman, karena widget ini responsif.
Peta situs dengan tampilan grid ini akan memunculkan thumbnail dari postingan anda, dan secara otomatis akan mengurutkan postingan anda berdasarkan postingan terbaru, tanggal, label, dan penulis.

Pertanyaan Terkait

  1. Apa itu peta situs?
  2. Cara Membuat Peta Situs Grid
Sebelum beranjak ke tutorial membuat petasitus dengan tampilan grid admin disini akan memberi sedikit penjelasan apa itu peta situs.

Apa Itu Peta Situs?

Pada dasarnya, peta situs atau bisa disebut sitemap adalah daftar isi untuk situs web atau blog anda. Peta situs ini akan mencantumkan semua isi halaman pada website maupun blog anda. Sehingga, pengunjung dan mesin pencarian dapat dengan mudah menavigasi semua halaman anda.

Pengunjung dapat memanfaatkan peta situs untuk pergi langsung menuju halaman yang dituju jika halaman tersebut tidak ada dihalaman pertama(homepage). Jika website atau blog anda sudah memiliki banyak postingan, mungkin peta situs ini sangat bermanfaat bagi pengunjung blog anda untuk menuju postingan yang dicari dengan berdasarkan abjad, label, penulis, dan lain-lain.

Mungkin sudah cukup untuk penjelasan singkat tentang apa itu peta situs, kali ini kita akan membahas tentang bagaimana cara membuat peta situs dengan tampilan grid.

Cara Membuat Peta Situs dengan Tampilan Grid untuk Blogger

Sitemap Grid Style

Caranya cukup mudah, kalian dapat menempelkan kode dibawah ini pada halaman atau dapat juga anda gunakan untuk widget pada sidebar blog anda.
<style type="text/css">  
 .grid-sitemap {  
  overflow: hidden;  
  position: relative;  
  height: 565px;  
  margin: 20px 0 40px 0;  
 }  
 .grid-sitemap iframe {  
   display: block;  
   width: 100%;  
   height: 680px;  
   margin-top: -115px;  
   margin-left: -5px;  
 }  
 </style>  
 <div class="grid-sitemap">  
  <iframe src="https://renovasi-otak.blogspot.com/view/flipcard"></iframe>  
 </div>
CATATAN:
     : Silahkan ubah dengan URL Blog anda
See the Pen Daftar Isi - Grid Style by Nando Rifky (@nandorifky) on CodePen.
Dengan begitu, anda dapat memunculkan peta situs dengan tampilan grid. Saya kira cukup sekian tutorial kali ini. Jangan malu betanya, silahkan berkomentar dibawah.
Nando
Anda di sini hanya untuk persinggahan yang singkat. Jangan terburu, jangan khawatir. Yakinlah bahwa Anda menghirup wangi bunga sepanjang perjalanan.

Luangkan sedikit waktu Anda untuk membagikan "Membuat Peta Situs dengan Tampilan Grid" kepada teman-teman Anda. Hanya dengan menekan Tombol Sosial Media di bawah ini:

Related Posts

Post a Comment

Berlangganan Gratis!

Daftarkan email anda untuk mendapatkan pemberitahuan setiap update artikel terbaru, dan jangan lupa untuk IKUTI Blog kami