MEMBUAT MENU DI BLOG

  • Pertama - tama, masuk ke Akun Blog Sobat,
  • Klik Template dan Klik Edit HTML,
  • Selanjutnya, cari kode ]]></b:skin> (gunakan Ctrl + F), dan Copy Paste Code dibawah tepat di atas kode tersebut.
ul.menu {list-style-type:none;width:auto;position:relative;display:block;height:33px;font-size:.6em;background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjVoFzkjZzwLChJnHA4ixP8_MaQIASh3CbTWIxTZ5iWeoifyLzP8iu1dgUJTqSY9r34VULswNJHjqlXky86kEr7IXNahrvKJSNiA-75GBHFzDwQEnvtwP8ngbDcvDrOwihgZiWR8RmXIE0/s1600/bg.png") repeat-x top left;font-family:Verdana,Helvetica,Arial,sans-serif;border:1px solid #000;margin:0;padding:0;}ul.menu li {display:block;float:left;margin:0;padding:0;}ul.menu li a {float:left;color:#A79787;text-decoration:none;height:24px;padding:9px 15px 0;font-weight:normal;}ul.menu li a:hover,.current {color:#fff;background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjVoFzkjZzwLChJnHA4ixP8_MaQIASh3CbTWIxTZ5iWeoifyLzP8iu1dgUJTqSY9r34VULswNJHjqlXky86kEr7IXNahrvKJSNiA-75GBHFzDwQEnvtwP8ngbDcvDrOwihgZiWR8RmXIE0/s1600/bg.png") repeat-x top left;text-decoration:none;}ul.menu .current a {color:#fff;font-weight:700;}/*Garis Merah*/ul.menu.red{background-color:#B11718;}ul.menu.red li a:hover, .menu.red li.current {background-color:#DE3330;}

  • Setelah kode tersebut selesai ditambahkan, silahkan Save Template. 
Selanjutnya, Masuk ke Tata Letak dan ikuti langkah - langkah berikut :
  • Klik Tambah Gadget,
  • Lalu tambahkan Fungsi Pihak ke tiga HTML/Javascript,
  • Selanjutnya, Copy Paste Kode di Bawah,
<ul class="menu red">
  <li class="current"><a href="http://fileprofessional.blogspot.com/" target="_self">Home</a></li>
  <li><a href="http://fileprofessional.blogspot.com/p/about-me.html" target="_self">About</a></li>
  <li><a href="http://fileprofessional.blogspot.com/p/contact.html" target="_self">Contact</a></li>
  <li><a href="http://fileprofessional.blogspot.com/2012/04/tukar-link.html" target="_self">Tukar Link</a></li>
  <li><a href="" target="_self"></a></li>
</ul>
Keterangan :
Silahkan ganti tulisan berwarna biru dengan kata - kata yang sobat inginkan, dan ganti juga tulisan berwarna merah
dengan link url sobat. 

setelah itu simpan
dan lihat hasil nya

Comments

Post a Comment