Solusi Drop Down Menu 3 Level pada Lokomedia 1.5


Apycom.com adalah jquery menu yang dipakai pada drop down menu di lokomedia 1.5 . Sayangnya pada template bawaan, dropdown menu lokomedia hanya mengakomodasi sampai menu level 2 saja. Bagaimana jika kita ingin mebuat menu sampai beberapa level? Sebenarnya apycom.com bisa melakukannya. Kita bisa melihat struktur html apycom.com bahkan tersusun atas menu 4-5 level. Sekarang tinggal bagaimana kita bisa menjadikan kode html tersebut kedalam script php dinamis berbasis database. Saya akan coba memberi solusinya, namun tutorial ini hanya sebatas level 3 saja. Yaitu main menu, child menu, dan grandchild menu.

Langkah 1 :

Buat tabel untuk menyimpan database menu di MYSQL

CREATE TABLE `menu` (
`id` tinyint(3) unsigned NOT NULL auto_increment,
`parent_id` tinyint(3) unsigned NOT NULL default ’0′,
`title` varchar(100) collate latin1_general_ci NOT NULL,
`url` varchar(100) collate latin1_general_ci NOT NULL default ”,
PRIMARY KEY  (`id`)
)

Langkah 2 :

Masukkan source code berikut ke dalam template lokomedia mereplace source code menu sebelumnya

<?php
$main=mysql_query("SELECT * FROM menu WHERE parent_id='0'");
    while($r=mysql_fetch_array($main)){
        echo"<li><a href='$r[url]'><span>$r[title]</span></a>";
            $sub=mysql_query("SELECT * FROM menu WHERE parent_id=$r[id]");
            $jml=mysql_num_rows($sub);
// apabila sub menu ditemukan
                if ($jml > 0){
                echo "<div><ul>";
                while($w=mysql_fetch_array($sub)){
                    echo "<li><a href='$w[url]'><span>$w[title]</span></a>";
                    $sub2=mysql_query("SELECT * FROM menu WHERE parent_id=$w[id]");
                    $jml2=mysql_num_rows($sub2);
?>


?>

<ul>
<?php
$main=mysql_query(“SELECT * FROM menu WHERE parent_id=0”);

while($r=mysql_fetch_array($main)){
echo “<li><a href=’$r[url]’><span>$r[title]</span></a>”;
$sub=mysql_query(“SELECT * FROM menu WHERE parent_id=$r[id]”);
$jml=mysql_num_rows($sub);
// apabila sub menu ditemukan
if ($jml > 0){
echo “<div><ul>”;
while($w=mysql_fetch_array($sub)){
echo “<li><a href=’$w[url]’><span>» $w[title]</span></a>”;
$sub2=mysql_query(“SELECT * FROM menu WHERE parent_id=$w[id]”);
$jml2=mysql_num_rows($sub2);
// apabila submenu 2 ditemukan
if ($jml > 0){
echo “<div><ul>”;
while($x=mysql_fetch_array($sub2)){
echo “<li><a href=’$x[url]’><span>» $x[title]</span></a></li>”;
}
echo “</ul></div>
</li>”;
}
else {
echo”</li>”;
}
}
echo “</ul></div>
</li>”;
}
else{
echo “</li>”;
}
}
?>
</ul>

Untuk modul manajemen menu pada administrator bisa di download disini. Jangan lupa untuk menambahkan kode di content.php pada folder admin web untuk menampilkan modul menu. Sekarang silakan dicoba menu drop downnya. Semoga bisa jadi solusi.

Advertisements

11 thoughts on “Solusi Drop Down Menu 3 Level pada Lokomedia 1.5

  1. Mohon dibantu *_* punya saya ERROR pada baris terahir topmenu.php seletah saya masukan script diatas

    <?php
    $main=mysql_query("SELECT * FROM menu WHERE parent_id='0'");
    while($r=mysql_fetch_array($main)){
    echo"$r[title]“;
    $sub=mysql_query(“SELECT * FROM menu WHERE parent_id=$r[id]”);
    $jml=mysql_num_rows($sub);
    // apabila sub menu ditemukan
    if ($jml > 0){
    echo “”;
    while($w=mysql_fetch_array($sub)){
    echo “$w[title]“;
    $sub2=mysql_query(“SELECT * FROM menu WHERE parent_id=$w[id]”);
    $jml2=mysql_num_rows($sub2);
    ?>

    PESAN ERROR

    Parse error : syntax error, unixpected:$en in….

    mohon dibantu

      1. kode yang anda masukkan kurang, bukan yang dalam kotak hitam tapi yang bawahnya. Kalau yang kotak hitam itu masih kurang… coba lanjutkan kode tesebut hingga seperti pada kotak yang bawah

  2. @mega : kodenya kurang… bukan yang didalam kotak hitam, dalam kotak hitam belum selesai
    @alo : buat databasenya dengan kode SQL diatas. Silakan masuk ke phpmyadmin dan copy code ke dalam SQL lalu GO

  3. tutornya kurang jelas..dah di coba2 tetep gak bisa juga bos,,emang gw kali yg bolo’on..sya coba dgn template jquery lokomedia ttp juga gak bisa….mumet sya gan..bisa di jelaskan step by step lgi gan..maklum newbie banget ni gan,,

      1. udah di liat,,tpi dicoba lgi ttep gak bisa gan..coba step-stepnya di perjelas lgi,,mungkin sya yg kurang jeli atawa gimana ?

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.