About Me

Sabtu, 09 Februari 2013


Cara Membuat Menu Pada Blog


Pada posting kali ini, tutorialblogx akan memberikan sebuah informasi mengenai Cara Membuat Menu Pada Blog . ya fungsi dari menu pada blog ini adalah untuk mempermudah pengunjung blog untuk menjelajahi isi dari artikel sobat. dan style atau gaya ataupun tampilan yang saya share disini berwarna hitam dengan garis merah
pertama masuk ke bagian edit template sobat, kemudian cari kode ]]></b:skin> ( gunakan F3 agar mempercepat pencarian )
bila sobat sudah menemukan ]]></b:skin> selanjutnya sisipkan kode dibawah ini tepat di atas ]]></b:skin>

ul.menu {list-style-type:none;width:auto;position:relative;display:block;height:33px;font-size:.6em;background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgf5xOKwlD7DQmeKQaulX0Cuy8ffUYiIfY4UI89UdkfcDQMlk636DN0PTaiOTeb-Ie8RmhrA6nUTiM1xuqsRep7M_Voi3UfVJ9GHMS6XXYxRSNWkH5QFc1h_emLQhRtY6a8JRsUmXFso-w/s1600/bg.png") repeat-x top left;font-family:Verdana,Helvetica,Arial,sans-serif;border:1px solid #000;margin:0;padding:0;}
ul.menu li {display:block;float:left;margin:0;padding:0;}
ul.menu li a {float:left;color:#A79787;text-decoration:none;height:24px;padding:9px 15px 0;font-weight:normal;}
ul.menu li a:hover,.current {color:#fff;background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgf5xOKwlD7DQmeKQaulX0Cuy8ffUYiIfY4UI89UdkfcDQMlk636DN0PTaiOTeb-Ie8RmhrA6nUTiM1xuqsRep7M_Voi3UfVJ9GHMS6XXYxRSNWkH5QFc1h_emLQhRtY6a8JRsUmXFso-w/s1600/bg.png") repeat-x top left;text-decoration:none;}
ul.menu .current a {color:#fff;font-weight:700;}
/*Garis Merah*/
ul.menu.red{background-color:#B11718;}
ul.menu.red li a:hover, .menu.red li.current {background-color:#DE3330;}
kemudian save template.

hal selanjutnya adalah masuk ke bagian tata letak atau tempat menambahkan widget, dan hal terakhir adalah sisipkan kode dibawah ini dimana sobat ingin menu tersebut muncul

<ul class="menu red">
<li class="current"><a href="#(url homepage anda)">Home</a></li>
<li><a href="#">EDIT ME</a></li>
<li><a href="#">EDIT ME </a></li>
<li><a href="#">EDIT ME</a></li>
<li><a href="#">EDIT ME</a></li>
<li><a href="#">EDIT ME</a></li>
<li><a href="#">EDIT ME</a></li>
</ul>
ganti dengan link yang dituju

0 komentar:

Kapit 3

Ganti Background Disini !!



Pasang Seperti Ini

Mau buat buku tamu ini ?
Klik di sini
Saya Mengintai Kamu !!

Translate

Copyright©® Text

By Helmi Bagindaria

MY Profile

MY Profile

Visitors

Flag Counter

NO klik Kanan

Postingan Populer

Popular Posts

My Blog List

Total Visitor

English French German Spain Italian Dutch

Russian Brazil Japanese Korean Arabic Chinese Simplified
Translate Widget by Google

Search

New Tutorial

 

Postingan Populer

New Story of My Life

Follow Us With Facebook

Name* :
Url* :
Comment*:
Smilies* | Help*
Copyright© 2011 Bagin.Info | Template Blogger Designer by : Bagin' |
Template Name | Bagin Transparent : Version 1.0 | Bagin.Info