Cara Membuat Homepage Menjadi Grid di Template Viomagz

Jagoandzgn.com - Pada kesempatan kali ini saya akan membagikan sebuah tutorial bagaimana Cara Membuat Homepage Menjadi Grid di Template Viomagz. Tutorial ini membuat blog kamu menjadi lebih keren pastinya dan membuat blog kamu menjadi responsive, simple dan pastinya menarik. Beberapa jam yang lalu, seorang pengunjung blog Jagoandzgn mengirim pesan melalui whatsapp ini yang isinya request dibuatkan Homepage Menjadi Grid di Template Viomagz.


Secara default tampilan artikel pada homepage blogspot adalah berbentuk statis alias vertikal, Namun kita juga dapat melakukan kustomisasi tampilan tersebut menjadi tampilan grid. untuk tutorial ini sangat mudah sekali hanya menambahkan kode didalam sebuah element.

Baca Juga : Cara membuat vector di Infinite Design bagian wajah

Cara Membuat Homepage Menjadi Grid di Template Viomagz

1. Silahkan kamu masuk ke Blogger.com dengan menggunakan Gmail kamu.
2. Selanjutnya masuk ke menu TEMA > klik Edit HTML.
3. Cari kode dibawah ini.

.post {

4. Pastekan kode dibawah tepat DIBAWAH kode margin-bottom: 20px;

padding: 15px 30px 30px 30px;
-webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.04), 0 3px 1px -2px rgba(0, 0, 0, 0.05), 0 1px 5px 0 rgba(0, 0, 0, 0.04);
background-color: white;
border-radius: 5px;
padding: 10px;

5. Kalau sudah silahkan klik SIMPAN.

Bagi kamu yang ingin lebih responsive lagi gambarnya seperti homepage punya admin silahkan ikuti tutorial berikut ini.

Cara Merubah Ukuran Gambar Thumbnail di Viomagz Versi Mobile

1. Silahkan kamu login ke blogger.com dengan menggunakan GMAIL kamu.
2. Masuk ke menu TEMA > Edit HTML.
3. Cari kode CSS berikut ini :

.img-thumbnail {
  width: calc(100% + 30px);
  margin: 0px 0px 15px -15px;
  height: 160px;
  position: relative;
  overflow: hidden;
 }

4. Ganti dengan kode berikut agar thumbnail nya lebih responsive lagi.

.img-thumbnail {
    width: calc(100% + 0px);
    margin: -5px 7px -5px 0px;
    height: 250px;
    border-radius: 10px;
    position: relative;
    overflow: hidden;
}

5. Selanjutnya klick SIMPAN dan Lihat hasilnya.

Bagaimana mudah bukan, untuk kamu yang memiliki sebuah masalah blogger atau mempunyai request silahkan kamu komen dibawah artikel ini. Sekian dulu artikel kali ini tentang bagaimana Cara Membuat Homepage Menjadi Grid di Template Viomagz atas perhatiaannya terima kasih.
Seorang yang memiliki kepribadian yang menyendiri, tanpa mengenal dunia luar hanya melalui dunia online.
  • Facebook
  • WhatsApp
  • Instagram
  • Tampilkan Komentar
    Sembunyikan Komentar

    2 Komentar

    1. footer bawah berpindah pak cek https://fagasofc.blogspot.com

      BalasHapus
      Balasan
      1. Footer berpindah gimana ya kak, tolong info kan lebih jelas dan Terima kasih sudah berkunjung di Jagoandzgn

        Hapus

    Iklan Atas Artikel

    Iklan Tengah Artikel 1

    Iklan Tengah Artikel 2

    Iklan Bawah Artikel