Kamis, 20 Agustus 2015

Membuat Sendiri Program Kasir Menggunakan Visual Basic-6

Assalammu'alaikum....

Apakabar Gan.....????
Pada postingan kali ini saya ingin berbagi tentang cara membuat sendiri program kasir dengan menggunakan Visual Basic-6.
Di bawah ini adalah aplikasi kasir sederhana sebuah rumah makan :

Step-1

Buatlah desainnya seperti gambar di bawah ini :

Step-2

Kita atur propertiesnya sebagai berikut :

1	Name : label tanggal	Caption : -
2	Name : label jam	Caption : -
3	Name : text Id Menu	Text : -
4	Name : text Menu	Text : -
5	Name : text satuan	Text : -
6	Name : text harga	Text : -
7	Name : text pesanan	Text : -
8	Name : text total	Text : -
9	Name : text dibayar	Text : -
10	Name : text kembalian	Text : -
11	Name : cmnd menu baru	Caption : menu baru
12	Name : cmnd tutup	Caption : tutup
13	Name : Timer1	Interval : 1

Step-3

ketik kode sesuai dengan fungsinya masing-masing.

Klik 2x pada cmnd menu baru, isi dengan (copy paste) kode berikut :

Private Sub Command1_Click()
Text1.Text = ""
Text2.Text = ""
Text3.Text = ""
Text4.Text = ""
Text5.Text = ""
Text6.Text = ""
Text7.Text = ""
Text8.Text = ""

Text1.SetFocus
End Sub

Klik 2x pada cmnd tutup, isi dengan (copas) kode berikut :

Private Sub Command2_Click()
End
End Sub

Klik 2x pada text1.text (text Id Menu) dan copas kode berikut :

Private Sub text1_KeyPress(KeyAscii As Integer)
If KeyAscii = 13 Then
If Text1.Text = 901 Then
Text2.Text = "Sate Kambing"
Text3.Text = "Porsi"
Text4.Text = 20000

ElseIf Text1.Text = 902 Then
Text2.Text = "Gulai Kambing"
Text3.Text = "Porsi"
Text4.Text = 15000

ElseIf Text1.Text = 903 Then
Text2.Text = "Soto Ayam Kampung"
Text3.Text = "Porsi"
Text4.Text = 22000

ElseIf Text1.Text = 904 Then
Text2.Text = "Soto Daging"
Text3.Text = "Porsi"
Text4.Text = 25000

Else
MsgBox ("Menu yang dipesan belum ada...!")
End If
Text5.SetFocus

End If
End Sub

Klik 2x pada text5.text (text pesanan) dan ketik kode di bawah ini :

Private Sub text5_Change()
Text6.Text = Val(Text4.Text) * Val(Text5.Text)
End Sub

Klik 2x pada text7.text (text dibayar) dan copas kode berikut :

Private Sub text7_Change()
Text8.Text = Val(Text7.Text) - Val(Text6.Text)
End Sub

Klik 2x pada Timer1, dan ketik (copas) kode di bawah ini :

Private Sub Timer1_Timer()
Label2.Caption = Format(Date, "dd mmmm yyyy")
Label4.Caption = Format(Time, "hh:mm:ss")
End Sub

Naah sekarang silahkan Running, maka hasilnya akan seperti di bawah ini :

Demikian yang bisa saya bagi, dan semoga bermanfaat ya gan.......

Cara Membuat Menu Dropdown / Sub Menu

By. Jon Efendy Purba

Pada kesempatan kali ini saya akan memberikan trik dan panduan tentang Cara membuat menu dropdown / sub menu di blogspot.

Demo Menu Horizontal

Home

Cara Membuat Menu Dropdown / Sub Menu pada Blogspot

Login pada Blogger
Masuk mode Rancangan kemudian Edit HTML
Beri centang pada Expand Template Widget
Cari kode <div class='main-outer'> atau <div id='main-wrapper'> atau <div id='main'>
Jika sudah ketemu, letakan kode berikut diatas kode tadi

<style>

/* -- Menu Horizontal + Sub Menu-- */

#cat-nav {background:#156994;margin:0 15px;padding:0;height:35px;}

#cat-nav a { color:#eee; text-decoration:none; text-shadow: #033148 0px 1px 0px;border-right:1px solid #156994;}

#cat-nav a:hover { color:#fff; }

#cat-nav li:hover { background:#000; }

