kulo-Tech Headline Animator

Selasa, 14 September 2010

Cara Membuat Navigation Menu Chrome di Blog

Cara Membuat Navigation Menu Chrome  di BlogOke langsung saja. Contoh Menu Chrome ini adalah menu yang saya pasang di blog ini. Fungsinya adalah agar pengunjung blog anda akan lebih mudah untuk mengakses fitur-fitur yang tersedia di blog anda. Langsung saja anda ikuti langkah berikut:



Cara Membuat Navigation Menu Chrome  di Blog








1. Login ke Blogger
2. Masuk ke Layout>Edit HTML
3. Cari Code: </head> Lalu copy>paste code dibawah ini, diatas code: </head>




<style type="text/css">




/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */




#chromemenu{
width: 99%;
font-weight: bold;
font-size: 90%;
}




#chromemenu:after{ /*Add margin between menu and rest of content in Firefox*/
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}




#chromemenu ul{
border: 1px solid #BBB;
width: 100%;
background: url(http://img33.imageshack.us/img33/1341/chromebg.gif) center center repeat-x;
padding: 5px 0;
margin: 0;
text-align: left; /*set value to "right" for example to align menu to the left of page*/
}




#chromemenu ul li{
display: inline;
}




#chromemenu ul li a{
color: #494949;
padding: 5px;
margin: 0;
text-decoration: none;
border-right: 1px solid #DADADA;
}




#chromemenu ul li a:hover{
background: url(http://img190.imageshack.us/img190/4451/chromebg2.gif) center center repeat-x;
}




</style>

4. Save editan anda.

5. Masuk kembali ke: Layout>Add a Gadget>HTML/Javascript

6. Copy>Paste Code dibawah ini:


<div id="chromemenu">
<ul><center>
<li><a href="URL tujuan">Nama Menu</a></li>
<li><a href="URL tujuan">Nama Menu</a></li>
<li><a href="URL tujuan">Nama Menu</a></li>
<li><a href="URL tujuan">Nama Menu</a></li>
</center></ul>
</div>

KETERANGAN:

- Ganti Nama Menu dengan Menu blog anda.
- Gantu URL tujuan dengan URL menu blog anda

by: tipspack.com.







SELAMAT MENCOBA :)

klo berhasil jangan lupa komentar yua...Hhe

0 comments:

Posting Komentar

Related Posts with Thumbnails

Subscribe Via Email

Enter your email address:

Delivered by FeedBurner

Iklan Mobil Iklan Properti

About Me

kulo-Tech
kulo-Tech Blog menyajikan berbagai informasi terkini dan menyediakan fitur-fitur yg tersedia. Berbagai tutorial telah tersedia disini agar menambah wawasan kita. Blog pribadi kini menjadi blog community dan sebagai layanan media promo bisnis yg telah kami sediakan. Terimakasih pada teman-teman yg telah mendukung dan pihak-pihak yg telah berpartisipasi atas perkembangan kulo-Tech ini. Mohon kritik dan saran
Lihat profil lengkapku