[Résolu] Eclairez moi sur les menus svp

[Résolu] Eclairez moi sur les menus svp - 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] Eclairez moi sur les menus svp (/thread-2343.html)

[Résolu] Eclairez moi sur les menus svp - Flibouk - 07/11/2012

Citation :#~~~~~ DEBUT BLOC A NE PAS SUPPRIMER ~~~~~
#~ Version du CMS: 1.11.2.1
#~ Url du site :
#~ Hébergeur / Soft : perso
#~ Informations Système :
#~ site pas en ligne
#~~~~~ FIN BLOC A NE PAS SUPPRIMER ~~~~~

Bonjour a tous,
je suis nouveau sur ce forum ainsi que dans l'utilisation du CMS MadeSimple.
J'ai fait mon gabarit template + css, ca marche impec.
Par contre pour le menu, j'aimerai comprendre comment ca marche exactement.

Aujourd'hui en html j'ai mon code qui est comme ca :

Code :
[== HTML ==]

<nav>

                <ul class="sf-menu">

                    <li class="item1 active"><a href="#">Accueil</a></li>

                     <li class="item5"><a href="#">Activités</a></li>

                     <li class="item6"><a href="#">Facebook</a></li>

                     <li class="item7"><a href="#">Contact</a></li>

                </ul>

              </nav>

Il y a plusieurs class car j'ai différent image bouton. Il s'agit d'un simple menu horizontal.
Concrètement, comment je dois procéder pour faire mon menu avec MadeSimple ?

Merci par avance.

[Résolu] Eclairez moi sur les menus svp - bess - 07/11/2012

Bonjour Flibouk, bienvenue sur le forum

Prenons le sujet par le bon bout. Tu as une image associée à chaque entrées du menu donc à chaque pages.

Est-ce que l'association est manuelle (telle image pour telle page) ou est elle automatisable (une page nommée "toto" sera toujours associée à une image nommée ./uploads/images/toto.png)

La seconde solution est plus simple a gérer et plus rapide en terme d’exécution car le système n'aura pas à devoir se souvenir de l'url d'image pour telle et telle page.

Prenons comme référence l'alias de la page, c'est un nom unique, donc aucun risque d'avoir 2 pages pointant vers une même image.

Ton menu affiché :
- Accueil
- Prenez Contact
- A propos

Tes alias de page :
- accueil
- contact
- about

Tes images :
- /uploads/images/accueil.png
- /uploads/images/contact.png
- /uploads/images/about.png

Imaginons un template de menu ultra simple : je ne gère que les pages de type contenu et que sur un seul niveau. Il faudra évidement extrapoler avec tes propres utilisations et pas utiliser mon code tel quel !!

Citation :<ul>
{foreach from=$nodelist item=node}
<li>Alias : {$node->alias}, Text du lien : <a href="{$node->url}">{$node->menutext}</a></li>
{/foreach}
</ul>

Ce que je vais faire c'est ajouter une classe à lien qui affichera une image bidon nommée /uploads/image/bidon.png

Citation :<ul>
{foreach from=$nodelist item=node}
<li>Alias : {$node->alias}, Text du lien : <a class='bidon' href="{$node->url}">{$node->menutext}</a></li>
{/foreach}
</ul>

et mon CSS :

Citation :a.bidon{
background: url([[root_url]]/uploads/images/bidon.png) no-repeat top left transparent;
}

Là j'ai tous mes menus avec une image standardisée. Maintenant je vais surcharger lien par lien selon son alias

Citation :<ul>
{foreach from=$nodelist item=node}
<li>Alias : {$node->alias}, Text du lien : <a class='bidon' href="{$node->url}" style="background-image:url({root_url}/uploads/images/{$node->alias}.png)">{$node->menutext}</a></li>
{/foreach}
</ul>

et là toutes les images sont surchargées en CSS directement node par node. Reste qu'il faut gérer là ou je n'ai pas encore d'image...

La suite tout de suite

[Résolu] Eclairez moi sur les menus svp - bess - 07/11/2012

Tester si l'image existe. En Php c'est

if (file_exists($root_path.'/uplaods/images/'.$node->alias.'png'))

L'équivalent Smarty c'est donc

{if file_exists($root_path.'/uplaods/images/'.$node->alias.'png')}

Allez hop !

Citation :<ul>
{foreach from=$nodelist item=node}
<li>Alias : {$node->alias}, Text du lien : <a class='bidon' href="{$node->url}"
{if file_exists($root_path.'/uplaods/images/'.$node->alias.'png')}style="background-image:url({root_url}/uploads/images/{$node->alias}.png)"{/if}>{$node->menutext}</a></li>
{/foreach}
</ul>

et voilà fin de l'histoire, c'est automatique, ca trouve une image correspondante ou celle par défaut dans tous les cas

[Résolu] Eclairez moi sur les menus svp - Jean le Chauve - 07/11/2012

Beau petit cours Bess Smile

Attention : {if file_exists($root_path.'/uplaods/images
{if file_exists($root_path.'/uploads/images.

Autre lien : http://www.cmsmadesimple.fr/forum/viewtopic.php?id=2680

[Résolu] Eclairez moi sur les menus svp - Flibouk - 07/11/2012

Ok j'ai compris le principe.
Merci beaucoup ! enfin surtout a BESS Wink

[Résolu] Eclairez moi sur les menus svp - bess - 08/11/2012

une fois que t'as testé avec succès oublie pas [Résolu] dans le titre de ce topic Wink