Cara Mengatur Ukuran Thumbnail Mobile VioMagz

Cara Mengatur/Mengubah Ukuran Thumbnail Mobile VioMagz Seperti yang kita semua tahu bahwa template buatan Mas Sugeng ini memang cukup populer.

Baik dari segi desain yang minimalis,keren dan elegan,fitur-fitur menarik dengan penggunaan yang mudah serta kualitasnya yang sudah SEO Friendly dan Fast Loading.

Untuk saat ini template VioMagz sudah mencapai versi 3.1 dengan berbagai perubahan yang membuatnya memiliki desain dan fitur-fitur yang keren.

Namun ada beberapa hal yang di keluhkan oleh para pengguna seperti Ukuran thumbnailnya yang terlihat gepeng bila dilihat dari tampilan mobile.

Cara Mengganti Ukuran Thumbnail di Hompage VioMgaz versi Mobile

Beberapa blogger pengguna template VioMagz ada yang lebih suka dengan tampilan thumbnail mobile versi lama yang ukurannya kecil.

Oleh karena itu, disini saya akan membagikan tutorial Cara Merubah Ukuran dan Posisi Thumbnail Mobile di Hompage VioMagz.

1. Cara Memperbesar Tampilan Thumbnail VioMagz yang Gepeng di versi Mobile

• Buka Blogger.com
• Sign In dengan Akun Google anda
• Masuk ke Dashboard Blogger
• Pilih menu Tema
• Klik Edit HTML
• Cari kode berikut ini :

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

Ubah tingginya (height) dari 160px menjadi 250px sehingga nanti kodenya kan menjadi seperti berikut :

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

Bila sudah silahkan anda klik Simpan Tema

Bila anda berhasil mengganti ukurannya maka tampilan thumbnailnya akan berubah seperti di gambar berikut :

2. Cara Merubah Ukuran Thumbnail VioMagz jadi Kecil

Bila anda melihat pada desain VioMagz yang lama khususnya versi 2.4 ,tampilan thumbnail mobile di VioMagz memiliki bentuk yang kecil.

Beberapa blogger lebih menyukai tampilan tersebut karena dianggap lebih rapi.

Jika anda salah satu orang yang menyukai desain tersebut maka disini saya akan memberi tutorial cara membuat ukuran thumbnail viomagz menjadi kecil.

• Buka Blogger.com
• Sign In dengan Akun Google anda
• Masuk ke Dashboard Blogger
• Pilih menu Tema
• Klik Edit HTML
• Cari kode berikut untuk mengedit ukuran thumbnailnya :

.img-thumbnail {
width: calc(100% + 30px);
margin: 5px 0px 15px 0px;
height: 160px;
position: relative;
overflow: hidden;
}
.img-thumbnail img {
width: 100%;
height: auto;
position: absolute;
top: -100%;
left: 0;
right: 0;
bottom: -100%;
margin: auto;
}

"Jangan Lupa Bagikan Artikel Ini Ya"

Bagikan