Personalizzazione menu

[Cesare_gzz]

Ciao a tutti.

Se creo un menu in joomla 1.7, posso personalizzare il suo aspetto definendo una classe specifica a livello di singole voci (campo Suffisso classe menu nelle opzioni del modulo) o a livello di modulo (campo Suffisso classe CSS modulo nelle opzioni del modulo) e modificando quindi i .css corrispondenti.

Se inserisco un'immagine nella voce di menu, posso personalizzare la spazio tra le immagini delle diverse voci, e la posizione del testo associato alla voce di menu rispetto all'immagine, definendo delle classi specifiche ?  Sarebbe anche utile un esempio del codice css da inserire.

Grazie
saluti

[adottauncane]

Ciao Cesare_gzz,
probabilmente sì, hai un link al sito?

[Cesare_gzz]

Il link è http://montealto.altervista.org/joomla/index.php su Joomla 1.7.

In homepage, sulla destra (la posizione è temporanea), ci sono due esempi: Imagemu (creato con il modulo Imagemnu) e Menu12 (menù standard joomla con immagini).

Per entrambi vorrei:

• poter modificare la spaziatura delle immagini (per Imagemenu è prevista un'opzione di configurazione, ma non funziona),
• visualizzazare il testo associato all'opzione sulla destra (in Imagemenu l'immagine si sovrappone al testo)
• modifiicare la posizione del testo rispetto all'iimmagine (centrato, spaziatura).

Grazie.

[adottauncane]

Per il menù12 aggiugi questo css al file css del template: (magari in personal.css)

Codice: [Seleziona]

.menu_mantum1 img{
display:block;
margin:auto;
margin-top:10px
}

.item-126, .item-125 {
text-align:center;
line-height: 30px;
}
Ogni item che aggiungi lo metti anche nel css

Per quello sopra invece non ho capito... Non vedo testi...

[Cesare_gzz]

Ti ringrazio per la risposta.

Ho provato, ma l'effetto non è quello che voluto: il testo dovrebbe essere a destra dell'immagine e centrato rispetto al lato verticale della stessa. Inoltre, spostando il menu al centro compainiono due quadratini in corrispondenza di ogni voce di menu, che evidentemente sono legati alla posizione, ma non sono riuscito a capire come eliminarli.

Per quanto riguarda Imagemenu, in effetti il testo dell'opzione è nascosto dall'immagine (se nel menu non metto le immagini si vede) e l'effetto che vorrei ottenere è esattamente lo stesso, ma in questo caso c'è un modulo esterno che regola la formattazione.

Chiaramente c'è sempre la possibilità che stia chiedendo qualcosa di impossibile da realizzare, nel qual caso ci rinuncio.

Grazie
saluti

[adottauncane]

Ma... impossibile no ma un tantino ingarbugliato.
Per quello dallo sfondo rosso:

Codice: [Seleziona]

.menu_mantum1 img{
margin-right:10px;
margin-top:10px;

}


.image-title {
position:absolute !important;
margin-top: 35px;
}



.item-125, .item-126 {
    list-style-type: none !important;
}


#top a:hover {
    background: none !important;
}
Ogni nuova voce dovrai aggiungere il suo item, per l'altro ci guardo...

[Cesare_gzz]

Ok grazie, il risultato è quello voluto, anche se per ora rinuncio a capire tutto quello hai fatto.

Sono anche intervenuto per migliorare l'effetto hover, ma non immaginavo si potesse far riferimento direttamente ad elementi interni al modulo menu (item-125, item-126) in quanto creati in automatico, ammesso che questa non sia una forzatura da evitare.

Ti ringrazio e spero tu riesca a trovare una soluzione anche per Menuimage.

Saluti.


 

[adottauncane]

No, non riesco a capire come è fatto...
E no non è un problema inserire nel css il riferimento agli item, è solo noioso perché vanno aggiunti a mano quando ne crei uno nuovo.