In questo video daremo un’occhiata più da vicino al “personalizzatore” e parleremo di come esso può cambiare l’aspetto del tuo sito WordPress. WordPress utilizza i temi per determinare il design generale di un sito, inclusi il layout, i colori e la tipografia.
Ci sono migliaia di temi tra cui scegliere che ti consentono di creare praticamente qualsiasi tipo di sito che puoi immaginare: da un blog personale a un sito aziendale o persino e-commerce.
Il nostro sito demo utilizza il tema WordPress predefinito chiamato “2020”, ottimo per creare un sito aziendale o un semplice blog.
Il “personalizzatore” ti consente di apportare modifiche all’aspetto del tuo sito e visualizzare in anteprima tali modifiche prima di pubblicarle.
Sul lato destro c’è un’anteprima dal vivo del tuo sito con il tema e l’impostazioni correnti applicate.
Quando apporti modifiche alle opzioni sul lato sinistro, l’anteprima si aggiornerà in tempo reale.
Seleziona l’icona di modifica accanto a qualsiasi elemento nell’anteprima per modificare quel particolare elemento.
La parte superiore del personalizzatore indica il nome del tema attivo. Seleziona il pulsante “Cambia” per visualizzare gli altri temi attualmente installati sul tuo sito.
Puoi visualizzare un’anteprima dal vivo di come apparirebbero i tuoi contenuti con un altro tema e, se ti piace quello che vedi, puoi attivare e pubblicare il tuo sito con un nuovo tema applicato.
Puoi anche sfogliare i temi dalla directory dei temi di wordpress.org: puoi filtrare i temi per argomento, caratteristiche specifiche o layout.
Quando trovi un tema che ti piace, puoi installarlo e visualizzarne l’anteprima con un clic.
Le opzioni disponibili nella personalizzazione variano a seconda delle funzionalità supportate dal tema corrente, ma la maggior parte dei temi, oggi, include questi controlli di personalizzazione di base.
“Identità del sito” ti consente di caricare o selezionare un logo che sostituirà il titolo del sito.
Se preferisci usare il titolo del sito, rimuovi semplicemente il logo, e WordPress utilizzerà invece il titolo del sito che inserisci qui.
Successivamente aggiorna lo slogan. Puoi visualizzare in anteprima le modifiche in tempo reale.
Abilitare il “logo retina” è una buona idea perché ridimensiona il logo a metà delle sue dimensioni, rendendolo più nitido sugli schermi ad alta risoluzione.
Puoi anche caricare o selezionare un’icona del sito che è ciò che vedi nelle schede del browser o nei segnalibri del tuo browser web.
Puoi cambiare i colori usati per scrivere il tuo sito per dargli un tocco più personale. 2020 include tre impostazioni di colore.
Per impostazione predefinita, il colore di sfondo è questo beige, puoi scegliere qualsiasi colore che ti piace utilizzando il Color Picker o semplicemente inserendo un codice esadecimale qui.
Puoi anche cambiare il colore di sfondo per l’Header e il Footer, e WordPress cambierà automaticamente il colore degli elementi sul tuo sito in base ai colori di sfondo che scegli, questo assicura che il contrasto del colore sia sempre abbastanza alto da essere accessibile a tutti i visitatori.
Il colore primario viene utilizzato per collegamenti e pulsanti in tutto il sito; per impostazione predefinita il colore primario è il rosa, ma puoi usare il cursore e selezionare semplicemente il colore che preferisci.
Successivamente, ci sono alcune opzioni per il tema: puoi nascondere o mostrare il link di ricerca che appare nell’angolo in alto a destra dell’intestazione e puoi scegliere se mostrare o meno la biografia dell’autore nella parte inferiore di ogni post del blog.
Se non hai più autori che creano contenuti per il tuo sito va benissimo disabilitarlo.
Nelle Pagine archivio puoi scegliere se mostrare il testo completo di ogni post o solo un riassunto; ciò richiederà ai tuoi visitatori di cliccare sul titolo per visualizzare l’intero post.
2020 include un template di pagina che abbiamo applicato a questa pagina in un video precedente è chiamato “template della copertina” e mostra il titolo del post o della pagina sopra un’immagine in primo piano a tutta larghezza. Ci sono diverse opzioni per il modello “copertina”. Innanzitutto, scegli se l’immagine in primo piano dello sfondo deve avere una posizione fissa quando il visitatore scorre, il che crea un leggero effetto di parallasse o se semplicemente scorre su e giù insieme al contenuto.
Successivamente puoi impostare il colore di sfondo dell’overlay dell’immagine: il colore predefinito è il rosa ma puoi scegliere qualsiasi colore che ti piace nel Color Picker.
È possibile modificare il colore del testo visualizzato sopra l’overlay e infine impostare l’opacità dell’overlay dell’immagine per determinare quanta parte dell’immagine è visibile dietro il colore di sfondo.
Bene, ora puoi caricare o selezionare un’immagine di sfondo che apparirà dietro il contenuto delle tue pagine e dei tuoi post; e se aggiungi un’immagine di sfondo, puoi scegliere tra diversi preset per determinare come appare l’immagine: puoi riempire lo schermo con l’immagine, adattarla alle dimensioni massime sullo schermo dei visitatori, ripetere l’immagine per riempire l’intero sfondo oppure seleziona “personalizzato”; e poi puoi impostare manualmente la posizione dell’immagine, la dimensione, se deve ripetersi o meno o scorrere con la pagina. Per ora vado avanti e rimuovo l’immagine di sfondo.
Successivamente, puoi gestire i menu di navigazione che appaiono nel tuo sito. Ne abbiamo parlato approfonditamente in un video precedente e abbiamo anche spiegato come aggiungere e modificare i widget. In un video precedente abbiamo parlato anche di come selezionare una homepage statica per il tuo sito al posto che mostrare solo i post del blog.
“CSS aggiuntivo” è molto utile perchè ti permetterà di aggiungere il tuo codice CSS per personalizzare l’aspetto del tuo sito, sovrascrivendo le impostazioni del tema che stai usando attualmente.
Ti mostro cosa intendo inserendo semplicemente del codice CSS che cambia il motto del nostro sito in corsivo e il colore in “nero”.
Puoi saperne di più sul CSS leggendo la nostra Guida CSS completa e ideale per chi ha un sito WordPress.
In fondo al “customizer” trovi dei link per vedere come il tuo sito sarà visualizzato sui vari tipi di dispositivi: desktop, tablets e mobile.
Puoi anche nascondere i controlli per avere un’idea migliore di come il tuo sito sarà visualizzato a dimensioni intere.
Quando sei contento dei cambiamenti effettuati seleziona “pubblica” qui in alto oppure clicca la piccola icona a forma di ingranaggio per salvare il tuo progetto come bozza che puoi condividere con altri prima di applicare questi cambiamenti nella parte pubblica del tuo sito. Oppure scegliere che i cambiamenti siamo applicati automaticamente in un giorno e ora a tua scelta.
Naturalmente puoi anche eliminare totalmente i cambiamenti effettuati.
Clicca “pubblica” per salvare i cambiamenti.
Per uscire dal “customizer” seleziona l’icona chiudi in alto a sinistra.
Con tutte queste opzioni, “customizer”, rende davvero facile personalizzare il tuo sito wordpress per renderlo davvero unico.
