Tuesday, February 5, 2013

Membuat Static Home Page Pada Blogger



Biasanya static home page diperlukan jika seseorang ingin menampilkan halaman depan blog sesuai dengan keinginannya atau menginginkan perberbedaan dengan tampilan blogger pada umumnya. Seperti kawan ketahui secara umum blogger akan menampilkan halaman post yang kita buat yang jumlahnya bisa disesuaikan dengan keinginan.

Secara sederhana trik yang bisa dilakukan untuk hal diatas adalah dengan membuat post yang ingin ditampilkan pada halaman utama menjadi 0, kemudian tambahkan gadget HTML/Javascript tepat diatas Blogpost widget pada Layout Blogger.

Dashboard >> Setting > Post and Comments > Show 0 Posts (ganti 6 dengan angka 0)

Dashboard >> Layout >> klik add Gadget dan pilih HTML/Javascript gadget


Nah pada HTML/Javascript gadget inilah kawan bisa menulis atau membuat apa yang ingin ditampilkan, misalnya sildeshow, textbox, carousel dan sebagainya.

Trik diatas memang berhasil, tetapi tidak dalam bentuk yang sempurna, karena masih menyisakan sebuah kotak dengan tulisan No Posts ditengah-tengahnya.

Jika demikian berarti kita harus menghilangkan beberapa kode supaya halaman utama blog kita terlihat seperti yang diinginkan, namun kelemahannya adalah jika kawan tidak tepat dalam membuang kode pada blogger, akibatnya blog kita malah hancur dan menurut penulis pribadi hal ini lebih sulit untuk mencari kode mana yang harus dihilangkan.

Untuk itu penulis menemukan trik kedua yang bisa membuat static home page pada blogger menjadi terlihat lebih baik, yaitu dengan menambahkan kode pada HTML blogger.

Dashboard >> Template >> Edit Html >> Cheklist Expand Widget Templates , kemudian temukan kode berikut : ]]></b:skin>

Tepat dibawahnya kopikan kode berikut :
<b:if cond="data:blog.url == data:blog.homepageUrl">
<style type="text/css">
.post, .sidebar, .date-outer, #blog-pager {display:none;}
</style></b:if>
<b:if cond="data:blog.url == data:blog.homepageUrl">
<style type="text/css">
body#layout .sidebar {display:inline;margin-top:200px;}
</style></b:if>

Pada kode diatas Blogpost widget, Sidebar, dan Tanggal akan disembunyikan pada home page blogger, kawan tinggal menyesuaikan saja apa yang ingin disembunyikan, jika hanya blogpost, berarti hapus .sidebar dan .date-outer pada bagian kode seperti dibawah:
.post, .sidebar, .date-outer, #blog-pager {display:none;}

Selamat mencoba, tinggalkan komentar jika menghadapi kendala.
Terima kasih.

0 comments:

Post a Comment

Template by:

Free Blog Templates