[RISOLTO] Customizzazione menu

[ezio81]

Ciao a tutti!
Sto muovendo i primi passi con Joomla, vi leggo da un po' in forma anonima e ho già trovato tantissime dritte, ma oggi in preda ad un problema ho deciso di venire allo scoperto

Vorrei creare un menu che ha lo stesso stile di un altro menu (nello specifico "Latest news"), ma proprio non ci riesco. Tutto quello che riesco a fare è ottenere lo stile "Main menu" ma, nella posizione in cui si trova, non mi ci sta proprio...

Vi ringrazio in anticipo!

[adottauncane]

Ciao ezio81,
benvenuto nel forum 
serve un link al sito per vedere il problema. Guarda anche che suffisso classe modulo c'è nel menù che vuoi copiare.

[ezio81]

Ciao adottauncane,
per adesso purtroppo il sito è in locale... ma si basa su questo template che ti linko di seguito:
http://demo.joomladesigns.co.uk/joomla/?template=thegreat

Ho guardato nel file template.css, di fatto queste sono le caratteristiche del menu dal quale vorrei partire:

Codice: [Seleziona]

/* Custom Modules */
.latestnews, .mostread { list-style: none; padding: 1px 2px; margin: 0px; text-align: left; background: none; }
li.latestnews, li.mostread { list-style: none; padding: 0px 0px; margin: 0px; background: none;}
li.latestnews a, li.mostread a { text-transform: none; text-decoration: none; text-align: left; padding-left: 15px; line-height: 18px; color: #ffffff; background: transparent url(../images/arrow.gif) no-repeat left;}
li.latestnews a:hover, li.mostread a:hover { text-decoration: none; background: transparent url(../images/arrow2.gif) no-repeat left; color: #f18e00;}
Ho trovato in questo forum un po' di thread che riguardano gli stili dei menu, ma non esattamente questo argomento...

Grazie!

[ezio81]

Scusate il doppio post, mi sono accorto che forse è più chiaro se incollo il sorgente dei due menu (sono vicini nel mio template, prima il Latest News e poi quello che vorrei modificare):

Codice: [Seleziona]

<li class="latestnews"> <a href="/Joomla1523/index.php?option=com_content&amp;view=article&amp;id=47%3Achisiamo&amp;catid=35%3Apresentazione&amp;Itemid=27&amp;lang=it" class="latestnews"> Chi siamo</a> </li> <li class="latestnews"> <a href="/Joomla1523/index.php?option=com_content&amp;view=article&amp;id=22%3Aazienda&amp;catid=35%3Apresentazione&amp;Itemid=34&amp;lang=it" class="latestnews"> L'azienda</a> </li> <li class="latestnews"> <a href="/Joomla1523/index.php?option=com_content&amp;view=article&amp;id=24%3Acontent-layouts&amp;catid=29%3Athe-cms&amp;Itemid=38&amp;lang=it" class="latestnews"> Content Layouts</a> </li> <li class="latestnews"> <a href="/Joomla1523/index.php?option=com_content&amp;view=article&amp;id=27%3Athe-joomla-community&amp;catid=30%3Athe-community&amp;lang=it" class="latestnews"> The Joomla! Community</a> </li> <li class="latestnews"> <a href="/Joomla1523/index.php?option=com_content&amp;view=article&amp;id=1%3Awelcome-to-joomla&amp;catid=1%3Alatest-news&amp;lang=it" class="latestnews"> Welcome to Joomla!</a> </li> </ul> </div> </div> <div class="bot-module"> <div class="moduletable"> <ul class="menu"><li class="item56"><a href="/Joomla1523/index.php?option=com_content&amp;view=category&amp;id=39&amp;Itemid=56&amp;lang=it"><span>Mappa del sito</span></a></li><li class="item57"><a href="/Joomla1523/index.php?option=com_content&amp;view=category&amp;id=36&amp;Itemid=57&amp;lang=it"><span>Termini di utilizzo</span></a></li><li class="item58"><a href="/Joomla1523/index.php?option=com_content&amp;view=category&amp;id=37&amp;Itemid=58&amp;lang=it"><span>Privacy policy</span></a></li><li class="item59"><a href="/Joomla1523/index.php?option=com_content&amp;view=category&amp;id=38&amp;Itemid=59&amp;lang=it"><span>Mandaci un feedback</span></a></li></ul> </div>

[kuvier00]

E' proprio quello stile che devi applicare al nuovo menu, in teoria deve funzionare.
Il problema è che senza link al sito non si può fare molto...perchè non lo carichi su uno spazio gratuito (altervista, netsons o altri) ?

[ezio81]

Grazie kuvier00, mi conforta sapere che in teoria dovrebbe essere così.
Sto provando a fare un upload del sito, vediamo cosa combino!


(forza, Altervista, forza.... sei lenta quasi come la velocità della luce )

[ezio81]

Eccoci qua: ho temporaneamente messo il sito su questo spazio:
http://giuz.altervista.org/

Il menu che vorrei modificare è in posizione user8, mentre le Latest News sono in posizione user1.

Grazie!

[kuvier00]

Metti un suffisso CSS al menu in posizione user8, poi applichi anche a questo lo stile dell'altro menu, per esempio prima era:

Codice: [Seleziona]

li.latestnews a, li.mostread a {
text-transform: none;
text-decoration: none;
text-align: left;
padding-left: 15px;
line-height: 18px;
color: #ffffff;
background: transparent url(../images/arrow.gif) no-repeat left;
}

Poi diventerà:

Codice: [Seleziona]

li.latestnews a, li.mostread a, .TUO_SUFFISSO_CSS li a {
text-transform: none;
text-decoration: none;
text-align: left;
padding-left: 15px;
line-height: 18px;
color: #ffffff;
background: transparent url(../images/arrow.gif) no-repeat left;
}

Lo ripeti naturalmente per tutte le regole interessate

[ezio81]

Grazie mille kuvier00.
Se non ho capito male l'unico file da toccare è template.css vero? Mentre, da pannello di controllo del modulo in posizione user8, devo aggiungere il suffisso custom sotto la voce "Suffisso classe CSS menu" nei Parametri avanzati.
Giusto?

[kuvier00]

Yes Sir

[adottauncane]

@kuvier00 sicuro che funzioni così? Non l'ho mai visto... Ma se funziona...

[kuvier00]

@kuvier00 sicuro che funzioni così? Non l'ho mai visto... Ma se funziona...

Bisogna solo associare quello stile al nuovo menu, il quale è fatto lo stesso a lista (ul,li,a).
Deve funzionare!! (credo...) 

[adottauncane]

mmmmm, che si possa usare il Suffisso classe CSS menù è giusto ma non credo che come l'hai messo tu funzioni...

http://www.joomla.it/articoli-della-community-16/5033-piccola-guida-alluso-del-suffisso-classe-css-menu.html

[kuvier00]

Quello stile è applicato a dei link dentro una lista non ordinata (ul > li > a), esattamente come un menu. Che differenza fa se lo si applica con o senza suffisso css?
A prescindere dal suffisso, tramite i css lo puoi applicare dove vuoi. Deve funzionare!

[adottauncane]

Certo, se associ a quel modulo un suo div. E riscrivi tutto. L'applicazione del suffisso è solo più comoda. Ma come l'hai scritto tu non funziona. Tu hai preso il css di quello che vorrebbe fosse il css da applicare è hai aggiunto .TUO_SUFFISSO_CSS li a. Secondo me non sortisce alcun effetto. Ma non c'è che provare, puoi farlo anche con firebug, metti il suffisso e incolli il css che hai scritto.

[ezio81]

Eccomi, dunque modificando il mio menu in user8 con l'aggiunta del suffisso, e facendo la modifica che mi ha indicato kuvier00 ho ottenuto quello che vedete qui:
http://giuz.altervista.org

Mi verrebbe da dire "fuochino" nel senso che ora user8 è cambiato, ma non ha le stesse proprietà di quello affianco... forse c'è da sistemare qualche altra regola.

Comunque grazie a tutti e due! Adesso vedo cos'altro c'è da cambiare.

[kuvier00]

In effetti mi ero dimenticato una cosa, bisogna naturalmente prima disabilitare lo stile precedente
Poi funziona, l'ho provato ora.

[ezio81]

bisogna naturalmente prima disabilitare lo stile precedente
Poi funziona, l'ho provato ora.

Grazie, ma forse non sono in grado, potresti spiegarmi meglio per favore? Dovrei disabilitare lo stile del menu di partenza che c'era in user8 o quello di "Latest News"?

[kuvier00]

Eccomi, dunque modificando il mio menu in user8 con l'aggiunta del suffisso, e facendo la modifica che mi ha indicato kuvier00 ho ottenuto quello che vedete qui:
http://giuz.altervista.org

Mi verrebbe da dire "fuochino" nel senso che ora user8 è cambiato, ma non ha le stesse proprietà di quello affianco... forse c'è da sistemare qualche altra regola.

Comunque grazie a tutti e due! Adesso vedo cos'altro c'è da cambiare.

Non è una buona idea mettere un punto come suffisso css di un modulo (la classe ora è menu.ezio), mettici un underscore "_". E poi applicalo come ti ho detto su, anche alla parte di hover.

[ezio81]

Ho seguito il tuo consiglio, ora il suffisso è _ezio. Grazie.

Solo mi manca la parte che dicevi prima, ovvero "disabilitare lo stile precedente", non mi è ben chiaro a quale stile ti riferisci.