Se le impostazioni del design non bastano, puoi aggiungere CSS e HTML personalizzati al tuo sito web. A seconda di ciò che il codice deve fare, ci sono quattro posti in cui inserirlo. Tutti sono disponibili in ogni pacchetto.
Dove va il tuo codice
- Foglio di stile personalizzato per tutto il sito web: Impostazioni → Area dell’intestazione, sezione Foglio di stile CSS aggiuntivo personalizzato. Le tue regole CSS si applicano a ogni pagina e anche al layout mobile.
- Codice nell’area head: Impostazioni → Area dell’intestazione, sezione Codice HTML aggiuntivo personalizzato (tra <head> e </head>). Questo è il posto per i tag
<style>e<link>, meta tag aggiuntivi o web font. - HTML all’inizio o alla fine di ogni pagina: Impostazioni → Generale, sezione Tutto il sito, campi Inizio di ogni pagina e Fine di ogni pagina. Adatto a codici contatore e snippet simili che devono comparire su ogni pagina.
- Codice all’interno di una singola pagina: nell’editor dei contenuti tramite Aggiungi blocco → Speciale → HTML incorporato, ad esempio per una mappa, un widget o il codice di incorporamento di un video. L’Editor HTML nella barra degli strumenti ti permette inoltre di modificare direttamente l’HTML del contenuto della pagina.
Aggiungere il tuo foglio di stile
- Scrivi le tue regole CSS in un editor di testo e salva il file con l’estensione
.css. - Carica il file sotto File → Carica file (vedi Caricare file). I file CSS appartengono alla cartella per i file di codice; Selezione automatica della cartella li mette lì.
- Apri Impostazioni → Area dell’intestazione e scegli il file sotto Foglio di stile CSS aggiuntivo personalizzato nel campo URL (del file .css):.
- Fai clic su Salva e ricarica il tuo sito web.
Se ti servono solo poche regole, puoi invece inserirle nel campo Codice HTML sotto Codice HTML aggiuntivo personalizzato (tra <head> e </head>) all’interno di un tag <style>...</style>.
Incorporare codice in una pagina
- Apri la pagina sotto Pagine → Gestisci pagine → Modifica contenuto della pagina.
- Fai clic su Aggiungi blocco (oppure su Aggiungi elemento dopo su un elemento esistente), apri la scheda Speciale e scegli HTML incorporato.
- Incolla il codice e salva la pagina.
Buono a sapersi
- Le tue modifiche sono subito online; non esiste una versione di prova separata del tuo sito web.
- Il CSS personalizzato si applica anche al layout mobile. Evita larghezze fisse e usa
max-width: 100%in modo che i tuoi elementi si adattino agli schermi piccoli (vedi Siti web ottimizzati per dispositivi mobili). - I file HTML completi (
.htm,.html) possono essere caricati solo con il pacchetto Premium. Per le basi dell’HTML vedi Che cos’è l’HTML?.