Cambiare le impostazioni CSS di una sola pagina in Joomla!

Come fare per cambiare la grafica di una o alcune pagine in Joomla!, senza stravolgere il template o dannarsi l’anima.

In Joomla! la definizione dello stile del sito avviene attraverso uno o più file CSS che vengono richiamati per tutte le pagine del sito allo stesso modo.

Può succedere che però si voglia assegnare ad un articolo particolare - ad esempio uno sfondo diverso dal solito.
Oppure si vuole inserire una regola CSS particolare solo per alcuni articoli. Come fare?

E’ possibile creare un modulo che richiami alcune regole CSS solo in talune circostanze. Vediamo come fare.

Creo un modulo di tipo Custom XHTML. Lo associo alla voce di menu che mi interessa (posso creare un menu invisibile con gli articoli che mi interessa modificare)

Indicare la posizione del modulo. E’ importante che nessun altro modulo abbia la stessa posizione di questo. Nel caso, creare una nuova posizione.

Inserire in Custom Output il codice CSS che vogliamo cambiare, ricordandoci di inserirlo in modalità HTML.

Ad esempio

#main div {
background-color: white;
}

Inserire nel template la direttiva

<style>
<jdoc:include type=”modules” name=”header” />
</style>

appena prima del tag </head>, o perlomeno dopo che vengono richiamati i file CSS.

In questo modo quando si accede alla pagina indicata verrà richiamato il codice CSS specifico. Se si desiderano inserire molte regole CSS, è opportuno richiamare un file CSS esterno, sempre utilizzando lo stesso metodo.

Provare per credere ;-)

Condividi questo post: These icons link to social bookmarking sites where readers can share and discover new web pages.
  • Digg
  • del.icio.us
  • StumbleUpon
Tags: , , , ,
Articoli correlati:

2 Commenti al post “Cambiare le impostazioni CSS di una sola pagina in Joomla!”

  1. toni Says:

    Ma è una soluzione semplicemente geniale!
    Molto ma molto più comoda che assegnare un template diverso!
    Bravo!

  2. Copes Flavio Says:

    @toni: bene, sono contento che hai risolto il tuo problema :)

Lascia un commento

Nome (obbligatorio)

Mail (non sarà pubblicata) (obbligatoria)

Sito web