+- 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
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
[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