Forum CMS Made Simple FR
Modifier l'apparence d'un seul onglet - Version imprimable

+- Forum CMS Made Simple FR (https://forum.cmsmadesimple.fr)
+-- Forum : Général (https://forum.cmsmadesimple.fr/forum-3.html)
+--- Forum : Graphisme (https://forum.cmsmadesimple.fr/forum-9.html)
+--- Sujet : Modifier l'apparence d'un seul onglet (/thread-2378.html)


Modifier l'apparence d'un seul onglet - remsmc - 19/11/2012

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



Bonsoir à tous,

Tout est dans le titre ou presque :p

Voilà mon soucis,

j'aimerais rajouter sur un seul onglet de mon menu une petite image en travers et qui dépasse légèrement de l'onglet lui-même.
Le but étant de mettre un onglet pour une page vide , et de rajouter une petite image "A venir" ou "en travaux" en travers.

Je sais que je dois utiliser une div avec une image flottante pour qu'elle dépasse de mon onglet, mais je ne trouve pas la liste des onglets... Confused
Où se trouve le fichier avec la liste complète des onglets du menu ?

Merci

si vous avez une autre idée pour réaliser cela, n'hésitez pas à me la proposer.

Modifier l'apparence d'un seul onglet - Philipppe - 28/11/2012

> Où se trouve le fichier avec la liste complète des onglets du menu ?
As-tu trouvé ?

As-tu été voir dans Disposition>Gestion de Menu ...?

Modifier l'apparence d'un seul onglet - pierrepercee - 03/12/2012

Bon dans le principe, c'est pas très compliqué. D'abord tu copies le texte du menu dans l'onglet.Tu te rends dans le gestionnaire de menu sur le menu utilisé dans ton gabarit. Puis tu affectes une class css à l'onglet qui t'intéresse genre

Code :
[== Indéfini ==]
{if $node->menutext == "tontextedemenu"}
class="maclass"{/if}

Tu crées ensuite ta class .maclass dans ta feuille de style et tout roule ! Wink

Modifier l'apparence d'un seul onglet - heriquet - 05/12/2012

Y a une autre méthode qui est d'ajouter (dans le template de menu) l'alias de la page dans un des éléments HTML (li, span ou a) et de styles cette classe dans la CSS. C'est plus générique.

Modifier l'apparence d'un seul onglet - remsmc - 06/12/2012

merci pour vos réponses.

Heriquet , peux-tu préciser comment réaliser cela via le template du menu ?
aurais-tu un exemple s'il te plait ?

Merci

Modifier l'apparence d'un seul onglet - remsmc - 06/12/2012

Pierrepercee,
bonjour et merci pour ton aide

J'ai tenté de réalisé ce que tu m'as proposé:

j'ai créé un nouveau gabarit de menu qui est la copie conforme de mon original (histoire de ne pas le casser...)

voici mon gabarit :
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}

{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}

j'ai voulu tester ma classe sur l'onglet Home
j'ai donc rajouter tout en bas de mon gabarit :
Code :
[== Indéfini ==]
{if $node->menutext == "Home"}
class="onglet_modif1"{/if}

et dans une de mes feuille de style j'ai ajouter :
Code :
[== Indéfini ==]
.onglet_modif1{
    color: #00ff00;
}

(je voulais tester si je pouvais mettre le texte en vert... c'est juste un test)

Mais rien n'a changé, mon site marche toujours aussi bien mais rien n'a changer dans l'aspect de l'onglet Home...

Voilà peut-être que je n'est pas saisi quelque chose.
Peut-être que mon {if} est mal placé.

Merci

Modifier l'apparence d'un seul onglet - heriquet - 06/12/2012

Code :
[== Indéfini ==]
        {else}
            <li{if $node->parent == true || $node->haschildren == true} class='parent {$node->alias}-page'{/if}>
                <a href='{$node->url}'{if $node->target != ''} target='{$node->target}'{/if}>{$node->menutext}</a>
        {/if}

par exemple ceci