#cat-nav a span { font-family:Verdana, Geneva, sans-serif; font-size:11px; font-style:normal; font-weight:400; color:#fff; text-shadow:none;}

#cat-nav .nav-description { display:block; }

#cat-nav a:hover span { color:#fff; }

#secnav, #secnav ul { position:relative; z-index:100; margin:0; padding:0; list-style:none; line-height:1; background:#0d5e88; }

#secnav a { font-family:Georgia, "Times New Roman", Times, serif; font-style:italic; font-weight:700; font-size:14px; display:block; z-index:100; padding:0 15px; line-height:35px; text-decoration:none;}

#secnav li { float:left; width: auto; height:35px;}

#secnav li ul  { position: absolute; left: -999em; width: 200px; top:35px}

#secnav li ul li  { height:30px; border-top:1px solid #fff; }

#secnav li ul li a  { font-family:Verdana, Geneva, sans-serif; width:180px; line-height:30px; padding:0 10px; font-size:11px; font-style:normal; font-weight:400; color:#eee; }

#secnav li ul ul  { margin: -30px 0 0 180px; }

#secnav li:hover ul ul, #secnav li:hover ul ul ul, #secnav li.sfhover ul ul, #secnav li.sfhover ul ul ul { left:-999em; }

#secnav li:hover ul, #secnav li li:hover ul, #secnav li li li:hover ul, #secnav li.sfhover ul, #secnav li li.sfhover ul, #secnav li li li.sfhover ul { left: auto; }

#secnav li:hover,#secnav li.hover  { position:static; }

#cat-nav #secnav {width:100%;margin:0 auto;}

</style>

<div id='cat-nav'>

<ul class='fl' id='secnav'>

<li><a href='#'>Home</a></li>

<li><a href='#'>Menu 1</a></li>

<li><a href='#'>Menu + Sub Menu</a>

<ul id='sub-custom-nav'>

<li><a href='#'>Sub Menu 1</a></li>

<li><a href='#'>Sub Menu 2</a></li>

<li><a href='#'>Sub Menu 3</a></li>

</ul>

</li>

<li><a href='#'>Menu</a></li>

<li><a href='#'>Menu + Sub</a>

<ul id='sub-custom-nav'>

<li><a href='#'>Sub 1</a></li>

<li><a href='#'>Sub 2</a></li>

<li><a href='#'>Sub 3</a></li>

<li><a href='#'>Sub 4</a></li>

<li><a href='#'>Sub 5</a></li>

<li><a href='#'>Sub 6</a></li>

</ul>
</li>

<li><a href='#'>Menu</a></li>

<li><a href='http://blogtutorials-01.blogspot.com'><b><blink>Blogger Tutorial</blink></b></a></li>
</ul>

</div>

Catatan:

