Personalizzazione menu (liste)

La discussione sul CMS Made Simple in italiano.

Moderator: magallo

1dMN
Forum Members
Forum Members
Posts: 29
Joined: Mon Jan 28, 2008 8:30 am

Personalizzazione menu (liste)

Post by 1dMN »

Ciao ragazzi, ciao Alby.

Sono stato lontano per un po' causa lavoro e solo stamattina mi sono accorto che il mio account non esisteva più!
Ho dovuto reiscrivermi, sapete dirmi se è successo anche a voi? Forse devo leggere qualche topic in proposito...

Premessa a parte, volevo chiedervi di darmi un aiuto, of course  ;)
Sto sviluppando un sito con un menu orizzontale abbastanza "ricco" di voci e sottovoci; sto utilizzando il semplice {menu template='simple_navigation.tpl' number_of_levels='2'} al quale poi inserisco secondari per ogni voce primaria.
Il mio problema è presto detto: la mia necessità è quella di assegnare un id univoco ad ogni voce primaria

Code: Select all

<ul>
<li id="nomeid1">Livello #1
<ul>
<li>Sottolivello #1.1</li>
<li>Sottolivello #1.2</li>
<li>Sottolivello #1.3</li>
<li>Sottolivello #1.4</li>
</ul></li>
<li id="nomeid2>Livello #2</i>
<li id="nomeid3>Livello #3</i>
<li id="nomeid4>Livello #4</i>
<li id="nomeid5>Livello #5</i>
<li id="nomeid6>Livello #6</i>
</ul>
e fare in modo che ad ogni id corrisponda poi la chiamata ad un template piuttosto che ad un altro (questo poichè ad ogni id si richiamano sezioni del sito con colori diversi, es.: 1 = toni rossi, 2 = toni verdi, 3 = toni gialii, ecc.).

Credo uno o più UDT possano fare al caso mio, ma non so come devo impostare la sintassi  ???
Qualcuno mi sa indirizzare? Grazie!

1dMN
alby

Re: Personalizzazione menu (liste)

Post by alby »

1dMN wrote: Credo uno o più UDT possano fare al caso mio, ma non so come devo impostare la sintassi  ???
Qualcuno mi sa indirizzare? Grazie!
Non lo vedo così semplice ....
l'UDT dovrebbe contenere una specie di tabella colore alias di pagina (della sezione)
oppure senza UDT potresti utilizzare il $page_alias della sezione modificando il template (visto che è solo con depth=1 mi pare di aver capito)

Alby
1dMN
Forum Members
Forum Members
Posts: 29
Joined: Mon Jan 28, 2008 8:30 am

Re: Personalizzazione menu (liste)

Post by 1dMN »

alby wrote:
1dMN wrote: Credo uno o più UDT possano fare al caso mio, ma non so come devo impostare la sintassi  ???
Qualcuno mi sa indirizzare? Grazie!
Non lo vedo così semplice ....
l'UDT dovrebbe contenere una specie di tabella colore alias di pagina (della sezione)
oppure senza UDT potresti utilizzare il $page_alias della sezione modificando il template (visto che è solo con depth=1 mi pare di aver capito)

Alby
Ciao Alby, sempre preciso e puntuale.
Dunque, come hai già capito non sono sveltissimo, quindi provo a spiegarmi con un esempio (poi magari non serve):
Ho le sezioni (pagine) "Chi siamo", "Dove siamo", "Cosa facciamo"; ogni pagina ha delle sottopagine.
"Chi" ha un template azzurro, "Dove" ha un tpl rosso, "Cosa" ha il tpl verde.
Il menu è uno solo, dunque come posso gestire i colori (sfondi e immagini) sullo stesso e richiamarlo nei tre templates?
Pensavo che un UDT potesse fare al caso mio, e non ho capito come posso gestire il tutto con $page_alias...

1dMN
alby

Re: Personalizzazione menu (liste)

Post by alby »

