cara-cara nak letak menu bar di blogger.


Salam u all.. sepanjang cuit ni saya sibuk sikit dengan peperiksaan,,oke lah hari ni saya nak tunjukkan cara nak buat menu bar diblogger dari permintaan seorang rakan..mcm yang anda lihat di gambar diatas adalah contoh menu bar yang akan saya terangkan..tutorial ini amat mudah..

1,buka akuan blogger anda,

2,pergi ke add a gadjet(pastikan kord yang saya ber diletak dibawah header)/html java script.

3,salin semua kord dibawah.




<style>
#container {
width: 100%;
margin: 0px 0px;
padding: 0px 0px 40px 10px;
}

ul, li {
margin: 0; padding: 0;
}

#blob {
border-right: 1px solid #0059ec;
border-left: 1px solid #0059ec;
position: absolute;
top: 0;
z-index : 1;
background: #0b2b61;
background: -moz-linear-gradient(top, #0b2b61, #1153c0);
background: -webkit-gradient(linear, left top, left bottom, from(#0b2b61), to(#1153c0));
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
-moz-box-shadow: 2px 3px 5px #011331;
-webkit-box-shadow: 2px 3px 5px #011331;
}

#lava-lamp {
background: #32312E;
float: left;
border: 1px solid #BDBCBA;
margin: 0px 0px 15px;
padding: 5px 10px 10px 0px;
}

#lava-lamp li {
float: left;
list-style: none;
border-right: 1px solid #4a4a4a;
border-left: 0px solid #4a4a4a;
}

#lava-lamp li a {
color: #DDDCD8;
text-shadow: 0 0px 1px #81807B;
position: relative;
z-index: 2;
float: left;
font-size: 13px;
font-family: arial, sans-serif;
font-weight: bold;
text-decoration: none;
padding: 0px 20px;
}
</style>

<div id="container">

<ul id="lava-lamp">
<li id="selected"><a href="http://aerol-rianbow.blogspot.com/">Home</a></li>
<li><a href="http://twitter.com/how_to_be_famou">Twitter</a></li>
<li><a href="http://tip-tipberguna.blogspot.com/">Blogger Tip Menarik</a></li>
<li><a href="http://www.myspace.com/aerol-plane">myspace</a></li>
<li><a href="http://penjualanemailspider.blogspot.com/">software terbaik dunia</a></li>
<li><a href="http://www.facebook.com/profile.php?id=1329582786">Find to Facebook</a></li>
</ul>

</div>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js" type="text/javascript"></script>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js"></script>

<script type="text/javascript" src="https://sites.google.com/site/jquery01/jquery.spasticNav.js"></script>

<script type="text/javascript">
$('#lava-lamp').spasticNav();
</script>





4.pergi ke add a gadjet/html script dan paste kord di bawah header..

Peringatan........ tulisan yang bewarna biru tu korang gantikan dengan url korang dan yang warna merah tu korang letak ape yang korang nak paparkan di menu bar nanti... pastikan url korang bersesuian dengan perkataan yang korang letak contoh 'find me on facebook,pastikan korang letak url facebook korang di perkataan find me on facebook itu tadi'...
selain tu korang boleh adjust warna dan saiz menu bar korang..
okeh..
kalau anda tak faham,sila beri respon..saya akan bantu.
.

11 ulasan:

faralolly ;) berkata...

yeahhh ~ smart !

Tanpa Nama berkata...

mcm mne klau nk ubah size die n warna?? ubah kod yg mne??

Putri Affea berkata...

Boleh tanya? Macam mana nak center kan menu bar itu?

Unknown berkata...

center?
okeh...
tambah code nh kat code html yang saya beri diatass.

<center>masukkan code yang saya beridiatas</center>

geekz36 berkata...

terbaik la. aku nak try

Yulia Fajrin berkata...

waa...mohon share info dari sini..boleh??nanti saya tag nama kamu sekali...

nice blog! :D

Dol berkata...

terbaik plus stylo! huhu

AsmidarTodt berkata...

nak tanya kit...regarding nak bg center kan menu bar tuh, msukn kod center tuh tp nak selit kat ne (sy bru lgi dlm bege membege blog ni..tq)

Unknown berkata...

kalau nk bga center .. ..awk perlu copy code saya bagi ni

<center>PASTE CODE MENU YG SAYA BAGI KAT ATAS DITENGAH INI</center>

hajar latif berkata...

wah~! tengs 4 the tutorial~! try yer!

Unknown berkata...

hajar latif:
buat lah,kalau apa2 hal inform kt inbox fb yea

Artikel menarik

Related Posts Plugin for WordPress, Blogger...

lik lak,kejap jeww ^^

Daisypath Anniversary tickers