Questo tutorial vi guiderà all'inclusione del codice CSS personalizzato nel Template di Joomla scaricato sul sito.
Perché aggiungere il codice CSS personalizzato al modello
- Avete scaricato un modulo o un'estensione di terze parti e l'avete installata sul vostro sito web. Sul modulo o l'estensione potrebbero essere necessari alcuni cambiamenti personalizzati per adattarlo allo stile generale del Template e visualizzarlo correttamente sui diversi browser.
- È più facile gestire e aggiornare un file CSS con qualsiasi modifica personalizzata che è stata scritta o per aggiungerne di nuove in futuro.
- Quando aggiornerete Joomla non perderete nessuno dei cambiamenti personalizzati che avete fatto.
Come creo un file CSS personalizzato
- Aprite il notepad.exe installato nel computer (consiglio Notepad++ scaricabile qui) ed eseguite "Salva con Nome" denominandolo custom.css
- Salvate il file CSS in una posizione del computer
- Aprite il file custom.css appena creato usando il notepad.exe e includete il codice CSS che avete scritto per l'estensione o modulo di terze parti
- Salvate le modifiche al file
Come applicare le modifiche al modello
Nota: modificate la / template-name / directory indicata in questo articolo con il nome del Template su cui operate.
- Aprire il software FTP installato nel computer (consiglio Filezilla scaricabile qui) e recatevi su / templates / template-name / css / directory
- Caricarte il file custom.css creato in / templates / template-name / css / directory
- Sfogliarte la radice della directory / templates / template-name / e scaricate il file index.php nel computer
- Prima di apportare modifiche al file index.php effettuare un backup del file come prima cosa
- Dopo aver eseguito il backup del file apritelo utilizzando notepad.exe (o Noteoad++)
- Cercate questo codice: </ head>
- Fate "Copia e incolla" del codice scritto al punto 8 nel file index.php in modo che appaia appena prima del tag </ head>
- <link rel=”stylesheet” type=”text/css” href=”<?php echo $this->baseurl ?>/templates/<?php echo $this->template; ?>/css/custom.css” />
- Il codice di cui sopra richiamerà il file custom.css ogni volta che il Template viene caricato nel vostro sito e applica le modifiche di stile personalizzate all'estensione o al modulo di terze parti.
- Una volta aggiornato il file index.php salvate le modifiche
- Caricate il file index.php aggiornato utilizzando il software FTP nella directory principale: / templates / template-name / directory
Ora avete completato tutti i passaggi necessari per creare e applicare stili CSS personalizzati al Template.