TUTORIAL : Horizontal Menu Bar

Assalammualaikum and Hye Blogger's//

Nampak x gambar di atas? Hari ni kita belajar tutorial nak buat horizontal menu bar/menu bar mendatar macam yang di atas ya. Jadi, jom mulakan :
  • Pertama korunk kene Sign in Blog dulu lah kan ? then pergi ke DESIGN > ADD A GADGET > HTML/JavaScript 
  • Then korunk copy & paste code dekat bawah ni okey?? 

<style>
.navi{
padding:5px;
display: inline-block;
font:11px verdana;
font-weight:bold;
text-align:center;
margin:2px;
color:white;
text-decoration:none;
letter-spacing:2px;
-webkit-transition-duration:0.5s;
}
.navi:hover{
background:#ffffba;
border-radius:5px;
text-decoration:none;
-webkit-transition-duration:0.5s;
color:black;
}
</style>
<center><div style="padding:3px;background:#fed5d5; width:980px;">
<a class="navi" href="URL LINK/">PERKATAAN ANDA</a>
<a class="navi" href="URL LINK">PERKATAAN ANDA</a>
<a class="navi" href="URL LINK">PERKATAAN ANDA</a>
<a class="navi" href="URL LINK">PERKATAAN ANDA</a>
<a class="navi" href="URL LINK">PERKATAAN ANDA</a>
<a class="navi" href="URL LINK">PERKATAAN ANDA</a>
<a class="navi" href="URL LINK">PERKATAAN ANDA</a>
</div></center>

  • OKAY! Dah selesai copy paste now save dan view blog korang. Kalau nak cantikkan navbar tuh korang ubah je mana yang una higlight kan tuh yer? :D semoga dapat membantu 

ungu : untuk bahagian backgroun navbar
hijau : untuk bahagian yang bila cursor sentuh link
kuning : bahagian lebar dan background luar navbar

NOTA BIT BOT :
Kena pandai mix and match tau! tq guys


Hai! Selamat membaca. Jangan lupa tinggal komen ya?

Giveaway 7 HARI by Syira Lokman

Assalammualaikum and Hello Blogger's


Jom join giveaway ni. Kot2 rezeki mana lah tahu. Boleh ramah tamah dengan blogger lain jugak. JOM3! Click je banner dekat atas untuk join. Esok dah date dia. sempat lagi tau! cepat3.. hehe..

Hai! Selamat membaca. Jangan lupa tinggal komen ya?

TUTORIAL : Cute icon sebelah tittle Blog Archieve

Assalammualaikum and Hello Blogger's//
Nampak tak cute icon sebelah tittle Blog Archieve tuh? so, ini dia tutorialnya. jom belajar!

1.First sila log in Blog anda
2.Pilih perkataan Template -> Edit HTML -> Click ctrl+F -> Search code di bawah ni ->
<li><a expr:href='data:i.url'><data:i.title/></a></li>
3.Jumpa? sekarang korang gantikan code di atas dengan code yang dibawah ni :
 <li><img src='URL CUTE ICON'/><a expr:href='data:i.url'><data:i.title/></a></li>
4.Code biru tuh korang boleh ganti dengan apa-apa sahaja url cute icon yang korang nak.
5.Preview untuk pastikan tiada error. kalau dah okey SAVE kan aje! huhu :D
Hai! Selamat membaca. Jangan lupa tinggal komen ya?