0 Membuat submenu vertical dengan css di auraCMS

Di dalam sebuah website, seringkali kita menemukan penggunaan menu bertingkat seperti pada gambar di atas. Menu yang bertingkat tersebut sebenarnya adalah sebuah struktur pohon/tree di mana suatu menu bisa memiliki anak (submenu), dan submenu tersebut juga bisa memiliki anak

lagi dan seterusnya sampai level tak terbatas.

Berikut ini adalah contoh struktur html menu yang terdiri dari 3 level (menggunakan tag html <ul> dan <li> )

Pertama buat database nya :

CREATE TABLE IF NOT EXISTS `menulevel` (
`id` tinyint(3) unsigned NOT NULL auto_increment,
`parent_id` tinyint(3) unsigned NOT NULL default '0',
`title` varchar(100) NOT NULL default '',
`url` varchar(100) NOT NULL default '',
`menu_order` tinyint(3) unsigned NOT NULL default '0',
PRIMARY KEY  (`id`)
) ENGINE=MyISAM;

";
$i++;
foreach ($data[$parent] as $v) {
$child = get_menu($data, $v->id);
$html .= "\n\t$tab
";
$html .= ''.$v->title.'';
if ($child) {
 $i--;
 $html .= $child;
 $html .= "\n\t$tab";
}
$html .= '
';
}
$html .= "\n$tab";
return $html;
} else {
return false;
}
}

mysql_connect('localhost', 'root', '');
mysql_select_db('tes');

$result = mysql_query("SELECT * FROM menu ORDER BY menu_order");
while ($row = mysql_fetch_object($result)) {
$data[$row->parent_id][] = $row;
}

$menu = get_menu($data);
?>

Kemudian dengan modifikasi beberapa scripts hasil

Tampilan index

Tampilan untuk menambah data.

Selamat Mencoba ;))

By : Kera Ngalam

BACA ARTIKEL LAINYA