Tutorial buat menu tab comel di background blog...

Tuto nie aku copy paste dari blog Fiza   Contoh macam bawah ni.Takpun korang click  Fizatue menuju ke blognya...

Disebabkan ada yang bertanya dan ada masa nak buat tuto simple ni.

So,Fiza akan buat tuto ni untuk dikongsi bersama.Dah mintak izin pada tuan punya tuto dan dia dah izinkan pun.Fiza buat ni pun dari tuto si dia[N comel] ni.Thanks a lot ye.^__^. OK,jomlah try jugak

[Sebelum mulakan tutor ni,save dulu template blog korang>>download]

1.Log in blogger>>Dashboard>>Design>>Edit HTML

2.Click pada expand widget templates

3.Cari code ]]></b:skin>

*tekan serentak ctrl+f dan masukkan code no 3 di dalam box untuk memudahkan pencarian

4.Copy code bawah ni

/* LIST #8 */
#list8 { }
#list8 ul { list-style:none;}
#list8 ul li { font-family:Georgia,serif,Times; font-size:18px;margin:1px; }
#list8 ul li a { display:block; width:80px; height:28px; background-color:#000000; border-right:10px solid #FFFFFF; padding-left:40px;
text-decoration:none; color:#FFFFFF; }
#list8 ul li a:hover { -moz-transform:rotate(-5deg); -moz-box-shadow:10px 10px 20px #000000;
-webkit-transform:rotate(-5deg); -webkit-box-shadow:10px 10px 20px #000000;
transform:rotate(-5deg); box-shadow:10px 10px 20px #000000; }

*Customize coding ikut kesesuaian blog,korang boleh tukar jenis font,warna font,size font,warna background dan position tab menu tu.

code warna[di sini]

5.Pastekan code no4 sebelum code  ]]></b:skin>

6.Cari code </body>

*tekan serentak ctrl+f dan masukkan code no 5 di dalam box untuk memudahkan pencarian

7.Copy code bawah ni

<div style='display:scroll; position:fixed; top:150px; left:-40px;'>
<div id='list8'>
<ul>
<li><a href='URL BLOG'>Home</a></li>
<li><a href='URL/LINK '>Tajuk</a></li>
<li><a href='URL/LINK '>Tajuk</a></li>
<li><a href='URL/LINK '>Tajuk</a></li>
</ul>
</div>
</div>

*letak link menu dan tajuk menu pada code di atas ni

8.Paste code no 7 sebelum code </body>

9.Preview

10.Kalau dah ok tekan SAVE

---

TERIMA KASIH SUDI BACA DAN KOMEN

---