Widget jquery menu horizontal berguna buat blog yang memiliki link yang banyak, widget jquery menu horizontal ini juga cocok untuk menu blog yang berbasis blog Direktory. Pada tutorial kali ini saya terinspirasi dari seorang sahabat, yah boleh dibilang abangan saya sendiri yang membutuhkan suatu kode menu seperti menu widget jquery menu horizontal pada postingan kali ini. Tutorial widget jquery menu horizontal kali ini memiliki tampilan yang menarik dan code script yang ringan sehingga widget jquery menu horizontal ini menjadi salah satu pilihan para blogger mania. Oke langsung saja pada pokok pembicaraan, bila anda menginginkan pemasangan widget jquery menu horizontal ini pada halaman blog anda, silahkan simak penjelasan dibawah ini, jangan lupa dilihat demo widget jquery menu horizontal ini dan test cursor anda, agar lebih meyakinkan anda. Langsung saja menuju TKP.
Demo
Install Program CSS
- Login ke dashboard anda
- Masuk ke "TEMPLATE" lalu klik " Edit HTML "
- Cari code ]]></b:skin>
- Copy Code script CSS widget jquery menu horizontal dibawah ini, pastekan diatas code ]]></b:skin> tadi atau bila template blog anda memakai </style> silahkan pastekan kode CSS widget jquery menu horizontal tepat diatas </style> template anda.
Install Script
- Setelah anda selesai menyematkan CSS widget jquery menu horizontal, saatnya anda menyematkan kode scriptnya pada tag html/xml template anda.
- Pada Edit HTML template anda silahkan cari kode </head>
- Setelah ketemu copy script dibawah ini dan pastekan diatas kode </head>
- Perlu anda ingat bila pada template anda sudah ada kode JQUERY diatas versi 1.4 pada script tulisan kode warna biru dibawah kode tulisan warna BIRU tersebut tidak usah dikut di Copy. Bila sebaliknya versinya dibawah silahkan copy semua kode tersebut.
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("ul#BDRSnav li").hover(function() {
$(this).css({ 'background' : '#444444 '});
$(this).find("span").show();
} , function() {
$(this).css({ 'background' : 'none'});
$(this).find("span").hide();
});});</script>
<!-- Rivai Silaban | BLOG DESIGN script widget jquery menu horizontal End -->
Install Program Tag HTML
- Setelah anda selesai memasang code script widget jquery menu horizontal saatnya anda dipaksa untuk memasang kode tag htmlnya pada halaman blog anda agar muncul pada saat dibrowsing.
- Copy code dibawah dan pastekan dibawah semua code header template anda, atau diatas postingan blog anda.
- Tulisan kode warna MERAH ganti dengan link anda, sesuai dengan kebutuhan anda.
- Tulisan warna BIRU ganti dengan nama dan title menu anda.
Cth : Bila menu anda [ Tutorial ] maka title samakan dengan menu anda menjadi [ title="Tutorial" ]
- Ganti semua tulisan berwarna BIRU & MERAH sesuai dengan kebutuhan anda.
- Saya berharap anda sudah memahami CSS, silahkan edit CSSnya sesuai dengan kebutuhan blog anda.
Widget jquery menu horizontall ini sangat cocok buat para bloger yang memiliki jumlah link atau kategory yang begitu banyak sehingga semua link dan kategori dapat dilihat oleh para pengunjung dengan cepat. widget jquery menu horizontal menganut sistem penulisan tag link yang SEO Frienly.
Bila teman teman mengalami masalah dalam pemasangan wiget jquery menu horizontal ini atau ada kesalahan penulisan kode silahkan hubungi saya atau share bersama saya lewat form komentar dibawah ini. Pergunakan semua fasilitas pada halaman blog ini untuk mempermudah anda.
Widget jquery menu horizontal
Minggu, 10 November 2013
By : Rivai Silaban | Blog Design
- show up code blogspot style
- cara membuat widget menu slick blogspot
- cara membuat pop up coding style blogspot
- cara mengatasi komentar spam
- cara membuat halaman faq di blogspot
- auto tooltip title link
- cara membuat search jquery
- widget tabber accordion
- widget slider random post
- cara membuat jquery widget scroll valid html5
- cara membuat menu blogspot
- cara membuat widget menu slick blogspot
- widget mega menu blogspot
- widget menu
- widget navigasi gradient style blogspot
- widget menu bar google style
- widget Floating Menu Social media valid html5
- widget flying navigasi jquery tooltip
- cara membuat widget jquery flying menu
- cara membuat jquery flying menu valid html5
Terimakasih atas kunjungannya,Bila anda suka dengan artikel ini silahkan JOIN TO MEMBER BLOG atau berlangganan geratis Artikel dari blog ini, daftarkan email anda pada form subscribe dibawah halaman . Pergunakan vasilitas diblog ini untuk mempermudah anda. Bila ada masalah dalam penulisan artikel ini silahkan kontak saya melalui kotak komentar yang ada dibawah atau gunakan fasilitas yang ada diblog ini untuk menghubungi saya.
Salam Blogger.... !!! .
Admin Rivai Silaban
ini yg ku cari, thank gan
ReplyDeletecara menghilangkan hari tanggal gmna gan
ReplyDelete