Come nascondere header e footer in pagine specifiche di un sito Divi

In questo post ti spiegherò come nascondere header e footer in pagine specifiche di un sito Divi.

Nascondere header e footer in pagine specifiche

Potrebbe capitarti di dover nascondere l’intero header o il footer del tuo sito Divi, ma solo su una pagina specifica. Se sei agli inizi con Divi, potresti avere qualche difficoltà a trovare una soluzione a questo problema. Quindi, in questo tutorial, ti mostrerò come nascondere l’intero header e il footer Divi in pagine specifiche utilizzando sia le impostazioni predefinite in Divi sia quelle del Generatore di Temi (Theme Builder).

Post correlato: come nascondere header e footer in tutto il sito Divi.

Metodo 1: usare il modello di pagina vuota (blank template)

Questo primo metodo si applica solo se intendi nascondere sia l’header che il footer Divi in una pagina specifica. Il metodo del template vuoto, o “blank page”, è spesso la prima soluzione che troviamo quando decidiamo di nascondere sia header che footer in una pagina specifica. Il tema Divi viene fornito con un template predefinito e un template vuoto (blank page). Il template predefinito include automaticamente sia l’header che il footer (se non utilizzi il Theme Builder), mentre il template vuoto significa che non include nè l’header nè il footer.

Per usare questa impostazione vai nel backend del tuo sito WordPress e nell’elenco delle pagine, clicca su “Modifica Rapida” per la pagina che intendi nascondere e vedrai un menù a discesa come mostrato nello screenshot:

Nascondere header e footer in pagine specifiche
Usando questa soluzione nasconderai sia header che footer, quindi se vuoi rimuovere entrambi e avere una pagina bianca e pulita, il metodo numero 1 funziona alla grande. La maggior parte delle volte ti capiterà di voler nascondere solo l’header e mostrare il footer o viceversa, in questo caso Ma se vuoi solo nascondere solo header e mantenere footer, dovrai utilizzare uno degli altri metodi elencati di seguito.

Metodo 2: nascondi il template nel generatore di temi

Il generatore di temi è quella parte di Divi dove puoi creare e gestire dei veri e propri template dinamici da assegnare a parti fisse o a tipologie di post all’interno del tuo sito WordPress.
Questo secondo metodo si applica solo se utilizzi Divi Theme Builder e NON quello predefinito con il Customizer. Se hai un header globale applicato a tutte le pagine del tuo sito, ma desideri nascondere l’intestazione solo su una o più pagine, questo metodo fa al caso tuo. Nota, questo presuppone che tu stia utilizzando un header o un footer “globale”, il che significa che hai un “modello di sito predefinito” che si applica a tutte le pagine del tuo sito.

Ecco i passaggi molto semplici. Inizia aggiungendo un nuovo modello. Si aprirà una finestra per l’assegnazione del modello. Scegli la tab “Escludi da”. Passa il mouse sopra l’opzione “Pagine specifiche” e seleziona il nome della pagina dall’elenco.

Nascondere header e footer in pagine specifiche

Ora questo nuovo modello è assegnato a quella specifica pagina selezionata. Erediterà i modelli globali di header e footer, ma poiché desideri nasconderne uno o entrambi, seleziona semplicemente l’icona a forma di occhio e lo disabiliterà per quella pagina. 

Nascondere header e footer in pagine specifiche

Vai a controllare il frontend e vedrai che il footer è nascosto su quella pagina, ma visibile su altre.

Metodo 3: usa il CSS per nascondere header e footer

Se preferisci usare il codice e intendi nascondere solo header o solo footer, allora questo metodo fa per te! Questo metodo inoltre ti consente anche di nascondere l’header e di mantenere il footer, oppure di mantenere l’header e nascondere il footer.

Prima di tutto dovrai individuare l’ID della pagina. Per fare questo basta andare nell’amministrazione WordPress e dall’elenco delle pagine clicca su “Modifica”. Nella pagina che si apre guarda il link nella barra di ricerca e noterai un numero appena dopo ?post=, quello è l’id della pagina selezionata. 

Nascondere header e footer in pagine specifiche

