Cara Mengganti Tampilan Homepage Static Menjadi Grid Pada Blog
tags: cara merubah tampilan home menjadi 4 kolom, cara merubah tampilan home menjadi 3 kolom, cara merubah kotak postingan menjadi kotak-kotak, cara mengatur homepage menjadi magazine
Cara Mengganti Tampilan Homepage Static Menjadi Grid Pada Blog - Pada template biasa, pada umumnya tampilan homepage di blog memakai mode static atau list. Tampilan homepage yang mode grid/ kotak biasanya dipakai untuk template sejenis Magazines, Movie, atau Gallery.
Nah, kali ini saya akan membuatkan cara atau tips mengubah tampilan hompage blog yang static menjadi grid/ kotak. Namun tentunya blog tersebut akan mengalami sedikit perubahan pada tampilannya, yaitu static atau listnya akan memanjang ke bawah dan lebar, namun akan menjadi kotak-kotak kecil yang akan menghemat luas pada homepage blog tersebut.
ini pola blog saya dengan tampilan homepage grid via http://diamonita.blogspot.com
- Login ke akun Blogger
- Klik Template > Edit HTML
- Cari aba-aba </head> , kemudian letakkan script di bawah ini di atasnya.
- Klik Simpan Template
Catatan :
- 380 ialah jumlah aksara yang akan ditampilkan jikalau sebuah posting tidak mempunyai gambar.
- 180 ialah jumlah aksara yang akan ditampilkan jikalau sebuah posting mempunyai gambar.
- 130 ialah tinggi gambar.
- 220 ialah lebar gambar.
- 45% ialah ketinggian kotak posting pada homepage.
- 200 ialah lebar kotak posting pada homepage.
- Angka diatas dapat Anda ganti sesuai selera dan harapan Anda sendiri.
Jika Anda menginginkan ada fitur Readmore di tampilan grid anda, Anda gunakan metode berikut,
- Cari aba-aba <data:post.body/>, biasanya ada 1-3 aba-aba menyerupai itu
- Copy aba-aba dibawah ini, kemudian ganti aba-aba <data:post.body/> yang ke 2 dengan script di bawah ini:
- Tulisan Read More dapat Anda ganti sesuai dengan harapan Anda, contohnya dengan Lanjutkan Membaca, Baca Selengkapnya, atau Lihat Selengkapnya.
- Klik Simpan Template
Catatan :
Catatan :
Jika sesudah memakai metode grid diatas ada hambatan dengan tombol Beranda, Posting Lama, Posting Baru, atau tombol Home, Newer Post, Older Post, pada homepage blog Anda hilang, solusinya ialah cari aba-aba <b:includable id='nextprev'> pada bab Edit HTML, kemudian simpan aba-aba ini <div style='clear:both;'/> dibawahnya.
Udah gitu aja. Thanks :)