Read more: http://infokuinspirasiku.blogspot.com/2011/03/cara-membuat-tulisan-berjalan-di.html#ixzz1fx4v9wGg http://infokuinspirasiku.blogspot.com/ Under Creative Commons License: Attribution Share Alike Tobey_sahruL: Membuat Menu Horizontal Sederhana di Header

Translate disini !!

Welcome To Tobey Sahrul's Blog

Sabtu, 10 Desember 2011

Membuat Menu Horizontal Sederhana di Header

Beberapa saat yang lalu ada yang menanykan bagaimana membuat menu di bawah judul blog seperti yang ada di Belajar Ngeblog di BLOG ini. Sekarang baru ingat dan sempat menjawabnya. Layaknya header, adalah salah satu tempat yang sering dilihat. Ada judul blog kita, dan bisa kita beri menu di bawahnya, seperti yang saya lakukan.


Sekarang kita akan belajar membuat menu horizontal yang sederhana di header. Yang perlu ditekankan adalah kesederhaan itu. Karena memang menu itu saya buat hanya menggunakan kode HTML yang sederhana berupa deretan link-link. Menu navigasi yang mudah akan memberikan pengalaman yang baik bagi pembaca blog kita. Menu horizontal ini saya buat terlebih dulu dengan menambahkan elemen gadget di header. Jika sudah, langkah selanjutnya adalah sebagai berikut.


Cara Membuat Menu Horizontal Sederhana di Header
1. Pilih Rancangan
2. Klik Tambah Gadget yang ada di Header
3. Pilih HTML/JavaScript
4. Masukan kode HTML berikut ini:


<b><div style="text-align: center;"> <a 
href="http://wberbagiilmu.blogspot.com">Home</a>| <a href="http://wbebagiilmu.blogdetik.com">Blogdetik</a>| <a href="http://Tobeysahrul.wordpress.com">Wordpress</a>| <a href="http://Tobeysahrul.multiply.com">Multiply</a>| <a href="http://Tobeysahrul.posterous.com">Posterous</a>| <a 
href="http://twitter.com/@sahrulhabibi">Twitter</a>| <a 
href="http://www.facebook.com/Tobey.sahrul">Facebook</a>| 
</div></b>

5. Teks yang berwarna Biru adalah URL yang dituju sedang yang berwarna merah adalah teks yang tampil. Kita bisa menambahkan lebih banyak link sesuai lebar header dan link yang ingin kita tampilkan, dengan menambahkan kode yang tercetak miring setelah | yang terakhir.
6. Simpan jika sudah selesai.

0 komentar:

Posting Komentar

Silahkan membaca membaca dan Copy Paste juga boleh kok asal kalian seneng ;)