Riassunto AI
Recentemente, uno dei nostri lettori ci ha chiesto istruzioni passo passo su come modificare l'intestazione in WordPress poiché non riusciva a trovare nulla che lo guidasse da zero.
Sebbene si tratti di qualcosa di molto basilare, abbiamo pensato che fosse un'ottima opportunità per aiutare coloro che stanno iniziando il loro percorso con WordPress.
La scelta dell'editor dipende dal tema in esecuzione sul tuo sito, quindi questa guida copre entrambi i percorsi. Inizierò aiutandoti a capire quale hai, poi ti guiderò attraverso le modifiche stesse.
- Come modificare l'intestazione in WordPress
- Passaggio 1: Accedi all'Editor del sito
- Passaggio 2: Aggiungi il logo del tuo sito
- Passaggio 3: Aggiungi il titolo del sito
- Passaggio 4: Aggiungi le navigazioni della pagina
- Passaggio 5: Cambia il colore di sfondo
- Passaggio 6: Aggiungi icone social e pulsante CTA
- Come modificare l'intestazione in un tema WordPress classico
- Aggiungi il tuo logo alle notifiche email di WPForms
Come modificare l'intestazione in WordPress
Con l'ultima versione di WordPress, puoi utilizzare l'Editor del sito interattivo e intuitivo per personalizzare e marchiare il tuo sito web e creare facilmente un'intestazione personalizzata.
Poiché la maggior parte delle nuove installazioni di WP viene fornita con il tema Twenty Twenty-Four, l'editor del sito è molto utile per diverse personalizzazioni dell'intestazione:
- Font
- Colori
- Stile del pulsante
- E altro ancora
I temi creati prima dell'era dei blocchi ti forniscono il vecchio Personalizzatore temi invece dell'Editor del sito, e i controlli dell'intestazione si trovano in un punto completamente diverso.
Cos'è un'intestazione di WordPress?
La tua intestazione è la striscia che attraversa la parte superiore di ogni pagina del tuo sito e di solito contiene il tuo logo, il titolo del sito e il menu di navigazione principale.
Poiché si trova in un modello piuttosto che in una singola pagina, modificarla una volta la cambia ovunque.
La sezione head è un HTML invisibile in alto nella pagina che contiene meta tag e script, mentre un heading è un pezzo di testo all'interno del tuo contenuto come un H1 o un H2.
Entrambi vengono confusi costantemente con l'header, ma nessuno dei due è ciò che cambi quando vuoi un nuovo logo o un menu diverso.
Quale editor di intestazioni utilizza il tuo tema?
Passa il mouse su Aspetto nella tua bacheca di WordPress per scoprire quale hai. Un'opzione Editor significa che il tuo tema è un tema a blocchi e tutto da Passo 1 in poi si applica a te.
Se l'unica opzione disponibile è Personalizza, sei su un tema classico e la sezione Personalizzatore più in basso è quella che ti serve.
Twenty Twenty-Five viene fornito con WordPress stesso e la maggior parte dei temi a blocchi gratuiti rilasciati negli ultimi due anni funzionano allo stesso modo.
I temi classici sono ancora ovunque, e quelli popolari come Astra, GeneratePress, OceanWP e Kadence gestiscono le loro intestazioni tramite il Personalizzatore o tramite il proprio pannello di impostazioni.
Passaggio 1: Accedi all'Editor del sito
Dal tuo Dashboard WordPress, naviga semplicemente su Aspetto e quindi fai clic sull'opzione Editor dal menu.
Questo ti reindirizzerà all'Editor del sito, dove puoi personalizzare l'aspetto del tuo sito web utilizzando l'editor a blocchi. Apri le opzioni in Modelli.
Ora, tutto ciò che devi fare è scorrere verso il basso finché non vedi la sezione Parti del modello e quindi fare clic su Intestazione per aprire le sue opzioni.
Sul lato destro dello schermo, fai clic sull'immagine Intestazione per aprire le opzioni di personalizzazione disponibili nell'Editor del sito e fai clic sull'icona Modifica.
Ora verrai reindirizzato all'Editor a blocchi di WordPress, dove puoi iniziare aggiungendo il tuo logo, la navigazione, le icone social e persino un pulsante CTA (se necessario).
Passaggio 2: Aggiungi il logo del tuo sito
Una volta che sei nell'Editor a blocchi per l'Intestazione del tuo sito web, fai clic sull'icona Vista elenco in modo che sia facile sapere quali elementi sono inclusi nell'intestazione di WordPress.
Espandi tutti i Blocchi inclusi nella Vista elenco, fai clic sul primo elemento Riga e imposta l'Allineamento su Larghezza intera per iniziare a personalizzare il modello di intestazione.
Ora, tutto ciò che devi fare è fare clic sull'opzione Logo del sito nella Vista elenco e fare clic sull'icona Carica nella sezione di anteprima dell'intestazione.
Puoi scegliere di caricare il tuo logo tramite la scheda Carica file, o semplicemente selezionare il file dalla tua Libreria multimediale esistente.
Se necessario, puoi utilizzare i Punti di ridimensionamento per modificare le dimensioni e la grandezza del logo del sito, in base alle tue esigenze o requisiti specifici.
Ottimo lavoro! Questo è tutto ciò che devi fare per caricare il tuo Logo del sito nell'intestazione. Ora, passiamo al prossimo passaggio per aggiungere il titolo del tuo sito!
Passaggio 3: Aggiungi il titolo del sito
Aggiungere il Titolo del sito nell'intestazione del tuo sito web è altrettanto semplice quanto caricare il tuo Logo del sito nel tema WordPress. Fai semplicemente clic su Titolo del sito dalla Vista elenco.
Quindi, in modo simile a come abbiamo modificato il logo del sito in precedenza, fai clic sul blocco che dice "Scrivi il titolo del sito..." e aggiungi il tuo Titolo del sito al suo interno.
Come puoi vedere, l'intestazione del tuo tema sta lentamente prendendo forma. Per il prossimo passo, aggiungeremo alcuni elementi di navigazione alla tua intestazione.
Passaggio 4: Aggiungi le navigazioni della pagina
Per aggiungere le tue pagine all'intestazione, fai semplicemente clic su Navigazione dalla Vista Elenco, e quindi fai clic sull'opzione Modifica per il suo blocco.
Questo ti porterà alla pagina dedicata dell'editor di blocchi per l'elemento Navigazione, dove puoi aggiungere nuove pagine e i loro collegamenti tramite l'icona Più.
Questo completerà l'aspetto della tua intestazione, ma come puoi vedere, sembra troppo semplice e c'è molto spazio per miglioramenti!
Aggiungiamo ora un po' di stile alla tua intestazione per renderla più accattivante e abbinarla alle tonalità di colore del tuo sito web.
Passaggio 5: Cambia il colore di sfondo
Una delle modifiche più basilari che puoi apportare all'intestazione è cambiarne il colore di sfondo. Per farlo, fai clic sulla prima Riga e apri le sue Impostazioni.
Ora sarai in grado di vedere le opzioni di Blocco per la Riga selezionata. Tutto quello che devi fare ora è fare clic sull'icona Stili accanto all'icona dell'ingranaggio (impostazioni).
Questo aprirà numerose opzioni per la Riga selezionata, dove puoi modificare il Colore, l'Immagine di sfondo, la Tipografia e le Dimensioni.
Puoi esplorare queste opzioni per rendere la tua intestazione più accattivante. Dato che avevamo solo bisogno di cambiare il colore, abbiamo selezionato il bianco per il Testo e il nero per lo Sfondo.
Come puoi vedere, l'intestazione sul front-end ora ha un aspetto molto migliore e conferisce al sito web un aspetto più completo.
Vuoi apportare ulteriori modifiche all'intestazione, come inserire alcune icone social e un pulsante CTA? Bene, il processo è semplice!
Passaggio 6: Aggiungi icone social e pulsante CTA
Per aggiungere icone social e un pulsante CTA, dovrai aggiungere una nuova Riga. Fai clic sull'icona Più (+) e seleziona il blocco Riga.
Successivamente, trascina il blocco Riga appena aggiunto sopra la riga esistente in modo da poterla personalizzare liberamente senza influire sull'intestazione esistente.
Dopo di che, fai clic sul pulsante (+) all'interno della nuova Riga e cerca e seleziona il blocco Icone Social.
Simile a come abbiamo aggiunto le pagine nella Navigazione, fai clic sul pulsante (+) per inserire Widget Social Media per le piattaforme che preferisci.
Una volta fatto, seleziona di nuovo la Riga dalla Vista Elenco e fai clic di nuovo sul pulsante (+) per aggiungere un blocco Pulsante alla tua intestazione.
Tutto quello che devi fare ora è dare al tuo pulsante un testo come "Prenota Ora!" e aggiornare il suo Link per impostare un reindirizzamento per i visitatori del sito web.
Per far sì che tutto si unisca, seleziona di nuovo la Riga e imposta l'Allineamento su Larghezza intera come abbiamo fatto con la prima riga.
Quindi, per dare a questa sezione un aspetto più accattivante, utilizza il menu Cambia giustificazione elementi e seleziona l'opzione Giustifica elementi a destra.
Ed ecco fatto! L'intestazione è ora completa e perfetta. Fai clic sul pulsante Salva in alto per non perdere le modifiche.
Come modificare l'intestazione in un tema WordPress classico
I temi classici instradano le modifiche all'intestazione tramite il Personalizzatore temi, che è un pannello di anteprima live piuttosto che un'area di lavoro a blocchi.
Vai su Aspetto » Personalizza e vedrai il tuo sito a destra con una barra laterale delle impostazioni a sinistra. La maggior parte di ciò di cui hai bisogno si trova in tre o quattro pannelli di quella barra laterale:
- Identità del sito: Il tuo logo, titolo del sito e motto, di solito la prima cosa da impostare
- Menu: Quali pagine appaiono nella tua navigazione e in quale ordine
- Colori: I colori di sfondo e del testo dell'intestazione
- Immagine intestazione: Un banner dietro l'intera striscia, offerto da molti temi ma non da tutti
Astra mette quasi tutto sotto Header Builder, GeneratePress usa Layout » Header, e OceanWP divide le sue opzioni tra Header e Typography, quindi i nomi esatti dei pannelli cambiano da tema a tema.
Se non riesci a trovare un controllo, fai clic direttamente sull'intestazione nell'anteprima live, poiché la maggior parte dei temi ti porterà al pannello corrispondente.
I temi premium a volte tengono le loro migliori opzioni di intestazione completamente fuori dal Personalizzatore e le mettono invece in un menu dedicato di primo livello. Cerca una voce di menu con il nome del tuo tema prima di presumere che una funzionalità sia mancante.
Il Customizer gestisce il tuo piè di pagina dallo stesso pannello, quindi è un buon momento per aggiungere un modulo di contatto al tuo piè di pagina mentre sei lì. Nulla va online finché non premi Pubblica in cima alla barra laterale.
Aggiungi il tuo logo all'intestazione delle email in WordPress
Considera l'aggiunta del tuo logo a un'intestazione email per aggiungere un branding coerente che si rifletta anche nelle email inviate dal tuo sito WordPress.
È facile modificare il funzionamento delle notifiche via email in WPForms. Innanzitutto, vai su WPForms » Impostazioni e fai clic sulla scheda Email.
Scegli uno stile che si adatti al tuo branding dalla sezione Modello e premi il pulsante Scegli per applicarlo.
Successivamente, per aggiungere il logo del tuo sito alle email, vai alla sezione Immagine Intestazione e fai clic sul pulsante Carica immagine.
Una volta caricata l'immagine, seleziona la dimensione desiderata per l'immagine da utilizzare nelle notifiche email da un menu a discesa.
Successivamente, fai semplicemente clic sul link Anteprima modello email situato sotto il menu a discesa Tipografia.
Si aprirà una nuova scheda nel browser in cui potrai vedere un'anteprima del modello di email di notifica con il logo del tuo sito!
FAQ sulla modifica dell'intestazione in WordPress
Imparare a modificare l'intestazione in WordPress è un argomento popolare tra i nostri lettori. Ecco le risposte ad alcune domande comuni al riguardo.
Come personalizzo la mia intestazione in WordPress?
Per personalizzare la tua intestazione in WordPress, vai alla tua bacheca e seleziona Aspetto » Personalizza. Qui troverai la sezione Intestazione. Cliccaci sopra per esplorare varie opzioni, come cambiare il logo, regolare il layout dell'intestazione, i colori e altri elementi. Alcuni temi offrono opzioni aggiuntive per l'intestazione da modificare per adattarsi al tuo stile.
Come si modificano i pulsanti dell'intestazione in WordPress?
La modifica dei pulsanti dell'intestazione in WordPress di solito comporta l'accesso al Customizer tramite Aspetto » Personalizza. Una volta lì, cerca le impostazioni di Intestazione o Menu. Puoi modificare i pulsanti cambiando il loro testo, link e stili o aggiungendo nuovi elementi se il tuo tema lo supporta. Se necessario, puoi anche aggiungere del codice personalizzato per modificare i pulsanti dell'intestazione.
Come modifico il logo dell'intestazione in WordPress?
Su un tema a blocchi, apri Aspetto » Editor, modifica la parte del modello Intestazione, quindi seleziona il blocco Logo del sito e carica la tua immagine. Su un tema classico, vai su Aspetto » Personalizza » Identità del sito e usa il pulsante Seleziona logo. Entrambi i percorsi impostano il logo a livello di sito, quindi devi farlo solo una volta.
Posso rendere la mia intestazione di WordPress fissa (sticky)?
Seleziona il blocco Gruppo più esterno che racchiude la tua parte del modello Intestazione e imposta la sua Posizione su Fissa nella barra laterale delle impostazioni del blocco, che funziona su qualsiasi tema a blocchi senza plugin. I temi classici di solito forniscono un interruttore per l'intestazione fissa nel loro pannello opzioni e, se il tuo non lo fa, un plugin per l'intestazione fissa farà il lavoro.
Posso modificare l'intestazione di WordPress senza scrivere codice?
Tutto in questa guida avviene tramite l'amministrazione di WordPress senza alcun codice, sia che tu utilizzi l'Editor del sito o il Customizer. Modificare direttamente il file header.php è un'opzione per gli sviluppatori che necessitano di modifiche a livello di markup. Questo percorso implica lavorare in un tema figlio in modo che un aggiornamento del tema non cancelli le tue modifiche, e quasi nulla di ciò che un tipico proprietario di sito desidera da un'intestazione lo richiede.
Qual è la differenza tra un'intestazione di WordPress e un titolo?
Un'intestazione è l'area del modello nella parte superiore del tuo sito che contiene il tuo logo e la navigazione su ogni pagina. Un titolo è una singola riga di testo all'interno del tuo contenuto, contrassegnata come H1-H6, che suddivide un articolo in sezioni. Modificare la tua intestazione influisce sull'intero sito, mentre modificare un titolo influisce solo sulla pagina su cui si trova.
Successivamente, scopri come creare un modulo multi-step in Elementor
Ti sei mai chiesto come aumentare il coinvolgimento degli utenti e la generazione di lead sul tuo sito web con un modulo multi-step di Elementor? Questi moduli guidano gli utenti attraverso il processo passo dopo passo, rendendolo meno opprimente e più facile da usare.
Crea ora il tuo modulo WordPress
Pronto a creare il tuo modulo? Inizia oggi stesso con il plugin per la creazione di moduli WordPress più semplice. WPForms Pro include molti modelli gratuiti e offre una garanzia di rimborso di 14 giorni.
Se questo articolo ti è stato utile, seguici su Facebook e X (Twitter) per altri tutorial e guide gratuite su WordPress.
