[Résolu] Menu déroulant avec groupe page static

vinc[E]

Bonjour à tous, je souhaiterais faire un menu déroulant avec les pages statiques et les groupes, j'utilise le framework w3.css et pour avoir un menu dropdown, il faut utiliser ce code html :

<div class="w3-dropdown-hover">
<button class="w3-button">Hover Over Me!</button>
<div class="w3-dropdown-content w3-bar-block w3-border">
<a href="#" class="w3-bar-item w3-button">Link 1</a>
<a href="#" class="w3-bar-item w3-button">Link 2</a>
<a href="#" class="w3-bar-item w3-button">Link 3</a>
</div>
</div>

Voici le résultat

Lorsque j'utilise la fonction staticList, Pluxml rajoute des <ul> et <li>, du coup, cela crée des décalages dans ma barre de navigation car le framework w3.css n'utilise pas des <ul> et <li> pour le menu dropdown.

Que dois-je modifier pour obtenir :

<div class="w3-dropdown-hover">
<button class="w3-button">Nom du groupe de page statique</button>
<div class="w3-dropdown-content w3-bar-block w3-border">
<a href="#" class="w3-bar-item w3-button">Static 1</a>
<a href="#" class="w3-bar-item w3-button">Static 2</a>
<a href="#" class="w3-bar-item w3-button">Static 3</a>
</div>
</div>

J'ai essayé de modifier le fichier class.plx.show.php mais cela n'a pas marché.

Merci pour votre aide.

Jerry Wham

TU ME COPIERAS 100 FOIS : NE JAMAIS MODIFIER LE CODE DU CORE !

[== Indéfini ==]
public function staticList($extra='', $format='<li class="#static_class #static_status" id="#static_id" ><a href="#static_url" title="#static_name">#static_name</a></li>', $format_group='<span class="#group_class #group_status">#group_name</span>', $menublog=false)

Il faut modifier le format et le fichier header.php du thème par défaut pour enlever la liste (ligne 27)

[== Indéfini ==]
<ul class="menu">
   <?php $plxShow->staticList($plxShow->getLang('HOME'),'<li class="#static_class" id="#static_id"><a href="#static_url" title="#static_name">#static_name</a></li>'); ?>
   <?php $plxShow->pageBlog('<li class="#page_class #page_status" id="#page_id"><a href="#page_url" title="#page_name">#page_name</a></li>'); ?>
</ul>

devient

[== Indéfini ==]
<div class="w3-dropdown-hover">
   <?php $plxShow->staticList($plxShow->getLang('HOME'),'<a class="w3-bar-item w3-button #static_status" id="#static_id"><a href="#static_url" title="#static_name">#static_name</a>','<button class="w3-button">#group_name</button><div class="w3-dropdown-content w3-bar-block w3-border">'); ?>
   <?php $plxShow->pageBlog('<a class="w3-bar-item w3-button #page_status" id="#page_id"><a href="#page_url" title="#page_name">#page_name</a>'); ?>
</div></div>

Pierre

<?php
for ($x = 1; $x <= 100; $x++) {
echo "NE JAMAIS MODIFIER LE CODE DU CORE <br>";
}
?>


hihi...

Jerry Wham

@Pierre:

vinc[E]

Merci beaucoup pour ton aide Jerry Wham, j'ai suivi tes instructions et cela affiche bien ce que je souhaite, mais il y a un problème de mise en page du coup.

Menu 1 et Menu 2 s'affichent bizarrement et cela décale tout, je souhaiterais obtenir un truc comme ça avec Menu 1 et 2 l'un à côté de l'autre.

A noter que j'utilise pluxml 5.3.1, je ne sais pas si c'est à cause de ça, mais ça continue à générer des <ul> et <li> malgré le code que tu m'as passé.

niqnutn

tu peux regarder ce que j'avais fait avec w3css http://forum.pluxml.org/viewtopic.php?id=5576

Jerry Wham

Je me suis vautré complètement dans le code que je t'ai donné (maudis copier/coller). 8o
Il faut mettre :

