Cara Pasang Tab Menu Bar Pada Blog

Cara Pasang Tab Menu Bar Pada Blog

Tanpa tab menu bar pada sebuah blog atau website kelihatan ada kekurangan pada blog tersebut. Fungsi tab menu bar memudahkan pelawat anda mencari maklumat di blog anda dengan mudah. Tutorial sebegini banyak anda temukan. Baiklah saya akan tunjukkan bagaimana cara membuatnya.

Untuk memasang tab menu bar sila ikuti langkah-langkah seperti dibawah, sebelum melakukan perubahan pada fungsi ini sila simpan skrip template anda terlebih dahulu untuk memudahkan anda backup semula sekiranya terjadi apa-apa masalah.

1.Log in blog => Dashboard => Layout => Edit HTMLdan ( centangkan pada kotak Expand Widget).

2.Tekan F3, taip atau paste kod ]]></b:skin> pada ruang Find. Seterusnya tekan
enter untuk mengetahui posisi kod tersebut

3.Salin kod berwarna biru di di dalam  dan paste di atas atau sebelum kod
   ]]></b:skin>
   p/s: Anda boleh edit kod biru yang di bold mengikut kesesuaian blog anda jika perlu.
/* menu bar */ 
#menubar{ 
margin: 0; 
padding: 0; 
float:left; 
border:1px solid #e5e5e5; 
width:100%; 
background:#e5e5e5; 
} #menubar li{ margin: 0; 
padding: 0; 
list-style: none; 
float: left; 
font: bold 11px arial; 
} #menubar li a{ display: block; 
margin: 0; 
padding: 4px 10px; 
background: #666; 
color: #fff; text-align: center; 
text-decoration: none; 
border:2px solid #ffffff; 
border-right:3px solid #ccc; 
} #menubar li a:hover{ background: #000; 
} #menubar div{ position: absolute; 
visibility: hidden; 
}

4.Salin kod di bawah dan paste pada notepad. Gantikan kod merah dengan URL dan teks pilihan anda.

<ul id='menubar'>
<li><a href='#'>HOME</a></li>
<li><a href='#'>PROFILE SAYA</a></li>
<li><a href='#'>E MAIL SAYA</a></li>
<li><a href='#'>LINK 1</a></li>
<li><a href='#'>LINK 2</a></li>
</ul>

5.Tekan semula F3, taip atau paste kod <div id='content-wrapper'> pada ruang Find dan seterusnya tekan Enter.

6.Salin kod diatas yang telah anda edit tadi dan paste kod tersebut tepat di bawah atau selepas kod <div id='content-wrapper'>

Akhir sekali, klik Preview dan jika tiada mesej Error yang terpapar, klik saja Save. Itulah trick cara pasang tab menu bar pada blog saya kali ini...




No comments:

Post a Comment