13 Jun 2012

Membuat Menu Diatas Header Ala Blog Muro'i El-Barezy

·   20

Assalamu 'alaikum. Sobat Muro'i El-Barezy, dalam postingan kali ini masih tentang ngoprek template. Yang sebelumnya pernah posting membuat Menu Horizontal Cantik Pengganti Navbar, kali inipun masih tentang menu. Karena ada sobat Muro'i El-Barezy yang menanyakan bagaimana membuat menu di atas header seperti blog ini, yaitu sobat Muhammad Hidayat.
Sebenarnya menu diatas adalah bawaan dari template ini alias sudah ada dari sononya. Cuma pernah ane hilangkan dan menggantinya dengan menu horizontal yang lain. Demonya bisa dilihat pada header blog ini. Nah barangkali mungkin juga cocok di template sobat Muhammad Hidayat atau sobat yang lain, silakan ikuti tutorial berikut ini :
  • Login ke Blogger
  • Click tab "rancangan" (kalau dalam bahasa indonesia)
  • Terus click sub tab "Edit HTML"
  • Sebelum edit template sobat, ada baiknya untuk membackup templatedahulu.
Copy code dibawah ini dan paste code tersebut tepat di diatas tag " ]]></b:skin> " 
/* Top Horisontal
---------------------------------------------*/
.toppic{background:transparent; width:100%; margin:0 auto;}
.topnav{width: 980px;height:32px;overflow: hidden;margin:0 auto;padding:0 auto;color:#555;font:bold 13px Arial;}
.toppic a:link, .toppic a:visited {color:#800000;text-decoration:none;}
.toppic a:hover {color:#000;text-decoration:underline;}

Selanjutnya copy juga code dibawah ini dan paste tepat dibawah tag "<body>"
 

Yang terakhir adalah SAVE template sobat. Semoga bermanfaat dan selamat mencoba

Catatan :
Silakan sobat meng-custom sesuai selera sobat dengan mengganti warna font, merubah link dan lainnya.


Subscribe to this Blog via Email :