[== PHP ==]
<div class="w3-dropdown-hover">
   <?php $plxShow->staticList($plxShow->getLang('HOME'),'<a class="w3-bar-item w3-button #static_status" id="#static_id" href="#static_url" title="#static_name">#static_name</a>','<button class="w3-button">#group_name</button><div class="w3-dropdown-content w3-bar-block w3-border">'); ?>
   <?php $plxShow->pageBlog('<a class="w3-bar-item w3-button #page_status" id="#page_id" href="#page_url" title="#page_name">#page_name</a>'); ?>
</div></div>

Ça devrait aller mieux... :P

vinc[E]

J'ai utilisé le nouveau code et cela donne ça :

A mon avis, le problème vient du fait qu'il faut boucler le code en entier, c'est à dire avec le <div class="w3-dropdown-hover"> également mais je ne sais pas du tout comment faire, en fait pour avoir un bouton dropdown en entier, il faut que pluxml génère ce code :

<div class="w3-dropdown-hover">
<button class="w3-button">Hover Over Me!</button>
<div class="w3-dropdown-content w3-bar-block w3-border">
<a href="#" class="w3-bar-item w3-button">Link 1</a>
<a href="#" class="w3-bar-item w3-button">Link 2</a>
<a href="#" class="w3-bar-item w3-button">Link 3</a>
</div>
</div>

puis on passe au deuxième bouton avec le même code en entier, mais avec le code que tu m'as passé, il n'y a que cette partie qui est bouclée :

<li>
<button class="w3-button">Menu 1</button><div class="w3-dropdown-content w3-bar-block w3-border">
<ul id="static-menu-1">
<a class="w3-bar-item w3-button noactive" id="static-1" href="" title="Statique 1">Statique 1</a>
<a class="w3-bar-item w3-button noactive" id="static-2" href="" title="Statique 2">Statique 2</a>
</ul>
</li>

Merci grandement pour ton aide.

Jerry Wham

Essaie avec ça :

[== PHP ==]
   <?php $plxShow->staticList($plxShow->getLang('HOME'),'<a class="w3-bar-item w3-button #static_status" id="#static_id" href="#static_url" title="#static_name">#static_name</a>','<div class="w3-dropdown-hover"><button class="w3-button">#group_name</button><div class="w3-dropdown-content w3-bar-block w3-border">'); ?>
   <?php $plxShow->pageBlog('<a class="w3-bar-item w3-button #page_status" id="#page_id" href="#page_url" title="#page_name">#page_name</a>'); ?>
</div></div>

vinc[E]

Super, ça marche presque !

Il faudrait également inclure les </div></div> dans la boucle et ça sera exactement le code nécessaire pour afficher le menu.

vinc[E]

J'ai réussi à peaufiner et j'ai obtenu le résultat souhaité !

Merci Jerry Wham, ton code m'a grandement aidé.

Niqnutn, tu as fait un super boulot avec w3.css, je vais m'en inspirer pour construire mon thème.

Merci à tous.

Jerry Wham

Et tu as fait comment ? Que tout le monde en profite !

vinc[E]

Pour afficher le menu déroulant en haut, j'ai utilisé le code suivant :

<div class="w3-bar w3-light-grey">
<?php $plxShow->staticList($plxShow->getLang('HOME'),'<a class="w3-bar-item w3-button #static_status" id="#static_id" href="#static_url" title="#static_name">#static_name</a>','<div class="w3-dropdown-hover"><button class="w3-button">#group_name</button><div class="w3-dropdown-content w3-bar-block w3-border">'); ?>
<?php $plxShow->pageBlog('<a class="w3-bar-item w3-button #page_status" id="#page_id" href="#page_url" title="#page_name">#page_name</a>'); ?>
</div>

J'ai utilisé le dernier code que tu m'as donné et je l'ai simplement mis entre les balises :
<div class="w3-bar w3-light-grey">
</div>

Cela permet de générer une navbar avec le framework w3.css.

Merci encore, tu as été au top !