Nuovi articoli: Xiaomi Redmi Note 11

Nuovi articoli: VirtualBox - Error In supR3HardenedWinReSpawn

Nuovi articoli: Windows - Disabilitare "Fast boot" o Avvio rapido

Nuovi articoli: JComments for Joomla! 4

Nuovi articoli: Joomla 4 - Come creare un file CSS personalizzato con Cassiopeia

avatar cassiopeiaNel passato avevo già dedicato un articolo su come personalizzare i template di Joomla! aggiungendo il file custom.css. Benché non sia molto differente, l'approccio in tal senso con il nuovo template Cassiopeia è leggermente differente.

Potrebbe interessarti

Joomla! - Personalizzare il Template: CSS

Intanto, quando si utilizza il template Cassiopeia, il file CSS destinato a contenere le direttive definite dall'utente viene spesso chiamato file "user.css" invece di "custom.css" come in molti altri template.

Inoltre, non sarà necessario modificare il file index.php del template perché questo lo includa. Sarà solo necessario crearlo dalla apposita sezione dedicata alla personalizzazione del template in Joomla! 4.

E' vero che si può evitare questi passaggi e apportare modifiche direttamente ai file CSS di Cassiopeia. Tuttavia se lo fate riscontrerete come durante il processo di aggiornamento di Joomla questi file CSS saranno sovrascritti. Per evitare questa situazione e vedere andare in fumo le tue modifiche, è indispensabile generare un file CSS personalizzato.

Grazie al file user.css che andremo ad aggiungere a Cassiopeia, non dovrai più temere che le tue modifiche svaniscano ad ogni aggiornamento.

Ma vediamo nella pratica come creare un CSS personalizzato nel template Cassiopeia.

Il modo per creare CSS personalizzati con Cassiopea in Joomla! 4

Prima di tutto, accediamo alla dashboard amministrativa di Joomla!. Successivamente, andiamo su Sistema > Template del sito (nella sezione Template).

template del sito

Apriamo il template Cassiopeia o il suo child template se ne stiamo facendo uso. Facciamo dunque click sul link "Dettagli e file di..." corrispondente al template in uso.

template: dettagli e file

Quindi, nella barra degli strumenti, clicchiamo sul pulsante "Nuovo file".

nuovo file

Apparirà una piccola finestra da compilare.

crea nuovo file

A sinistra di essa, nella rappresentazione ad albero delle cartelle del template, selezioniamo la directory "css".

A destra nella casella "Nome file", scriviamo "user".

Subito sotto, nella casella "Tipo di file" dal menu a tendina, scegliamo ".css"

Infine per confermare la creazione del nuovo file, clicchiamo sul pulsante "Crea".

A questo punto, Joomla! ha già generato il file user.css rimandandoci alla scheda "Editore" in modalità modifica del file appena creato.

Da ora in poi, ogni volta che avremo necessità di modificarlo, basterà tornare alla schermata "Editore" sotto templates/cassiopeia/css/user.css (fino alla versione 4.0.x di Joomla! 4).

editore nuovo file

Se il tuo sito Joomla è già stato aggiornato alla versione 4.1.x, il file user.css sarà nella cartella /media/templates/site/cassiopeia/css.

Una volta selezionato, il contenuto del file sarà visibile ed editabile nella parte destra della finestra. Una volta finita la modifica del file, per salvarlo, sarà sufficiente cliccare in alto a sinistra su "Salva" o "Salva e Chiudi"

In conclusione, con questo semplice tutorial, potrai creare e modificare facilmente file CSS personalizzati nel template Cassiopeia in Joomla! 4. Se hai qualche difficoltà o qualche domanda, non esitare a chiedere aiuto lasciando il tuo commento qui sotto.

Se hai gradito l'articolo, condividilo, basta un click:
Aggiungi commento
I commenti lasciati dagli utenti del blog sono sempre soggetti a controllo prima di eventuale pubblicazione. I commenti non considerati adatti per contenuti, spam o forma saranno eliminati e non pubblicati. Leggi i Termini e Condizioni di utilizzo per maggiori informazioni.


Iscriviti alla Newsletter!

Abilita il javascript per inviare questo modulo