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>
):
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 | <ul> <li><a href="menu1.html">Menu 1</a></li> <li><a href="menu2.html">Menu 2</a></li> <li><a href="menu3.html">Menu 3</a> <ul> <li><a href="menu31.html">Sub Menu 3.1</a></li> <li><a href="menu32.html">Sub Menu 3.2</a> <ul> <li><a href="menu321.html">Sub Menu 3.2.1</a></li> <li><a href="menu322.html">Sub Menu 3.2.2</a></li> <li><a href="menu323.html">Sub Menu 3.2.3</a></li> </ul> </li> <li><a href="menu33.html">Sub Menu 3.3</a></li> </ul> </li> <li><a href="menu4.html">Menu 4</a></li> </ul> |
Kode html tersebut akan menghasilkan tampilan seperti ini:
Dengan menggunakan jquery dan plugin jquerycssmenu, menu tersebut bisa kita ubah menjadi sebuah menu dropdown yang lebih menghemat tempat. Tinggal tambahkan script berikut ini di dalam head:
1 2 3 4 | <link rel="stylesheet" type="text/css" href="jquerycssmenu.css" /> <script type="text/javascript" src="jquery-1.3.2.min.js"></script> <script type="text/javascript" src="jquerycssmenu.js"></script> |
Membuat menu dinamis dari database
Untuk membuat menu secara dinamis, kita bisa menggunakan database untuk menyimpan data menunya. Di bawah ini adalah struktur tabel untuk menyimpan menu:
1 2 3 4 5 6 7 8 | CREATE TABLE `menu` ( `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; |
Kemudian gunakan script php ini untuk membuat list secara dinamis dari database tersebut. Script ini menggunakan sebuah fungsi rekursif untuk mengambil menu sampai ke level tak terbatas.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 | <?php function get_menu($data, $parent = 0) { static $i = 1; $tab = str_repeat("\t\t", $i); if (isset($data[$parent])) { $html = "\n$tab<ul>"; $i++; foreach ($data[$parent] as $v) { $child = get_menu($data, $v->id); $html .= "\n\t$tab<li>"; $html .= '<a href="'.$v->url.'">'.$v->title.'</a>'; if ($child) { $i--; $html .= $child; $html .= "\n\t$tab"; } $html .= '</li>'; } $html .= "\n$tab</ul>"; 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); ?> |
Download script ini:
jQuery Multi Level Horizontal Menu (17779 downloads)
bener bener ajiiiiib … sedot disin ah
pengin nyobo.. nek nggo wordpress bs jg ga ya?
mbok blog ini, nyoba.. ntar tak liat e
jadi jelas ssh nya mo ngapain.. -_-‘
-w-
pake wordpress atau yg lain bisa, yg penting struktur html menunya sama (<ul> dan <li> nya)
tak coba ah mas
coba ah
ya coba aja
Wah terima kasih banget nih Mas Bowo, kebetulan saya lagi nyari2 menu seperti ini. Pernah buat tapi ga jalan di IE 6.
wah ini dia yg gw cari2.., selama ini gw baru bisa bikin 2 level menu aja, yang ini unlimited to ga? btw makasih gan atas share nya. keep up da good work
iya ini unlimited
terimakasih bnyak atas artikelnya mas,,,
oya saya mau tanya,bisa jelasin tentang id_parent yang ada di database itu ,terus penomeranya itu gman….??
menu level pertama memiliki parent_id = 0
menu level 2 memiliki parent_id = id menu di atasnya
dst…
contohnya:
menu Products (id = 11, parent_id = 0)
memiliki submenu:
– Hardware
– Software
masing2 memiliki parent_id = 11
11 = id dari menu Products
Thx.
Tapi di IE 6 tampilannya agak rusak:
1. border bawah di menu level 2 kadang muncul kadang hilang
2. saat kursor ditunjuk ke menu level 2 yang mempunyai level 3 tinggi kotaknya bertambah shg tampilan jadi rusak.
terimakasih infonya.. ternyata kemarin saya lupa mencoba di browser tsb hehe
yg nomer 1 saya blm nemu masalahnya..mungkin anda bisa membantu?
yg nomer 2 sudah saya perbaiki di file css nya saya tambahkan ini:
Wow! menu ala facebook
langsung sedot..
terimakasih bos, tutorialnya.
Kerennn abizzzzzzzzzzzz …….. Keep RocKin Mas Bowo … hehehe
muantabbbb… sedoot… thanks tutorialnya buagus
mas thanx sebelumnya atas postingan ini..
sangat bermanfaat bgt..
tapi waktu saya coba, kok ada strip atasnya ya (warna putih….)
jadi menu-nya g bisa mepet ama header website…
tolong bantuin saya dong mas…
apa yang harus di modif di css nya biar bisa mepet ke header…
udah saya coba tapi kok belum berhasil
thanx ya mas
bisa kirim filenya mas? atau kl ada demo yg online lebih bagus lagi, tinggal kirim url nya
tengkyu…..
sedot ahhhh,,,,
mau coba…
asekk… akhirnya nemu menu dropdown multi level,
thanks mas
waaah keren mzzz tutor menu nyaaaaa….
oh iya variable untuk meletakkan atas bawah menu nya dmana yaa tak cari2 varibale “top” nya di css k tidak ada yaa mz?
maklum mzh newbie
Untuk mengatur letak/urutan menunya bukan lewat css mas, tetapi di database nya. Di tabel tsb ada field menu_order yang digunakan untuk urutan menu.
Mas aku newbie niy masalah kaya gini, aku mau tanya kalo script yang mas kasih bisa ga di buat onmouseover jadi tampilannya kalo kita geser ke menu ini maka sub menu akan kelihatan…
Aku tunggu balasannya ya mas…
Bisa saja ditambahi onmouseover, tapi menu tsb sudah bisa menampilkan submenunya saat mouse kita arahkan ke atas menu nya. Tidak perlu ditambahi onmouseover lagi.
wah.. keren-keren mas ari…
btw mas,,. saya ada pertanyaan ni di php
gimana membuat user login di php dan dia hanya boleh akses table user misalnya, dan user kedua bisa hanya bisa membuka table user dan data,
gimana mas buatnya di php?
Thanks
Intinya ya pakai variable
$_SESSION
untuk menyimpan data login, tapi maaf sepertinya terlalu kompleks scriptnya untuk ditampilkan di sini.hehehhe, boleh kirim ke email donk mas,
ma acih
duh menunya kalo pakai
//yang ini untuk menunya
//yang ini select table database untuk content
rupanya menunya conflic ama kiri.php jadi kalo child menunya kena tulisan file kiri.php yang contentnya dari database juga,menunya langsung ketutup jadi nggak bisa di klik..tapi kalo file kiri.php di gabungkan di div menu menunya jadi normal…
oh maaf kalau yang ini dulu rupanya hanya masalah z-index..maklum mas dulu belum terlalu sering utak atik website..oh ya mas sekarang saya ada pertanyaan kalau menghapus sub menu sub menu unlimitednya mas..^,^..sebab saat ini baru berhasil menghapus 1 level sub menu aja..maksudnya kalau di tabel masih ada menu yang parent_id nya sama dengan id_menu ..lalu hapus menu tersebut..nah karena menu nya unlimited pusing juga..oh ya mas kalau mas pernah membuat scriptnya please share mas ya langsung update di blog ini aja..^,^; makasih mas sebelumnya..wassalammu’alaikum wr wb..;
oh ya sorry mas..jangan pusing pusing santai aja ..allhamdulillah untuk sementara saya buat delete sub menu 3 level saja ini scriptnya
include_once "config/utk_database.php"; include_once "config/antiinjection.php";
$idnya = antiinjection($_POST['idnya']);
$website= antiinjection($_SESSION[folder_website]);
if (is_numeric($idnya) && $idnya != ''){
mysql_query("DELETE FROM menu_charisma where website='$website' AND id='$idnya'");
$checkSub = "SELECT * FROM menu_charisma where parent_id = '$idnya' AND website='$website'";
$check = mysql_query($checkSub) or die('error');
if(mysql_num_rows($check) > 0){
$r=mysql_fetch_array($check);
$id2=$r['id'];
mysql_query("DELETE FROM menu_charisma where website='$website' AND parent_id = '$id2' ");
mysql_query("DELETE FROM menu_charisma where website='$$website' AND parent_id = '$idnya' ");
$checkSub2 = "SELECT * FROM menu_charisma where parent_id = '$id2' AND website='$website'";
$check2 = mysql_query($checkSub2) or die('error');
if(mysql_num_rows($check2) > 0){
$r2=mysql_fetch_array($check2);
$id3=$r['id'];
mysql_query("DELETE FROM menu_charisma where website='$website' AND parent_id = '$id3' ");
}
}
} hmm sudah jam 10:51, saya mau melanjutkan ke fitur yang lain lagi..makasih ya mas ..wassalammu’alaikum wr wb..;
sorry mas..ini script yang sudah benar benar saya test..allhamdulillah berhasil sukses tanpa pusing pusing
include_once "config/utk_database.php"; include_once "config/antiinjection.php";
$idnya = antiinjection($_POST['idnya']);
$website= antiinjection($_SESSION[folder_website]);
if (is_numeric($idnya) && $idnya != ''){
mysql_query("DELETE FROM menu_charisma where website='$website' AND id='$idnya'")or die('Sorry Something Was Wrong, Menu Can Not We Delete.');
$checkSub = "SELECT * FROM menu_charisma where parent_id = '$idnya' AND website='$website'";
$check = mysql_query($checkSub) or die('Sorry Sub Menu Level 1 Can Not We Detect');
if(mysql_num_rows($check) > 0){
$r=mysql_fetch_array($check);
$id2=$r['id'];
$checkSub2 = "SELECT * FROM menu_charisma where parent_id = '$id2' AND website='$website'";
$check2 = mysql_query($checkSub2) or die('Sorry Sub Menu Level 3 Can Not We Detect');
if(mysql_num_rows($check2) > 0){
$r2=mysql_fetch_array($check2);
$id3=$r2['id'];
mysql_query("DELETE FROM menu_charisma where website='$website' AND parent_id = '$id3' ");
}
mysql_query("DELETE FROM menu_charisma where website='$website' AND parent_id = '$id2' ");
mysql_query("DELETE FROM menu_charisma where website='$website' AND parent_id = '$idnya' ");
}
echo"success";
}
wassalammu’alaikum wr wb..selamat berkarya terus mas..sukses selalu ..amin..;
wah mas makasih banyak dng tutornya… bener2 bagus & membantu sekali….
bener2 muaaantep bos… gw simpen ilmunya ya, thanks
terima kaih mas atas ilmunya, tapi bagaimana ya caranya agar menunya muncul ditengah-tengah bukan dikiri, saya coba pakai tabel mau tapi fontnya tambah besar n menunya gak mau ditengah2 table?
mohon bimbingannya
trim’s
Kok Jadi error line 30
kekurangannya apa mas ???
Fatal error: Call to undefined function mysql_tchfe_object() in C:\xampp\htdocs\ajax\index.php on line 30
kok mysql_tchfe_object() ? salah ketik nama fungsinya mungkin mas.. yg bener mysql_fetch_object()
mysql_tchfe_object() <—
mysql_fetch_object()
saa
mas, ada treeview?
load datanya dari mysql
thanks
bos tolong donk di kasih script “nsert into table nya ” ,..thanks
mas kalo menu vertical piye carannya
thanks ilmunya
maaf kl yg menu vertikal saya belum punya contohnya
Wahh… keren bgt mas tutorialnya. Sangat membantu.. thanks ya.
post super
setuju
mas , klo di setiap sub menu,saya kasih link, dimana di ubahnya
maaf saya masih pemula
link nya disimpan di database tabel `menu` di field `url`
udah di update menu untuk IE6 nya blm?
jadi biar download ga usah edit lagi hehe..
btw thx udah share
sudah mas..
file css nya sudah diupdate tambahan utk IE6
matur thank you pak lek…..
tengkyu bgt mas ari..
sangat membantu nih..
Wow … mantaaabb bgt Om
makasih y …..
Bagai mana jika saya hanya ingin menapilkan salah satu menu saja? misal menu dari “produk”
saya telah mencoba
$result = mysql_query(“SELECT * FROM menu where parent_id=xxx”);
xxx=parent_id dari “produk”
mau tanya kalau buat linknya gimana ya??
mas sedot yah …. uh mantap
mantap Mas suwun
emang pas lagi nyari php menu cek gak report
suwun
Pak gimana cara buat, kode php pada posting seperti punya anda ada list angka dan kalo bisa yang bisa di print, maklum masih awam
..mantabbbbbbb……
wah hatur nuhun mas……….
saya jd bisa bikin get menu…..
Keren banget, disampaikan dengan bahasa yang
mudah di mengerti, sangat membantu buat saya yang sedang belajar, makasih banyak…
hello…thanks ya
cuman mau tanya nih…untuk masing masing links nya dimana ya? bisa dicontoin ngak?
mas mau tanya ni
while ($row = mysql_fetch_object($result)) {
$data[$row->parent_id][] = $row;
}
klo pake koneksi oci tu gmn ya??
krn sy pake db oracle 8.1.7
$query(“SELECT * FROM menu ORDER BY menu_order”);
$statement = oci_parse ($connection, $query);
oci_execute ($statement);
//echo $query;
while ($row = oci_fetch_object($statement)) {
$data[$row->parent_id][] = $row;
}
pas di run kok kosong ya???
bantuanx pliss…..
wah maaf mas, saya belum pernah pake oracle.. mungkin teman2 yg lain ada yg bisa membantu
thx mas
mungkin temen2 ada yang bisa ga????
mungkin bisa membantu mas: coba menggunakan library abstraksi database, supaya scriptnya sama untuk semua jenis database
kalo saya biasanya menggunakan adodb:
Ijin sedot Mas.
BTW ada referensi belajar buat template dengan css gak Mas??
Oya template menu horizontalnya keren Mas, bisa gak ditambahin file lain seperti, file header, rightcontent, leftcontent, footer, dll
Tolong dibantuin mas(kirim via email ya :D, saya lagi belajar buat template dgn css.
Thanks you
mas ada yg menu vertikalnya ga???
maaf saya blm punya contohnya mas
agak rumit nih. apa ada yang lebih sederhana untuk wordpress ?
sebenarnya ini bukan khusus utk wordpress, tapi teknik utk website secara umum
infonya bagus, tapi mau tanya apa untuk blogspot bisa bos
dicoba dulu gan script nya
trims
wahhh…
yang di cari² ternyata ada disini.
Mantab bos..
Likes this!!!
mantap, source code dan penjelasannya,.. thanks yah..
keren nih.. bs dipake juga buat yang model tree view..
sangat berguna
mas,,,maw tanya nih…
gmn caranya buat pemberitahuan???
pada PHP..
makasih.
pemberitahuan apa ya mas? maaf pertanyaannya kurang spesifik
trims
Thanks mas Bowo…
Saya udah coba menunya….
Tap kenana muncul
Notice: Undefined index: 1 in C:\\wamp\\www\\jquery\\menu\\index.php on line 5
Notice: Undefined index: 2 in C:\\wamp\\www\\jquery\\menu\\index.php on line 5
dst……….s/d index:23
Makasih atas jawabannya….
Scriptnya sudah saya perbaiki supaya tidak muncul notice.
Silakan didownload lagi.
makasi ya kak, saya benar2 terbantu dengan artikel kakak ini…
nantinya akan saya gunakan untuk bisnis saya di http://habibnurrahman.com/tugupaypal/
ini yang saya cari untuk menu atas, bisa dinamis juga
saya mau tanya nie bozz,
gini, saya mau pasang FadeSlideShow
contohnya ada di http://www.dynamicdrive.com/dynamicindex14/fadeinslideshow.htm
itukan ada 3 file bozz.
fadeslideshow.js
index.html
dan
jquery.min.js
saya ada probelm di file “jquery.min.js”
kalo online bisa. tp kalo off line kok gak bisa??
padahal saya sudah copy source codenya.
dan sya simpan difolder yang sama.
saat offline saya pake web server Xampp
mohon bantuannya ya bozz
maa panjang…
Mau tanya asp.net di buka di windows bisa gak sih.. kapan hari q ada script tapi tak buka pake xampp gak bisa..
mohon pencerahannya..
mohon ijin download ya… trima kasih..
ijin sedot mas gan ..nyoba dulu
Mas bowo, saya telah mencoba tapi tidak berhasil. Mohon bantuannya, apa yang salah ya mas. Terima kasih
<li><a href=\’http://tulis_alamat_url_tujuan\’>Akuntansi</a>
<ul>
<li><a href=\’http://tulis_alamat_url_tujuan\’>Akuntansi Dasar</a>
<ul>
<li><a href=\"menu321.html\">Sub Menu 3.2.1</a></li>
<li><a href=\"menu322.html\">Sub Menu 3.2.2</a></li>
<li><a href=\"menu323.html\">Sub Menu 3.2.3</a></li>
</ul>
</li>
slam kenal,,,,mas mau tnya,,,klo bikin sub menu dropdown pada sebuah blog bisa ga yh,,,,gmna cara masukin si javanya,,,,
hm,,,,,dan untuk membuat guestbook menggunakan php,,,untuk menyimpan database sqlnya itu dimna ?
hehe,,,trima kasih mas,,,,
Terima kasih scriptnya…
Tapi kalau ingin mengubah menjadi vertikal menu bagaimana caranya?
Trims.
utnuk yang vertical ad g y?coba ubah ke vertical malah ancur terus tampilanny..terima kasih
Keren, nich source yang diterapkan pada CMS Lokomedia,
cuma di cms lokomedia jquery-nya pake superfish.
Yang menjadi masalahnya pada superfish ini klo di buat sub sub menu mengarahnya ke bawah seharusnya ke kanan.
yang saya ingin tanyakan, css atau jquery-nya yang menjadikan sub menu bisa ke bawah atau ke kanan?
coz klo pake superfish theme-nya lebih bagus
Ini Ada Sedikit Perubahan Style melalui CSS dan imagenya
[IMG]http://i647.photobucket.com/albums/uu192/boypeace/menu.png[/IMG]
Tapi Belum ane terapkan di web ane
oh ya silahkan di download
http://www.enterupload.com/xzszlmda3o87/menu-horizontal.rar.html
mas mo nanya nich, cara ngutak atik menunya dimana yaa, 1 lagi gimana sich cara ngeling nya
o ya satu lagi, gimana klo menu nya pake image
balasannya ke email aj yaa
keren nih sepertinya bisa dibuat untuk menu privelege, keren2
kalau saya pake framework Codeigniter,..
bagaimanakah caranya memisahkan antara menu.php menjadi MVC,..
<a href=\"http://www.thebesthandphone.com/\">Mantab tenan iki </a>
saya coba code nya tapi error…
Fatal error: Allowed memory size of 134217728 bytes exhausted (tried to allocate 35 bytes) in C:\\Program Files\\Apache Software Foundation\\Apache2.2\\htdocs\\web_avarimark\\application\\modules\\catalog\\controllers\\ProductController.php on line 77
bantuin dunk…thanks…
posting code/isi dari ProductController.php on line 77 … ga taw letak problemna…
thanks mas referensinya… maknyoss…
sep juga tutornya ….
mas mau tanya untuk menu vertical …
saya bikin aplikasi perkantoran dan sudah berjalan dengan baik, yang saya herankan kenapa di file log error saya tertulis
Undefined index: 3
Undefined index: 5
Undefined index: 6
dan seterusnya….
bagaimana cara untuk mengatasinya, mohon pencerahannya terima kasih.
nice info Mas,
tapi tetep masih kosong kalo di koneksiin ke oracle, listing yang saya gunakan seperti ini.
$link = oci_connect(\"user\",\"password\",\"database\"
$rs=oci_parse($link, $db);
oci_execute($rs);
while ($row = oci_fetch_object($rs)) {
$data[$row->ID_MENU_REF][] = $row;
}
$menu = get_menu($data);
ga ada warning error cuman si menu nya jadi kosong
ada yang bisa bantu ?
salah ketik codenya thu gan…
mantap sekalii , klo tampilan nya dijadikan treview bisa g
Warning: mysql_fetch_object(): supplied argument is not a valid MySQL result resource in C:\\Program Files\\xampp\\htdocs\\index.php on line 30
kenapa bisa tampil error begini ya??
saya udah coba untuk yang vertical, bisa broo.. email saya aja ya
makasih sebelumnya mas, udah dicoba ternyata oke banget deh.
nah masalahnya sekarang, saya mo bikin halaman pakai dua frame, yg atas sebagai barisan menu, yg bawah menampilkan isi link. sy coba tambah di php-nya
kok gak mau ya? apa ada pengaturan khusus? atau memang ini hanya untuk satu halaman saja? saya agak malas kl harus menyisipkan ‘include menu.php’ hehehe
makasih banyak mas
supaya menunya muncul terus salah satu caranya ya menggunakan include di php
mas <script type=\"text/javascript\" src=\"jquery-1.3.2.min.js\"></script>
ini yg menjalankan dropdownnya.??
Terimakasih..
mas..penjelasan databasenya dong..kurang paham saya angka2 nya..
saya masi kurang paham cara menggunakan Jquery di blogger…
mas,, itu kan menunya bertingkat ke arah kanan,,
kalau ke arah kiri bisa ndak ?
njaluk sithik…..
hemm… mas mo tanya neh okelah untuk bisa page parent, tapi gimana mas kalo setelah link ini ketemu dengan page kedua nah biasanya kan menemukan katakanlah (?page=web-design) tapi modelnya berbeda disini menunya menuju (page/web-design) trus gimana mas file php menghubungkannya… terima kasih sebelumnya
bingung ni mas,
mau di pasang di blog nggak ngerti langkah-langkahnya, script apa aja yg akan di pasang dan dmn akan di letakkan…. maklum gaptek..
bantuin ya…. please…
artikelny bgs mas..
maksi banyak sebelumnya mas… artikel yg sangat berguna buat newbie kaya ane nie….
tapi ane da yg mo di tanya neeh mas… supaya link pagenya ga buka di new tab gmn ya??…jadi pas di klick menu profile misalnyya…nah si page profile tuh masi tetep di page itu tanpa rus loncat ke tab yg baru…maksi bnyak sebelumnya
keren nih tutor nya…
thanks y,…
sangat membantu…
God Bless You, Sir..
Gan kalo menu macam ini untuk di JSP ada gak?
Mas bro,
Please help ada error berikut:
Notice: Undefined property: stdClass::$id in C:\xampp\htdocs\jquery-menu\index.php on line 9
Mohon petunjuknya yaw.
Thanks.
l,
Sorry mas bro,
Sudah solve.
Ternyata case sensitif antara nama field table dengan script di index.php untuk $v->id.
Terus berkarya, mas.
Thanks.
save save save.. makaccciiihhh
Mantaaaaap ..
Mas nie pake IE berapaya? lao punya ku kyak ya IE 5 . kyaknya g suport gman nie?? maksih sblumnya
mas saya coba download…setelah saya coba kok ada error nya ya
berikut errornya
\"; $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(\’sad\’); $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); ?>
mohon petunjuknya
wah, tutorialnya bagus banget mas.. jadi inspirasi bagi saya untuk buat artikel lagi di web saya AplikasiPHP.com
thanks buat ilmunya mas
maaf mas mau nanya, kalo kategori utama url na dimatikan apabila dia punya parent_id,bagaimana ya mas. Misal gini mas, itu kan ada menu “Projects”. dimana parent_id nya
“PHP”
“AJAX”
“JAVA”
“ASP.Net”
nah, bagaimana projects itu tidak bisa dklik, yang hanya bisa diklik menuju url “PHP”, “AJAX”, “JAVA”, “ASP.Net”
URL nya yang di Project coba di ganti aja gan ….
dengan “#” atau apalah
wah terima kasih mas atas postingannya … sangat membantu buat saya
nah ini nih yang ane cari selama ini
mau tanya mas
gimana cara bikin file file nya?
khan misalnya nih di klik “Home” dia bakal masuk ke “localhost/belajar/home
sedangkan isi dari file “home” sendiri dari file “home.php”
mohon bimbingannya
Mas Ari,
Terima kasih artikelnya nih… saya mau coba ah… siapa tahu bisa. Hehehehe….
Semoga sukses selalu.
Terima kasih kk….
konsep manajemen menu yg menarik…
trims…
sukses slalu…
klo untuk blogspot gmn gan??
Wah mantaps nich, ijin sedot mas..ini br nemu yg mantaps seperti ini,
mau tanya mas masih newbie kalo dari menu Home kita buat linknya ke isi dari home gimana ya.terimakasih.kalau kirim ke email boleh juga mas.
Wah mantaps nich tutorialnya,ijin sedot mas.
mas, newbie mau tanya nich gimana cara membuat linknya?contoh dari menu Home kita buat linknya ke home gt.terimakasih..
Warning: mysql_fetch_object(): supplied argument is not a valid MySQL result resource in C:\\\\xampp\\\\htdocs\\\\menu\\\\index.php on line 30
pas saya jalankan menu dimisnya ada pesan error !
mohon dibantu ;( *_*
itu nama database nya gak sama dengan ini
mysql_select_db(\’tes\’); ————- line 27
maksuntya
mysql_select_db(’tes’); ————- line 27
tes = nama database
Mohn bantuannya gan, untuk buat linknya gimana.terimakasih.
keren bngt nih tutorialnya…saya sudah coba menunya yg saya mau tanyakan kalau membuat menu yang ada class=”dir” contohnya Mens karna itu ada 2…gmn kode penambahan disninya gan.mohon pencerahannya.tq
static $i = 1;
$tab = str_repeat(“\t\t”, $i);
if (isset($data[$parent])) {
$html = “\n$tab”;
$i++;
foreach ($data[$parent] as $v) {
$child = get_menu($data, $v->id);
$html .= “\n\t$tab”;
$html .= ‘url.'”>’.$v->title.’‘;
if ($child) {
$i–;
$html .= $child;
$html .= “\n\t$tab”;
}
$html .= ”;
}
$html .= “\n$tab”;
contoh menunya
About Us
Mens
Citizen
AK Anne Klein
Alexander Christie
Arbutus
Armitron
Body Glove
Calvin Klein
ini nih yang ane butuhin, ijin sedot ahh
mas maksud dari id dan parent id itu gmn? trus gmn konsep pemakaian id dan parent id untuk lv 1,lv2,lv3 dst terima kasih
Salam kenal Bang…
kalau untuk form manager menunya pakai css gimana mas…( edit, tambah, & hapus menu) ….
Gan..
Aku nyoba untuk diterapkan di codeigniter dengan browser mozilla firefox nightly 21.0a1 (2013-01-31). Dan hasilnya berantakan. Sub menunya tidak tepat di bawah menu utama, tapi berjarak cukuup jauh.
Aku coba di ie 9, bisa. oh ya, ak pake windows 8 64 bit.
mas ari gimana kalo sudah klik submenu nya hasilnya muncul di bawah menunya jadi menu nya tetap ada diatas, maksudnya nanti kalo mau pilih menu yg lain ga perlu pake tombol <— BACK,
ada contohnya ga?
Terima Kasih sebelumnya
boleh coba ya mas, makasih…
mas saya mau tanya
cara buat sub kategori produk diwebnya caranya gmn ya?
kalo di adminnya saya sudah bisa tp untuk di tampilan webnya saya masih kesulitan dalam pemanggilan subkategori produk
mas saya mau tanya kalo untuk modul dihalaman adminnya gimana ya
Assalamualaikum para master web.
mohon bantuannya.
saya mempunyai masalah sbb:
\"ingin menampilkan menu dinamis pada top menu website saya, masalahnya adalah website saya menggunakan template hasil donwload yang mana css-nya sudah ada, ketika saya memasang coding menu dinamis yang saya ambil dari database(tutorial coding dari buku SIA lokomedia yg sudah saya modifikasi, maka menu yang tampil hanya satu saja, yaitu menu DEPAN \"menu yang lain pada database tidak muncul\" )\"
berikut saya sertakan kodingnya, untuk bantuan saya mohon direply atau kirim email ya ke mochammad.kamaluddin@ymail.com
trims.
koding:
<?php
error_reporting(0);
ob_start();
session_start();
include(\"koneksi/koneksi.php\");
?>
<!DOCTYPE html>
<html lang=\"en\">
<head>
<title>LAPSOMA | Sistem Informasi Penilaian Rapot</title>
<meta charset=\"utf-8\">
<meta name=\"description\" content=\"Place your description here\">
<meta name=\"keywords\" content=\"put, your, keyword, here\">
<meta name=\"author\" content=\"Templates.com – website templates provider\">
<link rel=\"stylesheet\" href=\"css/reset.css\" type=\"text/css\" media=\"all\">
<link rel=\"stylesheet\" href=\"css/style.css\" type=\"text/css\" media=\"all\">
<script type=\"text/javascript\" src=\"js/jquery-1.4.2.min.js\" ></script>
<script type=\"text/javascript\" src=\"js/cufon-yui.js\"></script>
<script type=\"text/javascript\" src=\"js/cufon-replace.js\"></script>
<script type=\"text/javascript\" src=\"js/Myriad_Pro_300.font.js\"></script>
<script type=\"text/javascript\" src=\"js/Myriad_Pro_400.font.js\"></script>
<script type=\"text/javascript\" src=\"js/script.js\"></script>
<script type=\"text/javascript\" src=\"js/superfish.js\"> </script>
<script type=\"text/javascript\">
$(document).ready(function(){
$(\’ul.nav\’).superfish();
});
</script>
<style type=\"text/css\"></style>
<!–[if lt IE 7]>
<link rel=\"stylesheet\" href=\"css/ie/ie6.css\" type=\"text/css\" media=\"screen\">
<script type=\"text/javascript\" src=\"js/ie_png.js\"></script>
<script type=\"text/javascript\">
ie_png.fix(\’.png, footer, header nav ul li a, .nav-bg, .list li img\’);
</script>
<![endif]–>
<!–[if lt IE 9]>
<script type=\"text/javascript\" src=\"js/html5.js\"></script>
<![endif]–>
</head>
<body>
<div class=\"wrap\">
<!– header –>
<header>
<div class=\"container\">
<nav>
<ul>
<?php
function get_menu($data, $parent = 0){
static $i=1;
$tab = str_repeat(\" \", $i);
if ($data[$parent]){
$html = \"$tab<ul class=\’container\’>\";
$i++;
foreach ($data[$parent] as $v) {
$child = get_menu($data, $v->id);
$html .= \"$tab<li>\";
$html .= \'<a href=\"\’.$v->url.\’\">\’.$v->judul.\'</a>\’;
if ($child) {
$i–;
$html .= $child;
$html .= $tab;
}
$html .= \"$tab</ul>\";
return $html;
}
}
else {
return false;
}
}
$result = mysql_query(\"SELECT * FROM dropdownawal ORDER BY menu_order\");
while ($row = mysql_fetch_object($result)) {
$data[$row->parent_id] [] = $row;
}
$menu = get_menu($data);
echo \"$menu\";
?>
<!–<li class=\’current\’><a></a></li>
<li><a href=\"index.html\" class=\"m1\">Home Page</a></li>
<li class=\"current\"><a href=\"about-us.html\" class=\"m2\">About Us</a></li>
<li><a href=\"articles.html\" class=\"m3\">Our Articles</a></li>
<!–<li><a href=\"contact-us.html\" class=\"m4\">Contact Us</a></li>
<li class=\"last\"><a href=\"sitemap.html\" class=\"m5\">Site Map</a></li>–>
</ul>
</nav>
</div>
</header>
<div class=\"container\">
<!– aside –>
<aside>
<h3>Menu Utama</h3>
<table class=\"menuleft\">
<?php
$menu=mysql_query(\"SELECT * FROM menuawalleft WHERE aktif=\’Y\’ ORDER BY id_menu\");
while ($data=mysql_fetch_array($menu)) {
echo \"<tr><td><a href=$data[link]> $data[nama]</a></td></tr>\";
}
?>
</table>
</aside>
<!– content –>
<section id=\"content\">
<div id=\"banner\">
<h2>Sistem Informasi <span>Penilaian Rapot <span>Labsoma Nurul Fata</span></span></h2>
</div><div class=\"ic\">More Website Templates at TemplateMonster.com!</div>
<div class=\"inside\">
<?php include \"tengah.php\";?>
</div>
</section>
</div>
</div>
<!– footer –>
<footer>
<div class=\"container\">
<div class=\"inside\">
<div class=\"wrapper\">
<div class=\"fleft\">24/7 Customer Service <span>8.800.146.56.7</span></div>
<div class=\"aligncenter\"><a rel=\"nofollow\" href=\"http://www.templatemonster.com\" class=\"new_window\">Website template</a> designed by TemplateMonster.com<br>
<a href=\"http://www.templates.com/product/3d-models/\" class=\"new_window\">3D Models</a> provided by Templates.com</div>
</div>
</div>
</div>
</footer>
<script type=\"text/javascript\"> Cufon.now(); </script>
</body>
</html>
Assalamu alaikum,
Ini luar biasa, smoga sukses selalu buat mas Bowo! Izinkan sy sedot utk dipelajari!
Wassalam,
Makasih Sob.. :)
Saya sudah dapat gambaran gimana caranya bikin navigasi dan submenunya dengan database..
jdjskncjkn
izin sedot mas :)
bagus sekali idenya untuk membuat menu horizontal yang dinamis dengan bantuan mysql database, sebelumnya saya belum pernah terfikir membuat semacam ini
sangat bermanfaat, terima kasih ya dan salam kenal :)
Notice: Undefined variable: data in C:\\\\xampp\\\\htdocs\\\\x\\\\index.php on line 34
Update terus webnya agar terus bermanfaat bagi siapa saja yang membacanya.
My sister advised I’d personally quite possibly like this web page. He / she once was fully correct. This organize actually designed this evening jasa website murah. An individual cann’t believe just how the lot moment I had created put in for this info! Thanks a lot!
Wah Saya mampir kemari karena ucapan terimakasih dari lukman hakim (penerbit bukulokolmedia.com ) dalam bukunya akhirnya saya coba sendiri untuk berkunjung biar dapet penjelasannya
terimakasih pak wibowo
info yang bagus dan bermanfaat…
saya sudah coba dan hasilnya bagus , sukses (y)
kalo pake database oracle gmna ya mas?
untuk script yang di berikan dari link download ada muncul pesan
Notice: Undefined variable: data in C:\\xampp\\htdocs\\jquery\\index.php on line 34
untuk script cuma di ubah setingan databasenya aja. mohon bantuannya
klo liat koding php bikin puyeng gan,,, hehehe tp gpp, buat belajar koding. salam kenal gan
mas, klo menunya vertikal gimana mas?
klo liat koding php bikin puyeng gan,,, hehehe tp gpp, buat belajar koding. salam kenal gan
Isinya bermanfaat gan. lanjutkan ya gan.
waow..kerennya,artikelnya sangat membantu, bisa belajar jquery dengan mudah
jquery
Nyari-nyari tenyata nemu juga yang ini. Thanks om
Recomended. Keep posting gan
Banyak sekali artikel anda yg sangat bermanfaat saya senang sekali membacanya penuh Dengan wawasan ????
Klo yang untuk bootstrap ada ngak yg model sprt ini?
sambala anjir
suntili
sangat bermanfaat saya senang sekali membacanya
Franchise kopi