Tutorial : Menu Tab yang Ohsem

Salam Alaykum !!hari nie ade tutorial lagi !! sebab Mr.Oziz Tale request kat tagboard kite haaa..so kite pun ape lagi buat lah tuto nie..okay jom kita mulakan yuk !!..

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

2.Click pada expand widget templates

3.Cari code

 ]]></b:skin>

4.Copy code bawah ni

/* LIST #8 */
#list8 { }
#list8 ul { list-style:none;}
#list8 ul li { font-family:Verdana,Tahoma,Century Gothic; font-size:18px;margin:1px; }
#list8 ul li a { display:block; width:85px; height:30px; 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; }

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

6.Cari code 

</body>

7.Copy code bawah ni dan paste ATAS code </body>

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

8.Preview dan kalau dah okay baru lah SAVE !!!

p/s : Korang boleh tukar warna yang ikut kesesuaian blog korang. Yang HIJAU tu untuk background, dan yang BIRU tu untuk tulisan dan border kanan. Korang boleh pilih code warna kegemaran korang di sini. HTML COLOR CODE

thanks for reading this entry..

love,

aznishamsuddin

   

Read More

Tutorial : Border yang Ohsem untuk Sidebar

SalamAlaykum semua !! hari nie terpanggil nak buat tutorial lagi hari nie..sebab ade permintaan dari someone..na tahu macam mana ghupa border kat sidebar..haaa sila tengok gambar gedabak kat bawah nie..so sekarang nie tak payah nak berjela-jela membebel kan..kita teruskan tutorial ini..

1.Dashboard > Design > Edit HTML > Tick Expand Widget Templates

2.Tekan Ctrl + f serentak dan cari code ni   

.sidebar .widget { 

3.Copy code kat bawah ni

border-top-left-radius: 25px 25px;
border-top-right-radius: 25px 25px;
border-bottom-left-radius: 25px 25px;
border-bottom-right-radius: 25px 25px;
border: 3pt groove #ADD8E6;
border-top:6px double#ADD8E6;
border-bottom:6px double #ADD8E6;
border-right:6px inset #ADD8E6;
border-left:6px outset #ADD8E6;
border-top-left-radius: 25px 25px;
border-top-right-radius: 25px 25px;
border-bottom-left-radius: 25px 25px;
border-bottom-right-radius: 25px 25px;
}

lepas tue paste di bawah code  .sidebar .widget {  ..nanti code tue akan kelihatan seperti di bawah nie..

.sidebar .widget {
border-top-left-radius: 25px 25px;
border-top-right-radius: 25px 25px;
border-bottom-left-radius: 25px 25px;
border-bottom-right-radius: 25px 25px;
border: 3pt groove #ADD8E6;
border-top:6px double#ADD8E6;
border-bottom:6px double #ADD8E6;
border-right:6px inset #ADD8E6;
border-left:6px outset #ADD8E6;
border-top-left-radius: 25px 25px;
border-top-right-radius: 25px 25px;
border-bottom-left-radius: 25px 25px;
border-bottom-right-radius: 25px 25px;
}

1) Code nombor 6px tue korang boleh ubah kepada sebarang nombor bagi ketebalan border.

2) code inset dan outset mewakili jenis BORDER.

3) Code  #ADD8E6  mewakili warna border..korang boleh ubah warna border..untuk warna yang lain korang boleh pergi --> SINI

4) Preview dan save kalau tiada error pada coding. 

thanks for reading this entry..

love,

aznishamsuddin

Read More