1dMN wrote:
alby wrote: Non lo vedo così semplice ....
l'UDT dovrebbe contenere una specie di tabella colore alias di pagina (della sezione)
oppure senza UDT potresti utilizzare il $page_alias della sezione modificando il template (visto che è solo con depth=1 mi pare di aver capito)
Ciao Alby, sempre preciso e puntuale.
Dunque, come hai già capito non sono sveltissimo, quindi provo a spiegarmi con un esempio (poi magari non serve):
Ho le sezioni (pagine) "Chi siamo", "Dove siamo", "Cosa facciamo"; ogni pagina ha delle sottopagine.
"Chi" ha un template azzurro, "Dove" ha un tpl rosso, "Cosa" ha il tpl verde.
Il menu è uno solo, dunque come posso gestire i colori (sfondi e immagini) sullo stesso e richiamarlo nei tre templates?
Pensavo che un UDT potesse fare al caso mio, e non ho capito come posso gestire il tutto con $page_alias...
Supponendo che "Chi siamo" ha alias chi-siamo, "Dove siamo" ha alias dove-siamo, "Cosa facciamo" ha alias cosa-facciamo:

1. In menu manager template hai la variabile $node->depth
2. $node->alias è la tua variable di sezione

in simple_navigation:
{* 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 *}

{if $count > 0}

{foreach from=$nodelist item=node}

{assign var="csssection" value=''}
{if $node->depth == 0}{assign var="csssection" value=$node->alias}{/if}

{if $node->depth > $node->prevdepth}
{repeat string="" times=$node->depth-$node->prevdepth}
{elseif $node->depth prevdepth}
{repeat string="" times=$node->prevdepth-$node->depth}

{elseif $node->index > 0}
{/if}

{if $node->current == true}
Current page is {$node->hierarchy}: {$node->menutext}

{elseif $node->parent == true}
url}"{if $node->accesskey != ''} accesskey="{$node->accesskey}"{/if}{if $node->tabindex != ''} tabindex="{$node->tabindex}"{/if}{if $node->titleattribute != ''} title="{$node->titleattribute}"{/if}>{$node->hierarchy}: {$node->menutext}

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

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


{else}
url}"{if $node->accesskey != ''} accesskey="{$node->accesskey}"{/if}{if $node->tabindex != ''} tabindex="{$node->tabindex}"{/if}{if $node->titleattribute != ''} title="{$node->titleattribute}"{/if}{if $node->target != ''} target="{$node->target}"{/if}>{$node->hierarchy}: {$node->menutext}

{/if}

{/foreach}
{repeat string="" times=$node->depth-1}

{/if}
UNTESTED  :)
- Bisogna controllare se $node->depth == 0 o 1 (c'è Home o no ...)
- in CSS add:
.nome_alias_della_pagina {background-color: #il_colore_scelto_della_sezione}


Non ho capito se anche i sottomenu sono colorati ...

Alby
1dMN
Forum Members
Forum Members
Posts: 29
Joined: Mon Jan 28, 2008 8:30 am

Re: Personalizzazione menu (liste)

Post by 1dMN »

Ok, adesso sto capendo qualcosa in più, grazie mille!!!
Poi provo a fare come mi hai suggerito.

Si, anche i sottomenu avranno lo stesso colore del relativo padre.

P.S.: mi sai dire perchè ho dovuto reiscrivermi questa mattina? Era scaduto il mio account?!?
Avevo centinaia di messaggi postati ed ora mi ritrovo con il progressivo ripartito da questa mattina... la cosa mi infatidisce un po'.

1dMN
alby

Re: Personalizzazione menu (liste)

Post by alby »

1dMN wrote: Ok, adesso sto capendo qualcosa in più, grazie mille!!!
Poi provo a fare come mi hai suggerito.

Si, anche i sottomenu avranno lo stesso colore del relativo padre.

P.S.: mi sai dire perchè ho dovuto reiscrivermi questa mattina? Era scaduto il mio account?!?
Avevo centinaia di messaggi postati ed ora mi ritrovo con il progressivo ripartito da questa mattina... la cosa mi infatidisce un po'.
Ad inizio mese c'è stato un problema al forum e probabilmente sono saltati degli account (mi pare anche un altro che iniziava con 1 invece di lettera)

Alby
1dMN
Forum Members
Forum Members
Posts: 29
Joined: Mon Jan 28, 2008 8:30 am

Re: Personalizzazione menu (liste)

Post by 1dMN »

alby wrote: Supponendo che "Chi siamo" ha alias chi-siamo, "Dove siamo" ha alias dove-siamo, "Cosa facciamo" ha alias cosa-facciamo:

1. In menu manager template hai la variabile $node->depth
2. $node->alias è la tua variable di sezione

in simple_navigation:
{* 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 *}

{if $count > 0}

{foreach from=$nodelist item=node}

{assign var="csssection" value=''}
{if $node->depth == 0}{assign var="csssection" value=$node->alias}{/if}

{if $node->depth > $node->prevdepth}
{repeat string="" times=$node->depth-$node->prevdepth}
{elseif $node->depth prevdepth}
{repeat string="" times=$node->prevdepth-$node->depth}

{elseif $node->index > 0}
{/if}

{if $node->current == true}
Current page is {$node->hierarchy}: {$node->menutext}

{elseif $node->parent == true}
url}"{if $node->accesskey != ''} accesskey="{$node->accesskey}"{/if}{if $node->tabindex != ''} tabindex="{$node->tabindex}"{/if}{if $node->titleattribute != ''} title="{$node->titleattribute}"{/if}>{$node->hierarchy}: {$node->menutext}

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

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


{else}
url}"{if $node->accesskey != ''} accesskey="{$node->accesskey}"{/if}{if $node->tabindex != ''} tabindex="{$node->tabindex}"{/if}{if $node->titleattribute != ''} title="{$node->titleattribute}"{/if}{if $node->target != ''} target="{$node->target}"{/if}>{$node->hierarchy}: {$node->menutext}