Silakan ganti tanda PAGAR (#) dengan link/url yang kamu mau, boleh link posting atau link Label (Kategori)
Sub Menu dan Sub adalah sub menu dari menu (Menu + Sub Menu dan Menu + Sub), silakan ganti nama masing-masing menu sesuai selera.

Hal-hal yang mungkin akan ditanyakan :

1. Kode yang harus dicari tidak ada di blog saya

Solusinya, silakan pasang kode menu horizontak tersebut di tempat yang kira-kira pas dengan yang kamu mau, kemudian klik Preview (Pratinjau). Jika masih belum pas silakan pindahkan kode tersebut kemudian Pratinjau lagi. Lakukan sampai menunya sudah berada ditempat yang kamu mau.

2. Bagaimana cara memasukkan beberapa artikel dalam 1 menu?

Agar bisa menampilakan beberapa artikel dalam 1 menu maka kamu harus pasang Link Label pada menu tersebut, caranya sama, yaitu dengan cara mengganti tanda pagar (#) dengan link label yang ada di blog teman.

Demikian Blogger Tutorial tentang Cara Membuat Menu Dropdown / Sub Menu.

Semoga bermanfaat dan semoga berhasil
Terima Kasih ^_^

Cara Membuat Menu Tab Sesuai Label dan Pengaturan Jumlah Postinganya

Cara membuat Menu Tab Sesuai Label pada Blog ???
Pada awalnya saya pikir sulit juga belajar html,,
Ternyata tak sesulit yang saya pikirkan lho,,
kali ini saya mau ngeShare cara buat menu tab sesuai label pada Tab Blogger,,
Yuk mari menuju TKP ...

Caranya cukup mudah :

Pertama buka design tata letak dan klik tambah widget dibawah widget Header berupa HTML/JavaScript (perlu diingat sebelum melakukan langkah ini postingan sobat sudah berlabel) untuk membuatnya silakan baca/pelajariCara membuat Label diblog kita.
Lalu masukkan script berikut :

<div style="text-align: center;">

<div id="navigation">
<ul>
<li class="selected">
<a href="http://awanputih43.blogspot.com/">Home</a></li>
<li><a href="http://awanputih43.blogspot.com/search/label/Info Siswa" >Info Siswa</a></li>
<li><a href="http://awanputih43.blogspot.com/search/label/Pendidikan" >Pendidikan</a></li>
<li><a href="http://awanputih43.blogspot.com/search/label/Sejarah" >Sejarah</a></li>
<li><a href="http://awanputih43.blogspot.com/search/label/Tutorial Blog" >Tutorial Blog</a></li>
<li><a href="http://awanputih43.blogspot.com/search/label/Peristiwa" >Peristiwa</a></li>
</ul>
</div>
</div>

Keterangan :

1. Tulisan warna biru anda ganti dengan URL anda
2. Tulisan warna merah anda ganti dengan nama Label anda

Gimana ... mudah kan??

Cara Mengatur jumlah postingan pada label

Label digunakan untuk mengkategorikan atau mengelompokkan artikel yang akan diterbitkan, biasanya artikel dengan pokok bahasan yang sama akan dikategorikan dalam satu label. Selain untuk mengorganisasikan artikel, label juga menghasilkan link, yang biasanya akan tampil di bawah judul posting atau di bagian bawah artikel.

Link Label dapat ditampilkan dalam Widget, baik berupa Daftar Label maupun berupa Tags Cloud. Link Label juga dapat dijadikan dasar untuk membuat Menu Blog. Jika link label di klik oleh pengunjung, maka akan ditampilkan seluruh artikel dalam label yang sama. Secara default, halaman label akan menampilkan 25 postingan untuk setiap kategori atau label tertentu, jika artikel yang ditampilkan memuat tulisan yang panjang atau menggunakan banyak gambar tentunya waktu loading akan menjadi lebih lama.

Anda dapat mengatur jumlah postingan yang akan ditampilkan dalam satu halaman untuk setiap kategori atau label artikel, sesuaikan dengan pengaturan jumlah posting yang ditampikan pada homepage blog. Berikut ini adalah trik untuk mengatur jumlah artikel yang ditampilkan dalam satu halaman berdasarkan kategori atau label tertentu.

Langsung Saja Caranya ...

Dengan Menambahkan : ?max-results=5'>

1. Angka 5 pada kode di atas menunjukkan jumlah artikel dengan kategori tertentu yang akan ditampilkan dalam satu halaman, silahkan ganti dengan angka yang anda inginkan.

2. Jika anda menggunakan link label sebagai Menu Blog seperti di bawah ini

3. <a href='http://awanputih43.blogspot.com/search/label/Pendidikan'>Pendidikan</a>

4. Tambahkan kode sehingga menjadi seperti di bawah ini

5. <a href='http://awanputih43.blogspot.com/search/label/Pendidikan?max-results=5'>Pendidikan</a>

Atau dalam kasus label diatas tadi cara menambahkan ?max-results=5'> setelah nama label yang pertama contoh :

<div style="text-align: center;">
<div id="navigation">
<ul>
<li class="selected">
<a href="http://awanputih43.blogspot.com/">Home</a></li>
<li><a href="http://awanputih43.blogspot.com/search/label/Info Siswa?max-results=5" >Info Siswa</a></li>
<li><a href="http://awanputih43.blogspot.com/search/label/Pendidikan?max-results=5" >Pendidikan</a></li>
<li><a href="http://awanputih43.blogspot.com/search/label/Sejarah?max-results=5" >Sejarah</a></li>
<li><a href="http://awanputih43.blogspot.com/search/label/Tutorial Blog?max-results=5" >Tutorial Blog</a></li>
<li><a href="http://awanputih43.blogspot.com/search/label/Peristiwa?max-results=5" >Peristiwa</a></li>
</ul>
</div>
</div>

NB :

Khusus untuk pengaturan jumlah artikel yang akan ditampilkan pada Home atau Beranda melalui Edit Posting Blog pada Pengaturan Tata Letak lalu isi Jumlah Posting di halaman utama sesuai dengan keinginan seperti tampilan dibawah in

Cara Membuat Related post dengan Mengelompokkan Label/Kategory

Related post/artikel terkait merupakan salah satu yang terpenting untuk sebuah blog karena dengan adanya artikel terkait akan memudahkan pengunjung untuk mengetahui isi sebuah blog.

Membuat blog dengan artikel yang bagus,unik dan berkuwalitas dan didukung dengan adanya related post/artikel terkait akan mendorong seorang pengunjung untuk membuka artikel yang lain.
Keunggulan tutorial blog Cara Membuat Related post dari kang Roni ini yaitu bisa mengelompokkan artikel berdasarkan kategory/label,tapi jangan lupa pastikan artikel sobat sudah diberi label,untuk keterangan cara membuat label sobat buka aja link ini.
Kalau artikel sobat sudah berlabel langsung aja ikuti langkah-langkah Membuat Related post dengan Mengelompokkan Label/Kategory dibawah ini.

1.Login Blogger.com
2.Buka halaman Rancangan ---> Edit HTML
3.Download Template Lengkap untuk keamanan bila terjadi kesalahan dalam peletakan kode HTML.
4.Beri centang pada kotak Expand Template Widget untuk membuka seluruh kode template
5.Cari kode <data:post.body/>

Setelah ketemu taruh kode dibawah ini tepat dibawah kode tadi

<b:if cond='data:blog.pageType == "item"'>

<br/>

<H2>Related Post:</H2>

var homeUrl3 = "<data:blog.homepageUrl/>";

var maxNumberOfPostsPerLabel = 4;

var maxNumberOfLabels = 10;

maxNumberOfPostsPerLabel = 10;

maxNumberOfLabels = 3;

function listEntries10(json) {

var ul = document.createElement('ul');

var maxPosts = (json.feed.entry.length <= maxNumberOfPostsPerLabel) ?

json.feed.entry.length : maxNumberOfPostsPerLabel;

for (var i = 0; i < maxPosts; i++) {

var entry = json.feed.entry[i];

var alturl;

for (var k = 0; k < entry.link.length; k++) {

if (entry.link[k].rel == 'alternate') {

alturl = entry.link[k].href;

break;

}

var li = document.createElement('li');

var a = document.createElement('a');

a.href = alturl;

if(a.href!=location.href) {

var txt = document.createTextNode(entry.title.$t);

a.appendChild(txt);

li.appendChild(a);

ul.appendChild(li);

}

for (var l = 0; l < json.feed.link.length; l++) {

if (json.feed.link[l].rel == 'alternate') {

var raw = json.feed.link[l].href;

var label = raw.substr(homeUrl3.length+13);

var k;

for (k=0; k<20; k++) label = label.replace("%20", " ");

var txt = document.createTextNode(label);

var h = document.createElement('b');

h.appendChild(txt);

var div1 = document.createElement('div');

div1.appendChild(h);

div1.appendChild(ul);

document.getElementById('albri').appendChild(div1);

}

function search10(query, label) {

var script = document.createElement('script');

script.setAttribute('src', query + 'feeds/posts/default/-/'

+ label +

'?alt=json-in-script&callback=listEntries10');

script.setAttribute('type', 'text/javascript');

document.documentElement.firstChild.appendChild(script);

}

var labelArray = new Array();

var numLabel = 0;

<b:loop values='data:posts' var='post'>

<b:loop values='data:post.labels' var='label'>

textLabel = "<data:label.name/>";

var test = 0;

for (var i = 0; i < labelArray.length; i++)

if (labelArray[i] == textLabel) test = 1;

if (test == 0) {

labelArray.push(textLabel);

var maxLabels = (labelArray.length <= maxNumberOfLabels) ?

labelArray.length : maxNumberOfLabels;

if (numLabel < maxLabels) {

search10(homeUrl3, textLabel);

numLabel++;

}

</b:loop>

</script>

</div>

</div>

</b:if>

6.Save.

Hidupkan blog anda dengan mempraktekkan Cara Membuat Related post dengan Mengelompokkan Label/Kategory

Cara Membuat Menubar Multi Dropdown Di Blog

Cara Membuat Menubar Multi Dropdown Di Blog. Sobat blogger, kembali lagi untuk berbagi tutorial, kali ini saya akan membagikan sebuah tutorial bagaiman cara membuat menubar multi dropdown di blog,tutorial ini saya ambil dari blog mbak Arlina, :) dan terimakasih sebelumnya buat mbak arlina yang sudah berbagi, sobat blogger menubar ini selain tampilannya elegant juga di desain menjadi responsive oleh mbak arlina tentu dengan kelebihan multi dropdown menu atau multi sub menu.

DEMO

Menu multi dropdown seperti ini pasti sangat di butuhkan jika sebuah blog memang mempunyai banyak kategori yang terkait atau bisa juga untuk meringkas artikle yang terkait yang di masukan ke menubar tersebut. jika anda ingin menerapkan menubar ini di blog anda,silahkan ikuti tutorialnya.

Baca Juga : Cara Membuat Popular Post Simple Keren

Cara Membuat Menu Bar Multi Dropdown.
1. Buka akun blogger anda.
2. Pilih menu template > klik Edit Html
3. Lalu letakan kode css di bawah ini tepat di atas kode ]]></b:skin> atau </style>

 nav {
    display: block;
    margin-top: 100px;
    background: #374147;
}

.menu {
    display: block;
}

.menu li {
    display: inline-block;
    position: relative;
    z-index: 100;
}

.menu li:first-child {
    margin-left: 0;
}

.menu li a {
    font-weight: 600;
    text-decoration: none;
    padding: 20px 15px;
    display: block;
    color: #fff;
    transition: all 0.2s ease-in-out 0s;
}

.menu li a:hover,.menu li:hover>a {
    color: #fff;
    background: #9ca3da;
}

.menu ul {
    visibility: hidden;
    opacity: 0;
    margin: 0;
    padding: 0;
    width: 150px;
    position: absolute;
    left: 0px;
    background: #fff;
    z-index: 99;
    transform: translate(0,20px);
    transition: all 0.2s ease-out;
}

.menu ul:after {
    bottom: 100%;
    left: 20%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-color: rgba(255, 255, 255, 0);
    border-bottom-color: #fff;
    border-width: 6px;
    margin-left: -6px;
}

.menu ul li {
    display: block;
    float: none;
    background: none;
    margin: 0;
    padding: 0;
}

.menu ul li a {
    font-size: 12px;
    font-weight: normal;
    display: block;
    color: #797979;
    background: #fff;
}

.menu ul li a:hover,.menu ul li:hover>a {
    background: #9ca3da;
    color: #fff;
}

.menu li:hover>ul {
    visibility: visible;
    opacity: 1;
    transform: translate(0,0);
}

.menu ul ul {
    left: 149px;
    top: 0px;
    visibility: hidden;
    opacity: 0;
    transform: translate(20px,20px);
    transition: all 0.2s ease-out;
}

.menu ul ul:after {
    left: -6px;
    top: 10%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-color: rgba(255, 255, 255, 0);
    border-right-color: #fff;
    border-width: 6px;
    margin-top: -6px;
}

.menu li>ul ul:hover {
    visibility: visible;
    opacity: 1;
    transform: translate(0,0);
}

.responsive-menu {
    display: none;
    width: 100%;
    padding: 20px 15px;
    background: #374147;
    color: #fff;
    text-transform: uppercase;
    font-weight: 600;
}

.responsive-menu:hover {
    background: #374147;
    color: #fff;
    text-decoration: none;
}

a.homer {
    background: #9ca3da;
}

@media (min-width: 768px) and (max-width: 979px) {
    .mainWrap {
        width: 768px;
    }

    .menu ul {
        top: 37px;
    }

    .menu li a {
        font-size: 12px;
    }

    a.homer {
        background: #374147;
    }
}

@media (max-width: 767px) {
    .mainWrap {
        width: auto;
        padding: 50px 20px;
    }

    .menu {
        display: none;
    }

    .responsive-menu {
        display: block;
        margin-top: 100px;
    }

    nav {
        margin: 0;
        background: none;
    }

    .menu li {
        display: block;
        margin: 0;
    }

    .menu li a {
        background: #fff;
        color: #797979;
    }

    .menu li a:hover,.menu li:hover>a {
        background: #9ca3da;
        color: #fff;
    }

    .menu ul {
        visibility: hidden;
        opacity: 0;
        top: 0;
        left: 0;
        width: 100%;
        transform: initial;
    }

    .menu li:hover>ul {
        visibility: visible;
        opacity: 1;
        position: relative;
        transform: initial;
    }

    .menu ul ul {
        left: 0;
        transform: initial;
    }

    .menu li>ul ul:hover {
        transform: initial;
    }
}

@media (max-width: 480px) {
}

@media (max-width: 320px) {
}

5. Selanjutnya letakan kode html di bawah ini tepat di bawah kode </header>

 <nav>
<a id="resp-menu" class="responsive-menu" href="#"><i class="fa fa-reorder"></i> Menu</a>    
   <ul class="menu">
   <li><a class="homer" href="#"><i class="fa fa-home"></i> HOME</a>
   <ul class="sub-menu">
   <li><a href="#">Sub-Menu 1</a></li>
   <li><a href="#">Sub-Menu 2</a></li>
   <li><a href="#">Sub-Menu 3</a></li>
   <li><a href="#">Sub-Menu 4</a></li>
   <li><a href="#">Sub-Menu 5</a></li>   
   </ul>
   </li>
  <li><a  href="#"><i class="fa fa-user"></i> ABOUT</a></li>
  <li><a  href="#"><i class="fa fa-camera"></i> PORTFOLIO</a>
  <ul class="sub-menu">
   <li><a href="#">Sub-Menu 1</a></li>
   <li><a href="#">Sub-Menu 2</a>
    <ul>
    <li><a href="#">Sub Sub-Menu 1</a></li>
    <li><a href="#">Sub Sub-Menu 2</a></li>
 <li><a href="#">Sub Sub-Menu 3</a></li>
    <li><a href="#">Sub Sub-Menu 4</a></li>
 <li><a href="#">Sub Sub-Menu 5</a></li> 
    </ul>
   </li>
     <li><a href="#">Sub-Menu 3</a>
    <ul>
    <li><a href="#">Sub Sub-Menu 1</a></li>
    <li><a href="#">Sub Sub-Menu 2</a></li>
 <li><a href="#">Sub Sub-Menu 3</a></li>
    <li><a href="#">Sub Sub-Menu 4</a></li>
 <li><a href="#">Sub Sub-Menu 5</a></li> 
    </ul>
   </li>
   </ul>
  </li>
  <li><a  href="#"><i class="fa fa-bullhorn"></i> BLOG</a></li>
    <li><a  href="#"><i class="fa fa-tags"></i> CATEGORIES</a>
  <ul class="sub-menu">
   <li><a href="#">Sub-Menu 1</a></li>
   <li><a href="#">Sub-Menu 2</a>
    <ul>
    <li><a href="#">Sub Sub-Menu 1</a></li>
    <li><a href="#">Sub Sub-Menu 2</a></li>
 <li><a href="#">Sub Sub-Menu 3</a></li>
    <li><a href="#">Sub Sub-Menu 4</a></li>
 <li><a href="#">Sub Sub-Menu 5</a></li> 
    </ul>
   </li>
     <li><a href="#">Sub-Menu 3</a>
    <ul>
    <li><a href="#">Sub Sub-Menu 1</a></li>
    <li><a href="#">Sub Sub-Menu 2</a></li>
 <li><a href="#">Sub Sub-Menu 3</a></li>
    <li><a href="#">Sub Sub-Menu 4</a></li>
 <li><a href="#">Sub Sub-Menu 5</a></li> 
    </ul>
   </li>
   </ul>
  </li>
  <li><a  href="#"><i class="fa fa-envelope"></i> CONTACT</a></li>
  <li><a  href="#"><i class="fa fa-sitemap"></i> SITEMAP</a></li>
  <li><a  href="#"><i class="fa fa-exclamation-triangle"></i> DISCLAIMER</a></li>
  </ul>
  </nav>

5. Langkah terakhir simpan kode di bawah ini tepat di atas kode </body>

<script type='text/javascript'>
//<![CDATA[
$(document).ready(function(){ 
 var touch  = $('#resp-menu');
 var menu  = $('.menu');
 
 $(touch).on('click', function(e) {
  e.preventDefault();
  menu.slideToggle();
 });
 
 $(window).resize(function(){
  var w = $(window).width();
  if(w > 767 && menu.is(':hidden')) {
   menu.removeAttr('style');
  }
 });
 
});
//]]>
</script>

6. Jika sudah, silahkan klik pertinjau terlebih dahulu,kalo sudah ok, save template anda.

Oke sobat saya rasa sudah selesai di tutorial cara membuat menubar multi dropdown di blog,untuk lebih dan kurangnya saya mohon maaf,semoga sukses. :)

NAJWA COM