Modifier l'apparence d'un seul onglet

Note de ce sujet :
  • Moyenne : 0 (0 vote(s))
  • 1
  • 2
  • 3
  • 4
  • 5
#1
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.
Répondre
#1
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.
Répondre
#2
> 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 ...?
Philippe
CmsMs V1.6.11 Fr (merci jce) et V1.11.x Fr
Hébergeur Free.fr, Gandi.net (GandiAI et SimpleHosting)
Répondre
#2
> 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 ...?
Philippe
CmsMs V1.6.11 Fr (merci jce) et V1.11.x Fr
Hébergeur Free.fr, Gandi.net (GandiAI et SimpleHosting)
Répondre
#3
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
Win 10 pro 64 - CMSMS 2.2.19 - grincheux parfois...
Répondre
#3
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
Win 10 pro 64 - CMSMS 2.2.19 - grincheux parfois...
Répondre
#4
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.
www.web-ep.be - Développeur Web Freelance - Développeur/Intégrateur CMS Made Simple (création de sites, développement de modules/plugins/templates sur mesure), spécialisé dans les sites pour l'immobilier.
Répondre
#4
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.
www.web-ep.be - Développeur Web Freelance - Développeur/Intégrateur CMS Made Simple (création de sites, développement de modules/plugins/templates sur mesure), spécialisé dans les sites pour l'immobilier.
Répondre
#5
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
Répondre
#5
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
Répondre
#6
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
Répondre
#6
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
Répondre
#7
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
www.web-ep.be - Développeur Web Freelance - Développeur/Intégrateur CMS Made Simple (création de sites, développement de modules/plugins/templates sur mesure), spécialisé dans les sites pour l'immobilier.
Répondre
#7
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
www.web-ep.be - Développeur Web Freelance - Développeur/Intégrateur CMS Made Simple (création de sites, développement de modules/plugins/templates sur mesure), spécialisé dans les sites pour l'immobilier.
Répondre


Atteindre :


Utilisateur(s) parcourant ce sujet : 1 visiteur(s)