{/if}

{/foreach}
{repeat string="" times=$node->depth-1}

{/if}
UNTESTED  :)
- Bisogna controllare se $node->depth == 0 o 1 (c'è Home o no ...)
- in CSS add:
.nome_alias_della_pagina {background-color: #il_colore_scelto_della_sezione}


Non ho capito se anche i sottomenu sono colorati ...

Alby
Alby, ho provato la soluzione che mi hai suggerito; ho fatto così:
- ho importato simple_navigation.tpl nel database con MenuManager, ho creato un nuovo menu e a questo ho inserito le modifiche suddette;
- ho inserito la chiamata al menu nel template di pagina con la sintassi {menu template='nome_nuovo_menu' number_of_levels='2' excludeprefix='home'};
- ho associato lo stile del menu (che ha due livelli) e dentro a questo, per fare una prova, ho inserito

div#menu_horiz li.alias_della_pagina li a:hover {
background:#f00;
color:#000;
}

Fatto tutto ciò, comunque non vedo nessun colore rosso al passaggio del mouse sulle voci di menu di secondo livello...
Dove ho sbaglaito?

1dMN
alby

Re: Personalizzazione menu (liste)

Post by alby »

1dMN wrote: - ho associato lo stile del menu (che ha due livelli) e dentro a questo, per fare una prova, ho inserito

div#menu_horiz li.alias_della_pagina li a:hover {
background:#f00;
color:#000;
}

Fatto tutto ciò, comunque non vedo nessun colore rosso al passaggio del mouse sulle voci di menu di secondo livello...
;D
Devi inserire:
div#menu_horiz li.chi-siamo li a:hover {
background:#f00;
color:#000;
}

div#menu_horiz li.dove-siamo li a:hover {
background:#0f0;
color:#000;
}

div#menu_horiz li.cosa-facciamo li a:hover {
background:#00f;
color:#000;
}

Alby
1dMN
Forum Members
Forum Members
Posts: 29
Joined: Mon Jan 28, 2008 8:30 am

Re: Personalizzazione menu (liste)

Post by 1dMN »

alby wrote:
1dMN wrote: - ho associato lo stile del menu (che ha due livelli) e dentro a questo, per fare una prova, ho inserito

div#menu_horiz li.alias_della_pagina li a:hover {
background:#f00;
color:#000;
}

Fatto tutto ciò, comunque non vedo nessun colore rosso al passaggio del mouse sulle voci di menu di secondo livello...
;D
Devi inserire:
div#menu_horiz li.chi-siamo li a:hover {
background:#f00;
color:#000;
}

div#menu_horiz li.dove-siamo li a:hover {
background:#0f0;
color:#000;
}

div#menu_horiz li.cosa-facciamo li a:hover {
background:#00f;
color:#000;
}

Alby
E' proprio quello che ho fatto... alias_della_pagina è sostitutivo del vero alias della pagina di primo livello cui fa riferimento lo stile associato. Guardando il codice html della pagina home, però, appare:


Navigation

2: Chi siamo

2.1: Profilo
2.2: Mission
2.2: Obiettivi

3: Dove siamo
4: Cosa facciamo


Sembra che non gliene freghi niente...  ???

1dMN
alby

