Untuk memberikan kesan praktis, simpel dan rapi, maka saat kita membutuhkan postingan yang sesuai dengan kategori label, perlu ditampilkan judul postingannya terlebih dahulu.
Nah karena jika kita klik label di gadget blogger yang akan muncul semua tampilan positngan, sehingga perlu ada sedikit modifikasi pada kode HTMLnya,caranya:
Sabtu, 09 Januari 2010
Cara menampilkan judul postingan saja
Cara memasang image sebagai header di blog
Selanjutnya gantilah tulisan yang berwarna merah dengan alamat URL tempat anda menyimpan image di Photobucket.
MEMBUAT MENU DAN SUB MENU NAVIGASI HORISONTAL PADA BLOG
Sebagai contoh kita akan membuat menu denga skema sebagai berikut :
• TUTORIAL
- Tutorial Blogspot
- Tutorial Dreamweaver
- Tutorial Wordpress
- Tutorial PHP/HTML
• BISNIS ONLINE
- Adsense
- Reseller
- Pay To Clic
- Pay To Review
• LINKKU
- Blog Tutorial
- Iklan Gratis
- Solusi Finansial
- CPNS
Skema diatas yang dimaksud sebagai menu adalah : TUTORIAL, BISNIS ONLINE dan LINKKU, sedangkan Sub Menu adalah kategori yang berada di bawah menu seperti : Tutorial Blogspot, Adsense, Iklan Gratis dsb.
Pertama kali yang perlu kita persiapkan adalah membuat link terhadap menu dan sub menu tersebut, disini karena setiap menu telah memiliki sub menu, maka link dari menu bisa ditiadakan. Dalam pembuatan link dengan skema diatas terdapat dua bentuk link, yaitu link menggunakan fasilitas posting di blog dan link terhadap blog/situs/web lain.
Untuk membuat link menu dengan blog/web/situs lain (seperti pada menu LINKKU), kita hanya membutuhkan alamat (URL) blog/web/situs yang akan kita linkkan. Misalnya :
URL Sub Menu Automotif : http://mantpi-electronic.blogspot.com
URL Sub Menu Iklan HP : http://mantpi-hp.blogspot.com
URL Sub Menu steak : http://mantpi-steaks.blogspot.com
Sedangkan untuk membuat link yang mengarah pada blog kita sendiri misalnya blognya http://blogku.com, maka buat postingan dengan judul adsense yang akan memberikan alamat URL : http://blogku.com/2009/03/adsense.html. Keteranga http://blogku.com meupakan nama domain blog kita, 2009, adalah tahun posting, 03 merupakan bulan pada saat kita melakukan postingan sedangkan adsense.html, merupakan judul postingan (bernama adsense) kita.
Dengan begitu setiap sub menu dibuatkan alamat URL yang sesuai dengan alamat positngan yang akan kita sediakan.
Langkah Kedua adalah login terlebih dahulu pada ID blogger anda, pilih TATALETAK, lalu klik EDIT HTML. Jangan lupa centang Expand Template Widget, lalu letakkan kode CSS berikut tepat diatas kode ]]>< / script>
ul#main-nav {font-family:helvetica,arial,sans-serif;margin:0;padding:0;float:left;width:100%;font-size:0.9em;}ul#main-nav li {margin:0;padding:0;list-style:none;float:left;margin:0 0.3em 0 0;width:9em;}
ul#main-nav li a {text-decoration:none;display:block;padding:0.3em 0.5em;border:1px solid silver;color:#003;background:#fff;}
ul#main-nav li a:hover, ul#main-nav li a:focus {border:1px solid gray;color:#000;background:#efefef;}
ul#main-nav li ul {padding:0;display:none;}
ul#main-nav li:hover ul {display:block;}
ul#main-nav li ul li {float:none;}
ul#main-nav li ul li a {font-size:0.9em;}
Langkah Ketiga
Setelah anda melakukan login dib logger dengan ID anda, pilih TATA LETAK selanjutnya klik ELEMEN HALAMAN, tambahkan Gadget JAVASCRIPT/HTML lalu copy paste kode HTML berikut ini.