[Résolu] Menu avec select et non ul > li > a

[Résolu] Menu avec select et non ul > li > a - Version imprimable

+- Forum CMS Made Simple FR (https://forum.cmsmadesimple.fr)
+-- Forum : Général (https://forum.cmsmadesimple.fr/forum-3.html)
+--- Forum : Général (https://forum.cmsmadesimple.fr/forum-10.html)
+--- Sujet : [Résolu] Menu avec select et non ul > li > a (/thread-2783.html)

[Résolu] Menu avec select et non ul > li > a - okoweb - 03/06/2013

Citation :#~~~~~ DEBUT BLOC A NE PAS SUPPRIMER ~~~~~
#~ Version du CMS: 1.11.7
#~ Url du site : http://www.taahmanntravel.com
#~ Hébergeur / Soft : Network solutions
#~ Informations Système :
#~ CGExtensions 1.34
#~ CMSMailer 5.2.1
#~ CMSPrinting 1.0.4
#~ FileManager 1.4.3
#~ MenuManager 1.8.5
#~ MicroTiny 1.2.5
#~ MleCMS 1.11.4
#~ ModuleManager 1.5.5
#~ News 2.12.12
#~ Search 1.7.8
#~ ThemeManager 1.1.8
#~ JQueryTools 1.2.5
#~ CGContentUtils 1.3.4
#~~~~~ FIN BLOC A NE PAS SUPPRIMER ~~~~~

Bonjour à tous,
Je souhaite transformer un menu en liste déroulante avec une balise select. Voici le code initial :

Code :
[== PHP ==]

{* CSS classes used in this template:

.activeparent - The top level parent when a child is the active/current page

li.active0n h3 - n is the depth/level of the node. To style the active page for each level separately. The active page is not clickable.

.clearfix - Used for the unclickable h3 to use the entire width of the li, just like the anchors. See the Tools stylesheet in the default CMSMS installation.

li.sectionheader h3 - To style section header

li.separator - To style the ruler for the separator *} 

{assign var='number_of_levels' value=10000}

{if isset($menuparams.number_of_levels)}

  {assign var='number_of_levels' value=$menuparams.number_of_levels}

{/if}

{if $count > 0}

<ul>

{foreach from=$nodelist item=node}

{if $node->depth > $node->prevdepth}

{repeat string="<ul>" times=$node->depth-$node->prevdepth}

{elseif $node->depth < $node->prevdepth}

{repeat string="</li></ul>" times=$node->prevdepth-$node->depth}

</li>

{elseif $node->index > 0}</li>

{/if}

{if $node->parent == true or $node->current == true}

  {assign var='classes' value='menuactive'}

  {if $node->parent == true}

    {assign var='classes' value='menuactive menuparent'}

  {/if}

  {if $node->children_exist == true and $node->depth < $number_of_levels}

    {assign var='classes' value=$classes|cat:' parent'}

  {/if}

  <li class="{$classes}"><a class="{$classes}" href="{$node->url}"><span>{$node->menutext}</span></a>

{elseif $node->children_exist == true and $node->depth < $number_of_levels and $node->type != 'sectionheader' and $node->type != 'separator'}

<li class="parent"><a class="parent" href="{$node->url}"><span>{$node->menutext}</span></a>

{elseif $node->current == true}

<li class="currentpage"><h3><span>{$node->menutext}</span></h3>

{elseif $node->type == 'sectionheader'}

<li class="sectionheader"><span>{$node->menutext}</span>

{elseif $node->type == 'separator'}

<li class="separator" style="list-style-type: none;"> <hr />

{else}

<li><a href="{$node->url}"><span>{$node->menutext}</span></a>

{/if}

{/foreach}

{repeat string="</li></ul>" times=$node->depth-1}</li>

</ul>

{/if}

je souhaite le transformer sous cette forme :

Code :
[== PHP ==]

<select id="nav">

    <option>Choisir une option</option>

    <option value="{$node->url}">{$node->menutext}</option>

</select>

Que faire ?

Merci d'avance...

[Résolu] Menu avec select et non ul > li > a - heriquet - 04/06/2013

Bonjour,

Quel est la finalité ?

Apparaître sous forme de select lorsqu'il s'agit d'un périphérique mobile ?

Ou simplement lister des pages dans un endroit de ton site ?

[Résolu] Menu avec select et non ul > li > a - okoweb - 04/06/2013

heriquet a écrit :Quel est la finalité ?

Ou simplement lister des pages dans un endroit de ton site ?

Lister un ensemble de page dans un select et faire une redirection javacript vers la page avec l'evenement onchange

Code :
[== Indéfini ==]

<select id="nav">

    <option>Choisir une option</option>

    <option value="{$node->url}">{$node->menutext}</option>

</select>

<script>

    $(function(){

      $('#nav').on('change', function () {

          var url = $(this).val(); // get selected value

          if (url) { // require a URL

              window.location = url; // redirect

          }

          return false;

      });

    });

</script>

merci d'avance...

[Résolu] Menu avec select et non ul > li > a - heriquet - 04/06/2013

Ok.

Tu dois simplement ajouter un gabarit de menu dans le menu manager et y définir le code HTML du select.

Ensuite tu spécifies ce template comme étant celui à utiliser par le module "MenuManager" : {Menu template='ton_template'}.

[Résolu] Menu avec select et non ul > li > a - okoweb - 04/06/2013

En fait, dans la hiérarchie des pages, j'ai une page destination qui est parent de quelque pages des destinations.
Je souhaite dans mon menu prendre que les enfants de ce parent page destination.

Je souhaite le gabarit menu approprié qui puisse me générer ce select. Je connais rien à Smarty.

Merci d'avance...

[Résolu] Menu avec select et non ul > li > a - heriquet - 04/06/2013

Regarde dans la doc du menu manager.

Tu trouveras ton bonheur et sans doutes des possibilités que tu ne soupçonnais même pas !

[Résolu] Menu avec select et non ul > li > a - bess - 04/06/2013

Citation :Je connais rien à Smarty.

je connais rien aux voitures, j'évite de faire mes vidanges moi même Smile

Prend le temps de te former à Smarty car on va pas te donner le gabarit tout cuit, tout finit, juste comme cela. C'est un dérivé du PHP qui est sincèrement trèèèèès abordable à n'importe qui car : il y a peu de différence avec PHP et il y a peu de code différent à retenir

{if} {else} {/if} {assign .. ..} {foreach .. ..}

couvrent à eux seul 90% du code que tu utiliseras dans les gabarits de cmsmadesimple ! Pour le reste, je t'ai donné le lien vers la doc smarty

[Résolu] Menu avec select et non ul > li > a - okoweb - 21/06/2013

J'ai essayé ceci, ça ne donne pas le résultat escompté.
Code template du menu, pour le cas template="destinations" :

Code :
[== PHP ==]

{assign var='number_of_levels' value=10000}

{if isset($menuparams.number_of_levels)}

  {assign var='number_of_levels' value=$menuparams.number_of_levels}

{/if}

{if $count > 0}

<select id="destinations">

<option value="">{translate text='Choice destination...'}</option>

{foreach from=$nodelist item=node}

<option value="{$node->url}">{$node->menutext}</option>

{/foreach}

</select>

{/if}

et j'appele le menu ainsi dans le gabarit :

Code :
[== PHP ==]

{menu childrenof=$lang_parent template="destinations"}

Et voici la l'arbre de mes pages :

English
- Home
- Services
- Service 1
- Service 2
- Service 3
Francais
- Accueil
- Services
- Service 1
- Service 2
- Service 3

Je rappelle que c'est un site multilingue avec mle cms.

Et le résultat attendu c'est :
<select id="destinations">
<option>Choisir une destination</option>
<option value="">Service 1</option>
<option value="">Service 2</option>
<option value="">Service 3</option>
</select>

Merci d'avance...

[Résolu] Menu avec select et non ul > li > a - heriquet - 21/06/2013

Pourquoi tu as mis ca dans ton code ?

Code :
[== Indéfini ==]

{assign var='number_of_levels' value=10000}

{if isset($menuparams.number_of_levels)}

  {assign var='number_of_levels' value=$menuparams.number_of_levels}

{/if}

Tu veux uniquement afficher les sous-menus de ton onglet "services" c'est bien ca ?

[Résolu] Menu avec select et non ul > li > a - okoweb - 21/06/2013

heriquet a écrit :Tu veux uniquement afficher les sous-menus de ton onglet "services" c'est bien ca ?

Exactement ! Que faire ?

[Résolu] Menu avec select et non ul > li > a - heriquet - 21/06/2013

Bah écoute... tout d'abord, lire la doc du MenuManager... elle est pas là pour ceux qui répondent à ceux qui posent des questions sur le forum Wink

.

Dans ton cas, il faut le paramètre qui dit qu'il faut utiliser les sous menu de ton onglet service, donc :

Code :
[== Indéfini ==]

start_element="1.2"

et que tu prends qu'un seul niveau, pas les descendants :

Code :
[== Indéfini ==]

number_of_levels="1"

Ces 2 paramètres sont à placer dans l'appel du module :

Code :
[== Indéfini ==]

{menu ICI LES PARAMETRES template="destinations"}

Le childrenof était bien tenté mais avec le multilingue, pas sur que ca soit le meilleur choix (a vue de nez, j'ai pas testé).

Mais d'autant plus tu veux afficher la même chose sur chacune de tes pages.

Pour info, $lang_parent contient la langue courante donc ca n'aurait de toute façon pas pu t'aider beaucoup.

Si tu veux connaitre le contenu d'une variable, tu peux toujours l'afficher : {$lang_parent} afin de savoir ce qu'elle a dans le ventre.

Pas mal sinon ton site.

[Résolu] Menu avec select et non ul > li > a - okoweb - 21/06/2013

Code :
[== PHP ==]

{if $lang_parent == "fr"}

   {menu start_element="2.4" number_of_levels="1" template="destinations"}

{else}

   {menu start_element="1.4" number_of_levels="1" template="destinations"}

{/if}

Ce code me retourne le parent et non les enfants dont j'ai besoin.
Pour le cas j'ai que Services et pas Service 1, Service 2 et Service 3. J'ai essayé de mettre number_of_levels="2". Pas de changement...

Et mon template destinations :

Code :
[== PHP ==]

{if $count > 0}

<select id="destinations">

<option value="">{translate text='Choice destination...'}</option>

{foreach from=$nodelist item=node}

<option value="{$node->url}">{$node->menutext}</option>

{/foreach}

</select>

{/if}

Merci d'avance...

[Résolu] Menu avec select et non ul > li > a - okoweb - 21/06/2013

heriquet a écrit :...

Pas mal sinon ton site.

http://www.taahmanntravel.com

[Résolu] Menu avec select et non ul > li > a - okoweb - 24/06/2013

Merci à votre précieuse aide et surtout à heriquet qui m'a perdu de résoudre mon souci.

Bon vent à ce forum.

[Résolu] Menu avec select et non ul > li > a - heriquet - 24/06/2013

You're welcome Smile