Re: Personalizzazione menu (liste)

Post by alby »

1dMN wrote: Sembra che non gliene freghi niente...  ???
ok, devi fare il check di $node->depth (non so come è fatta la tua struttura).
All'interno del ciclo (dopo il foreach) inserisci:
{$node|print_r}

questo stampa tutte le variabili di ogni menu. Gurada il valore di [depth] per i tuoi alias e sostituisci il valore 0 in:
{if $node->depth == 0}

Alby
1dMN
Forum Members
Forum Members
Posts: 29
Joined: Mon Jan 28, 2008 8:30 am

Re: Personalizzazione menu (liste)

Post by 1dMN »

alby wrote: ok, devi fare il check di $node->depth (non so come è fatta la tua struttura).
All'interno del ciclo (dopo il foreach) inserisci:
{$node|print_r}

questo stampa tutte le variabili di ogni menu. Gurada il valore di [depth] per i tuoi alias e sostituisci il valore 0 in:
{if $node->depth == 0}

Alby
Rieccomi qua.
Inserisco qui sotto l'esploso del codice html ottenuto con print_r:


Navigation



stdClass Object
(
    [id] => 1
    [url] => index.php?p=chi-siamo
    [accesskey] =>
    [type] => content
    [tabindex] =>
    [titleattribute] =>
    [hierarchy] => 2
    [depth] => 1
    [prevdepth] => 1
    [haschildren] => 1
    [menutext] => Chi siamo
    [target] =>
    [index] => 0
    [alias] => chi-siamo
    [parent] =>
    [current] =>
)
1

2: Chi siamo


stdClass Object
(
    [id] => 2
    [url] => index.php?p=profilo
    [accesskey] =>
    [type] => content
    [tabindex] =>
    [titleattribute] =>
    [hierarchy] => 2.1
    [depth] => 2
    [prevdepth] => 1
    [haschildren] =>
    [menutext] => Profilo
    [target] =>
    [index] => 2
    [alias] => profilo
    [parent] =>
    [current] =>
)
1

2.1: Profilo

stdClass Object
(
    [id] => 3
    [url] => index.php?p=mission
    [accesskey] =>
    [type] => content
    [tabindex] =>
    [titleattribute] =>
    [hierarchy] => 2.2
    [depth] => 2
    [prevdepth] => 2
    [haschildren] =>
    [menutext] => Mission
    [target] =>
    [index] => 3
    [alias] => mission
    [parent] =>
    [current] =>
)
1

2.2: Mission

stdClass Object
(
    [id] => 4
    [url] => index.php?p=obiettivi
    [accesskey] =>
    [type] => content
    [tabindex] =>
    [titleattribute] =>
    [hierarchy] => 2.3
    [depth] => 2
    [prevdepth] => 2
    [haschildren] =>
    [menutext] => Obiettivi
    [target] =>
    [index] => 4
    [alias] => obiettivi
    [parent] =>
    [current] =>
)
1

2.2: Obiettivi


stdClass Object
(
    [id] => 5
    [url] => index.php?p=dove-siamo
    [accesskey] =>
    [type] => content
    [tabindex] =>
    [titleattribute] =>
    [hierarchy] => 3
    [depth] => 1
    [prevdepth] => 2
    [haschildren] =>
    [menutext] => Dove siamo
    [target] =>
    [index] => 5
    [alias] => dove-siamo
    [parent] =>
    [current] =>
)
1

3: Dove siamo

stdClass Object
(
    [id] => 6
    [url] => index.php?p=cosa-facciamo
    [accesskey] =>
    [type] => content
    [tabindex] =>
    [titleattribute] =>
    [hierarchy] => 4
    [depth] => 1
    [prevdepth] => 1
    [haschildren] =>
    [menutext] => Cosa facciamo
    [target] =>
    [index] => 6
    [alias] => cosa-facciamo
    [parent] =>
    [current] =>
)
1

4: Cosa facciamo


Ora, fermo restando il fatto che qualcosa ho sbagliato, non capisco come sostituire il valore 0 in {if $node->depth == 0} il valore di [depth] per gli alias...

Sempre grato per il tuo aiuto  :P
1dMN
alby

Re: Personalizzazione menu (liste)

Post by alby »

1dMN wrote: Ora, fermo restando il fatto che qualcosa ho sbagliato, non capisco come sostituire il valore 0 in {if $node->depth == 0} il valore di [depth] per gli alias...
Per quello che vedo, mi pare di capire che vioi colorare tutti i menu con [depth] => 1

