Mengenai Saya
Label
Entri Populer
-
Setelah sebelumya ane menjelaskan Cara Membuat Blog Di Blogspot I Tutorial Membuat Blog , pada postingan ane kali ini, ane akan menjelaskan ...
-
A pakah sobat memasang buku tamu dengan mengunakan shoutmix ? Bagaimana rasanya setelah terpasang ? Tentu semakin seru saja kan, wa...
-
Haii sobat :), di kala senja dan hujan ini ane akan membagikan sembako Cara Membuat Follow Twitter Berbentuk Burung I Tutorial Widget B...
-
Postingan kali ini ane tujukan bagi kamu yang gemar menulis artikel , kenapa? ya sesuai judulnya, maka kita akan mendapatkan uang dengan ...
-
Sobat pasti pernah bookmarks situs kesayangan di browser milik sobat, ini agar supaya mudah sewaktu-waktu kembali ke situs atau website ters...
Diberdayakan oleh Blogger.
Rabu, 21 Mei 2014
Mungkin sobat sudah tidak asing lagi dengan yang namanya menu horizontal. Di sini saya akan membuat sebuah menu navigasi horizontal secara sederhana yang tentunya lebih mudah di terapkan pada sebuah template. Menu ini biasanya terletak di bawah header.
Di bawah ini adalah gambar menu navigasi horizontal yang akan kita buat.
Kita langsung saja menuju bagaimana cara membuatnya.
- Masuk ke blog sobat
- Pilih tata letak atau rancangan.
- Klik tambah gadget.
- Pilih HTML/Java Script.
- Kemudian masukkan kode di bawah ini.
<style type="text/css">
/*----------------------------------*/
.Nav a { width: auto; height: auto; text-decoration: none; }
.Nav a { text-align: center; text-decoration:none;color:#ffffcc; padding:1px 20px 1px 20px;font-weight:bold; font-size:12px; }
.Nav a:hover {padding:3px 20px 3px; 20px; text-align:center; text-decoration:none; color:#000033; font-weight:bold; border:3px; background-color: #000000;}
</style>
<div style="border: 3px solid #ffcc99; height:px;background-color:#FF3366;">
<div style="width: auto; padding: 10px;" class="Nav" align="left">
<a href="http://activekita.blogspot.com"target="_blank"><span style="font-weight:bold; color:#FFFF00; ">HOME</span></a>
<a href="http://activekita.blogspot.com/2010/01/kode- warna.html"target="_blank"><span style="font-weight:bold;color:#FFff00;">JUDUL1 </span></a>
<a href="http://activekita.blogspot.com/2010/08/menambah-satu-kolom-di-bawah-header.html"target="_blank"><span style="font-weight:bold; color:#FFff00;">JUDUL 2</span></a>
<a href="http://activekita.blogspot.com/2010/10/membuat-menu-navigasi-horizontal.html"target="_blank"><span style="font-weight:bold; color:#FFff00;">JUDUL 3</span></a>
<form action="http://activekita.blogspot.com/search" id="searchform" method="get" style="display: inline; float:right; padding-right:10px; padding-bottom:px" > <input id="searchbox" maxlength="" name="q" onblur="if (this.value == "") {this.value = "Search...";}" onfocus="if (this.value == "Search...") {this.value = ""}" value="Search..." type="text" /> <input class="btn" name="" " value="search" type="submit" span style="font-weight:bold; font-size:12px; color:#ff3399" />
</form>
</div></div>
- Ganti yang warna hijau dengan alamat link milik sobat. Bila perlu sobat bisa tambah dengan link sobat yang lain.
Jangan lupa isi juga keterangan yang sesuai pada judul. - Klik simpan.
Langganan:
Posting Komentar
(Atom)
0 komentar:
Posting Komentar