ANGRY JACK: Membuat Menu Blog

Membuat Menu Blog

12.58 |

yang Posting : ANGRY JACK |

Selamat datang di blog saya. Kali ini saya akan share tentang cara membuat menu pada blogger. Trik ini tidaklah sulit karena tidak terlalu banya kode html yang terpisah. So, kenapa tidak dicoba untuk sekedar mempercantik blog anda?

Klik link di bawah ini untuk melihat demonya!
CONTOH

Oke tida perlu berlama-lama. Langsung saja

Masuk ke akun blogger anda

Pilih Design >> Edit HTML

Cari kode ]]></b:skin>

Letakkan kode di bawah ini di atas kode tadi

#trikbloggermenucontainer{height:37px;display:block;padding:0 0 0 0;font:12px Arial,Tahoma,Century gothic,verdana,sans-serif;font-weight:normal;background:#191917;border-bottom:1px solid #3d3d3d} #trikbloggermenu{margin:0 auto;padding:0 0;height:37px;overflow:hidden;width:1000px} #trikbloggermenu ul{float:left;list-style:none;margin:0;padding:0 10px} #trikbloggermenu li{float:left;list-style:none;margin:0;padding:0} #trikbloggermenu li a,#trikbloggermenu li a:link,#trikbloggermenu li a:visited{color:#999;display:block;margin:0;padding:0 10px;line-height:37px} #trikbloggermenu li a:hover,#trikbloggermenu li a:active{color:#fff;margin:0;padding:0 10px;line-height:37px;text-decoration:none} #trikbloggermenu li.current_page_item a{background:#034E9D;color:#fff} #trikbloggermenu li li a,#trikbloggermenu li li a:link,#trikbloggermenu li li a:visited{background:#363737;width:150px;color:#bebebe;float:none;margin:0;padding:0 10px;font-weight:normal;line-height:30px;border-bottom:1px solid #212121} #trikbloggermenu li li a:hover,#trikbloggermenu li li a:active{background:#4a4a4a;color:#fff;padding:0 10px;line-height:30px;border-left:none;border-right:none;border-bottom:1px solid #212121} #trikbloggermenu li ul{z-index:9999;position:absolute;left:-999em;height:auto;width:170px;margin:0;padding:5px;background:#1C1C1C} #trikbloggermenu li li{} #trikbloggermenu li ul a{width:140px} #trikbloggermenu li ul a:hover,#trikbloggermenu li ul a:active{} #trikbloggermenu li ul ul{margin:-36px 0 0 170px} #trikbloggermenu li:hover ul ul,#trikbloggermenu li:hover ul ul ul,#trikbloggermenu li.sfhover1 ul ul,#trikbloggermenu li.sfhover1 ul ul ul{left:-999em} #trikbloggermenu li:hover ul,#trikbloggermenu li li:hover ul,#trikbloggermenu li li li:hover ul,#trikbloggermenu li.sfhover ul,#trikbloggermenu li li.sfhover1 ul,#trikbloggermenu li li li.sfhover1 ul{left:auto} #trikbloggermenu li:hover,#trikbloggermenu li.sfhover1{position:static}

Setelah itu cari kode <div id='main-wrapper'>

Letakkan kode di bawah ini di bawah kode tadi

Anda bisa menambahkan drop down dari menu-menu yang ingin anda masukkan sebelum tag </ul>.

tambahan yang anda masukkan

<li><a href='Your-Link-Here' title='Link-Title'>teks yang ditampilkan</a></li>

<li><a href='link anda' title='Link-Title'>teks yang ditampilkan</a>

<li><a href='link anda' title='Link-Title'>teks yang ditampilkan</a></li>

</ul>

</li>

Anda bisa menambahkan kode yang warnanya seperti ini sampai berapapun.

SELAMAT MENCOBA. KEEP POSTING UNTUK ANDA