In questo caso basta che nel codice inserisci {if $node->depth == 1}

Alby
1dMN
Forum Members
Forum Members
Posts: 29
Joined: Mon Jan 28, 2008 8:30 am

Re: Personalizzazione menu (liste)

Post by 1dMN »

alby wrote: Per quello che vedo, mi pare di capire che vioi colorare tutti i menu con [depth] => 1

In questo caso basta che nel codice inserisci {if $node->depth == 1}

Alby
GRANDEEEE!!! Sei meglio di Wolf, che risolve i problemi (cit.) ;D

Ora, ahimè, ho un altro quesito: una volta che seleziono uno dei menu con depth = 1, come faccio a mantenere il background che c'è sull'a:hover anche quando la voce selezionata diventa currentpage?

Ho provato, nel tpl del menu, ad inserire:

{if $node->current == true}
Current page is {$node->hierarchy}: {$node->menutext}

però non sortisce l'effetto sperato... :(
Un aiutino?  ::)

1dMN
alby

Re: Personalizzazione menu (liste)

Post by alby »

1dMN wrote: Ho provato, nel tpl del menu, ad inserire:

{if $node->current == true}
Current page is {$node->hierarchy}: {$node->menutext}

però non sortisce l'effetto sperato... :(
Un aiutino?  ::)
Fai un check del sorgente e ..... cosa c'è nello stile del .currentpage:)

Alby
1dMN
Forum Members
Forum Members
Posts: 29
Joined: Mon Jan 28, 2008 8:30 am

Re: Personalizzazione menu (liste)

Post by 1dMN »

alby wrote:
1dMN wrote: Ho provato, nel tpl del menu, ad inserire:

{if $node->current == true}
Current page is {$node->hierarchy}: {$node->menutext}

però non sortisce l'effetto sperato... :(
Un aiutino?  ::)
Fai un check del sorgente e ..... cosa c'è nello stile del .currentpage:)

Alby
Ciao Alby, rieccomi (tra lavoro in ufficio e visite clienti non so dove sbattere la testa!).
Dunque, credo di aver risolto, cioè, funziona come voglio quindi è ok  ;)
Questo il menu che ho personalizzato:

{if $count > 0}

{foreach from=$nodelist item=node}

{* $node|print_r *}

{assign var="csssection" value=''}
{if $node->depth == 1}{assign var="sezionesito" value=$node->alias}{/if}


{if $node->depth > $node->prevdepth}
{repeat string="" times=$node->depth-$node->prevdepth}
{elseif $node->depth prevdepth}
{repeat string="" times=$node->prevdepth-$node->depth}

{elseif $node->index > 0}
{/if}

{if $node->current == true}
Current page is {$node->hierarchy}: {$node->menutext}

{elseif $node->parent == true}
url}"{if $node->accesskey != ''} accesskey="{$node->accesskey}"{/if}{if $node->tabindex != ''} tabindex="{$node->tabindex}"{/if}{if $node->titleattribute != ''} title="{$node->titleattribute}"{/if}>{$node->hierarchy}: {$node->menutext}

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

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


{else}
url}"{if $node->accesskey != ''} accesskey="{$node->accesskey}"{/if}{if $node->tabindex != ''} tabindex="{$node->tabindex}"{/if}{if $node->titleattribute != ''} title="{$node->titleattribute}"{/if}{if $node->target != ''} target="{$node->target}"{/if}>{$node->hierarchy}: {$node->menutext}

{/if}

{/foreach}
{repeat string="" times=$node->depth-1}

{/if}


Ora, nelle sezioni interne vorrei utilizzare un template a due colonne con e {menu template='simple_navigation.tpl'}, dove le voci figlie di Chi Siamo, ad esempio, saranno Profilo - Mission - Obiettivi.
C'è modo di mantenere sopra il menu verticale la voce di menu padre di riferimento, che fa però parte del menu orizzontale?

Mi spiego... "a gesti"
Menu orizzontale:
1. Chi siamo 2. Dove siamo 3. Cosa Facciamo

Sottomenu verticale:
1. Chi siamo
1.1 Profilo
1.2 Mission
1.3 Obiettivi

Io speriamo che me la cavo  :P

1dMN
Post Reply

Return to “Italian - Italiano”