Menyembunyikan Sidebar Pada Homepage - Minima Today #5
Banyak sekali yang bertanya tentang widget related posts di blog ini. Widget berwarna hijau yang hanya tampil pada halaman postingan. Sebenarnya itu mudah sekali dibuat. Template ini saya ubah menjadi 3 kolom satu kolom saya sembunyikan di halaman depan.
Secara berurutan template ini terdiri dari main-wrapper, sidebar1 dan sidebar2. Gadget related posts (baca: Membuat Related Posts di Sidebar) saya letakkan di sidebar tengah dan sidebar tengah hanya ditampilkan pada halaman postingan.
Menyembunyikan Sidebar di Halaman Depan
Seperti biasa, mari kita gunakan contoh template Minima. Pada percobaan lalau kita telah menambahakan satu sidebar baru pada tempalte (baca: Menambah Kolom Sidebar Pada Template), sekarang kita akan menyembunyikannya. Yang akan kita sembunyikan adalah sidebar tengah (midsidebar-wrapper, kode pada tempalte Anda bisa berbeda.). Sebaiknay Sidebar yang akan dihilangkan di homepage dikosongkan dari widget terlebih dahulu.
- Login blogger
- Rancangan/Design
- Edit HTML
- Centang Expand Template Widget
- Cari kode seperti berikut ini:
<div id='midsidebar-wrapper'>
<b:section class='sidebar' id='midsidebar' preferred='yes'>
</b:section>
</div>
Yang berwarna merah, menandakan sidebar yang akan dihilangkan. Apit kode tersebut dengan kode penampilan hanya dihalaman postingan, sehingga menjadi seperti berikut ini:
<b:if cond='data:blog.pageType == "item"'>
<div id='midsidebar-wrapper'>
<b:section class='sidebar' id='midsidebar' preferred='yes'>
</b:section>
</div>
</b:if>
- Simpan template Anda.
Langkah pertama selesai, karena Anda telah berhasil menyembunyikan sidebar di homepage.
Melebarkan Area Postingan di Homepage
Karena satu sidebar dihomepage dihilangkan, maka akan terjadi area kosong bekas sidebar tersebut. Mari kita penuhi area kosong tersebut dengan melebarkan area postingan khusus di homepage.
Tambahkan kode berikut ini di atas </head>
<b:if cond='data:blog.pageType != "item"'>
<style>
#main-wrapper{
width: 710px;
}
</style>
</b:if>
Pada width sesuaikan dengan kondisi lebar template Anda (formatnya: lebarmainwrapper asli + lebarsidebar yang dihilangkan). Jika sudah silahkan simpan template Anda. Sekarang perhatikan bagian elemen halaman Anda, area kosong telah hilang. Area postingan bertamabah lebar.
Menambahkan Gadget Pada Sidebar Yang di Sembunyikan
Kita sudah berhasil menyembunyikan sidebar pada homepage dan membuat area postingannya bertambah lebar. Perhatikan gambar di atas. Namun, bagaimana cara kita menambahkan gadget ke sidebar yang dihilangkan sedangkan kolom untuk penambahan di elemen halaman hilang? Mari kita tambahkan melalui edit HTML. (mungkin inigin anda baca juga: Pindah Gadget Manual Jika Terjadi Galat)
Pertama, Tambahkan Gadget Ke Sidebar Lain yang masih tampak. Jika Anda menggunakn dua sidebar. Yang satu disembunyikan dan yang satu tidak. Kita bisa menggunakan bntuan sidebar yang tidak disembunyikan. Tambahkan gadget seperti biasa. Kita coba dengan menambahkan widget HTML/JavaScript. Dam misalnya kita beri nama gadget tersebut dengan gadget contoh.
Kedua, Pindahkan Gadget tersebut ke sidebar yang disembunyikan.
- Login blogger
- Design/Rancangan
- Edit HTML, centang expand template widget .
- Cari kode gadget contoh untuk menemukan keseluruhan kode gadget yang ingin kita pindah.
Jika sudah ketemu, silahkan pindahkan ke section sidebar lain Anda seperti gambar berikut ini:
Pastikan kode ditutup dengan benar, karena sidebar kosong kadang tidak akan memiliki penutup </b:section> Tambahkan jika tidak ada, sehingga seperti gambar di atas. Semoga bermanfaat...
0 comments:
Post a Comment