Há um tempo eu tinha criado um esquema e função PHP pra gerar um UL-LI para fazer um menu tipo pai e filhos, sendo que a quantidade de filhos e netos poderia ser infinita.
Hoje deu vontade de sair um pouco do javascript de sempre e postar essa parada aqui no blog. Desde a organização da tabela no Banco de Dados, função PHP pra gerar os UL-LI e finalizando com links pra estilizar este menu UL-LI.
Lá vai:
1) Para o menu (pai e filhos) será necessário apenas 1 tabela com o nome de 'menus'. Só executar a seguinte SQL no Banco de dados:
CREATE TABLE `menus` ( `id` tinyint(3) unsigned NOT NULL auto_increment, `pai_id` tinyint(3) unsigned NOT NULL default '0', `ordem` tinyint(3) unsigned NOT NULL default '0', `visivel` tinyint(3) unsigned NOT NULL default '1', `nome` varchar(30) NOT NULL default '', `link` varchar(150) default NULL, PRIMARY KEY (`id`), KEY `pai_id` (`pai_id`,`ordem`,`visivel`) ) ENGINE=MyISAM DEFAULT CHARSET=latin1 AUTO_INCREMENTO SQL acima manda criar uma tabela chamada 'menus' onde o truque está no campo pai_id.
Em cada registro, o campo pai_id irá apontar para o ID de outro registro na mesma tabela, indicando que ele é o seu pai. Se a entrada não tiver pai, o campo pai_id deve ficar com 0 (zero).
- "Ó PÓOOOOI!!"
2) Preencha sua tabela lembrando de colocar visivel=1 para os menus que quer que sejam visíveis e colocando a ordem de cada menu. O campo pai_id indica qual o ID do menu pai, se ele for um menu principal (pai) sem outro pai, este campo deve ficar com '0'.
Exemplo pra fazer o submenu:
comidas - arroz - feijao guloseimas - chocolate - maquindonalds ---- sanduiche porco ---- sanduiche pequenoTeremos:
comidas (pai_id=0) - arroz (pai_id = id do 'comidas') - feijao (pai_id = id do 'comidas') guloseimas (pai_id=0) - chocolate (pai_id = id do 'guloseimas') - maquindonalds (pai_id = id do 'guloseimas') ---- sanduiche porco (pai_id = id do 'maquindonalds') ---- sanduiche pequeno (pai_id = id do 'maquindonalds')3) Adicione a seguinte função à sua biblioteca de funções (você já tem que estar conectado ao bd antes de usar esta função né?):
function gera_menu($cod_ul_pai,$tabs,$id_do_pai){ //gera um menu ul com submenus //by Micox - elmicox.blogspot.com - forum.ievolutionweb.com //exemplo: gera_menu("<ul>"," ",0) $recc = mysql_query("SELECT * FROM menus WHERE pai_id=$id_do_pai AND visivel=1 ORDER BY ordem"); $ret = $cod_ul_pai."\r\n"; if($recc==true){ while($linha = mysql_fetch_array($recc,MYSQL_ASSOC)){ if(isset($linha['link'])){ $href = $linha['link']; }else{ $href = ''; } $ret .= $tabs." <li><a href='$href'>".htmlentities($linha['nome'])."</a>"; //testando se tem filhos $recfilho = mysql_query("SELECT * FROM menus WHERE pai_id=$linha[id] AND visivel=1 ORDER BY ordem"); if(mysql_num_rows($recfilho)>0){ $ret .= "\r\n".$tabs." ".gera_menu("<ul>",$tabs." ",$linha['id'])." ".$tabs; } //fim filhos $ret .= "</li>\r\n"; } mysql_free_result($recc); } $ret .= $tabs."</ul>\r\n"; return $ret; }4) Chame a função onde vc quer que gere o menu:
<?php echo gera_menu("<ul>"," ",0) ?>5) Isso aí irá gerar um menu como este exemplo:
<ul> <li><a href='produtos.php?text=3'>Produtos e Serviços</a> <ul> <li><a href='produtos.php?Gravadores_Monolinha&cat=1&text=14'>Gravadores Monolinha</a></li> <li><a href='produtos.php?Gravadores_Multilinha&cat=2&text=15'>Gravadores Multilinha</a></li> <li><a href='produtos.php?Outros_produtos&cat=3&text=16'>Outros produtos</a></li> </ul> </li> <li><a href='conteudo.php?Revendas&text=4'>Revendas</a> <ul> <li><a href='conteudo.php?Brasil&text=17'>Brasil</a></li> <li><a href='conteudo.php?Internacional&text=18'>Internacional</a></li> <li><a href='conteudo.php?Seja_um_revendedor&text=19'>Seja um revendedor</a></li> </ul> </li> <li><a href='conteudo.php?Clientes&text=5'>Clientes</a></li> <li><a href='conteudo.php?Suporte&text=6'>Suporte</a></li> </ul>6) Pronto, agora é só estilizar com algum tutorial de menu, treemenu (menu em árvore), menu drop down horizontal, vertical, etc.
Té. Dúvidas, pergunta lá no fórum :) Gostou da dica acima? Então clica nos botões de compartilhamento abaixo e me ajude a dica a subir no Google.