Dopo aver ottenuto l’ID della pagina, dovrai quindi scegliere come target l’header o il footer e utilizzare semplicemente il display: none;. Copia il codice sottostante e prima di incollarlo, ricorda di sostituire il numero ID della pagina. Incolla il codice in Divi > Opzioni tema > CSS personalizzato

Post correlato: come aggiungere codice CSS al tema Divi.

Nascondi l’header su una pagina specifica

.page-id-14899 #main-header {
	display: none;
}
.page-id-14899 #page-container {
	padding-top: 0px!important;
}

Nascondi il footer su una pagina specifica

.page-id-14899 #main-footer {
	display: none;
}

Conclusione

Speriamo che questa guida ti abbia aiutato a nascondere l’header e il footer in pagine specifiche del tuo sito Divi. Se hai dubbi, domande o per qualsiasi richiesta, siamo a tua disposizione. Ciao, alla prossima!

Mostra/Nascondi Commenti (0 commenti)
L

0 commenti

Invia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *

Ti potrebbe anche interessare…

Cambiare Modulo Blog Divi
Mar 10 2023

Cambiare il modulo Blog Divi per avere immagine a sinistra e testo a destra

Oggi voglio condividere con voi come è possibile creare un blog Divi con immagine a sinistra e testo a destra usando il layout a larghezza piena.
Immagine con titolo di un articolo su come aggiungere anno di copyright con aggiornamento automatico
Mar 09 2023

Come aggiungere anno di copyright con aggiornamento automatico

Questa soluzione ti permette di aggiungere un anno di copyright con aggiornamento automatico in fondo al tuo sito web senza dover scrivere codice.
Come aggiungere le icone Divi con il codice CSS
Mar 06 2023

Come aggiungere le icone Divi con il codice CSS

In questo post ti spiegherò come è possibile aggiungere le icone Divi con il codice CSS ovunque tu voglia nel tuo sito.
Immagine con titolo di un articolo su come disabilitare lo scroll orizzontale nel tema Divi
Mar 06 2023

Come disabilitare lo scroll orizzontale nel tema Divi

In questo post ti mostrerò come disabilitare lo scroll orizzontale nel tema Divi e migliorare l’esperienza utente.
Illustrazione di un modulo contatto con asterischi per siti WordPress
Feb 18 2023

Aggiungere gli asterischi nei campi obbligatori del modulo di contatto Divi

In questa breve guida ti spieghiamo come aggiungere gli asterischi nei campi obbligatori del modulo di contatto Divi.
Mano con strumento per risolvere problemi del tema Divi
Feb 17 2023

Risolvere i problemi più comuni del tema Divi

Ti potrebbe capitare che il tema Divi non funziona correttamente. Non preoccuparti, in questo post imparerai come risolvere i problemi più comuni.
Fontawesome Sito web schermata iniziale
Nov 17 2022

Come aggiungere le icone Font Awesome al tema Divi

In questo post ti mostro come aggiungere icone Font Awesome al tuo sito WordPress con un plugin o integrando manualmente con Divi.
Impostazioni del testo alternativo modulo immagine Divi Builder
Nov 15 2022

Come ottimizzare le immagini per la SEO in Divi

Scopri come ottimizzare le immagini del tuo sito Divi in ottica SEO in questa guida passo dopo passo!
Modulo Divi Blur Video YouTube
Nov 14 2022

Come spostare il titolo del modulo Divi Blur sopra l’immagine

Oggi ti mostrerò come spostare il titolo del modulo Divi Blurb sopra l’immagine grazie a un frammento di codice.
Icone Social Mobile Divi
Mag 11 2022

Mostrare le icone social nell’header Divi da mobile

In questo post scoprirai un semplice trucchetto per abilitare le icone social nell’header Divi da mobile.

Layout Divi

Scopri un’ampia collezione di layout Divi in continuo aggiornamento.

Membership

Benvenuto nel club segreto dei web designer! Uno spazio riservato a chi ha scoperto i vantaggi dei layout Divi per creare siti web moderni e professionali.

N 80+ Layout Divi
N Licenza Lifetime
N Download illimitati
N Documentazione
N SUPPORTO VIA EMAIL

69,00 €

Licenza Lifetime. Possibilità di utilizzare tutti i layout Divi per sempre.

Divi Logo

Tema Divi

Il più potente e accessibile dei temi WordPress è disponibile anche in italiano!

Divi Builder