Modificare il codice (fonte / CSS) su Site Creator

Questa guida spiega come personalizzare il codice sorgente, modificare il CSS, modificare la parte HEAD o BODY di un sito Web realizzato con Sito Creator Infomaniak.

Prerequisiti

• Vai a Site Creator:
  1. Clicca qui per accedere alla gestione del prodotto sul Manager Infomaniak (Hai bisogno di aiuto?).
  2. Clicca direttamente sul nomeattribuito al prodotto in questione.
  3. Clicca su Personalizza il mio sito:
     

Aggiungi codice personalizzato

Una volta in Site Creator:

1. Clicca su Design nel menu laterale sinistro.
2. Clicca su Niente più parametri.
3. Clicca su Codice personalizzato in basso:
   
4. Inserisci codice HTML, JavaScript (con i suoi tag script) o CSS personalizzato (con i suoi tag stile) - leggere più in basso per alcuni esempi.
5. Salva modifiche in fondo alla pagina.

Metadati in HEAD & BODY

Per aggiungere codice JavaScript o qualsiasi altro codice nella parte HEAD oppure BODY Il codice sorgente del tuo sito:

1. Clicca su Impostazioni nel menu laterale sinistro.
2. Clicca su SEO & Metadati nella parte Configurazione del sito web.
3. Scendete fino a Codice personalizzato.
4. Scegli di aggiungere sotto le schede HEAD o sotto BODY.
5. Salvare le modifiche in fondo alla pagina:
   

Esempi di personalizzazione CSS

Questi esempi consentono di avviare la personalizzazione avanzata delle pagine del sito web. Tuttavia, esiste un rischio in base alle modifiche apportate di non essere più in grado di accedere all'editor stesso, il che ti costringerà a ricominciare da zero.

Personalizza lo sfondo del sito web

Per inserire l'immagine di vostra scelta (da caricare nella libreria di file) in fondo alla pagina e personalizzarne la visualizzazione:

1. Vai al punto 3 visibile nella prima immagine nella parte superiore di questa guida.
2. Inserisci il codice <style> per indicare che si desidera modificare il codice CSS,
3. e poi body { per indicare che si desidera modificare il corpo della pagina e il "{"per aprire lo spazio che permette di inserire i comandi,
4. e poi background-image: url("../data/files/fond01.jpg"); con il percorso & nome esatto dell'immagine caricata nella libreria senza dimenticare il punto virgola per poter inserire il comando successivo.
5. background-repeat: repeat; per ripetere l'immagine inserita.
6. background-attachment: fixed; in modo che l'immagine di sfondo rimanga fissa anche se il visitatore scorre verso il basso o verso l'alto per leggere il suo contenuto.
7. } per chiudere lo spazio di inserimento aperto in precedenza.
8. </style> per indicare che il codice termina qui.

Spazza le lettere di tutti i link del sito

Per scartare (molti) le lettere tra loro sulle parole cliccabili (link):

1. Vai al punto 3 visibile nella prima immagine nella parte superiore di questa guida.
2. Inserisci il codice (se non ancora presente) <style> per indicare che si desidera modificare il codice CSS,
3. e poi .container div a { per indicare che si desidera modificare i blocchi della pagina e in particolare i collegamenti ("a") e il "{"per aprire lo spazio che permette di inserire i comandi,
4. e poi letter-spacing:1em;diminuendo il valore (0.9em p.ex) senza dimenticare il punto virgola per poter inserire il comando successivo o terminare.
5. } per chiudere lo spazio di inserimento aperto in precedenza.
6. </style> per indicare che il codice termina qui.

Scopri di più su Altri esempi di codice CSS da inserire nel tuo sito.