Nascondere il menù in determinate pagine di wordpress

 

In questa guida scopriremo come nascondere il menù presente nella nostra testata in determinate pagine del nostro sito attraverso l’uso del linguaggio CSS


Nelle nostre guide abbiamo già visto che esistono plugin che permettono di nascondere determinati widget in alcune parti del nostro sito:  Homepage, pagine statiche, categorie ecc.

Oggi ci concentremo sul menù presente nella nostra testata (header). Pur cercando in rete non siamo riusciti a trovare un plugin specifico che aiuti a nascondere il menù solo in determinate parti del sito. In questa guida allora spiegheremo come ottenere il risultato attraverso l’uso del linguaggio CSS.

Il nostro obiettivo è  quello di nascondere il menù solo in una pagina statica del nostro sito e lasciare invece visibile il menù in tutto il resto del sito.

Se state cercando questo tipo di soluzione proseguite nella lettura.


TROVARE L’ID DELLA PAGINA STATICA

Per prima cosa dobbiamo recuperare l’id della pagina statica a cui vogliamo nascondere il menù. L’operazione è molto semplice. Andiamo nella sezione “pagine”, clicchiamo su modifica nella nostra pagina e vedremo che l’indirizzo sul nostro browers presenterà una stringa come quella in figura:

La sezione evidenziata in giallo rappresenta l’Id della pagina statica. Nel caso specifico l’id è 90.

TROVARE LA DENOMINAZIONE DEL NOSTRO HEADER /MENU”.

Qui la situazione si complica un pochino, ma nulla che non si riesca a risolvere. Il menù e l’header in cui il menù è inserito ha un codice diverso per ogni template. Non esiste un codice univoco, ma è diverso a seconda del template che stiamo usando.

Infatti i template del nostro sito sono creati da persone, da webmaster che nel momento in cui hanno creato il template hanno assegnato determinati nomi ai vari oggetti del template.

Dobbiamo quindi scovare e scoprire come l’header del nostro template è stato chiamato.

Per scoprire il nome di qualsiasi oggetto del nostro template possiamo usare la funzionalità “ispeziona elemento” presente su Chrome:

1. Visitiamo una pagina del nostro sito e clicchiamo sulla tastiera contemporanemante questi tasti: CTRL + ALT SHIFT + C

2. La pagina si “dividerà” in due: a sinistra la pagina del nostro sito così come la conosciamo e a destra invece la pagina del nostro sito come si presenterebbe a “matrix” cioè nella sua veste del codice sorgente 🙂

3. Usiamo il nostro mouse per posizionarci all’altezza del nostro header. La porzione di pagina dove è presente il menù e facciamo click sinistro. Nella sezione alla nostra destra dovremmo vedere il nome del nostro header preceduto da un cancelletto.

Nel caso di questo sito, e solo di questo sito, il codice si presenta così: #masthead

NASCONDERE IL MENU IN UNA DETERMINATA PAGINA STATICA

Ora abbiamo, si spera, tutte le informazioni per nascondere nel nostro esempio la pagina con id=90 dal nostro header chiamato #masthead.

Rechiamoci dalla nostra bacheca di wordpress su “Aspetto” e quindi su “Personalizza“. Anche qui le cose cambiano a seconda del template che usate, ma quasi sicuramente nella sezione Personalizza dovrete trovare una voce che recità più o meno così: CSS aggiuntivo

Tutto ciò che scriveremo in questa parte di codice sovrascriverà ciò che è stato creato di defalut dal creatore del template.

Per nascondere il menù dalla pagina statica nel nostro caso esemplificativo dovremo scrivere questo codice:

.page-id-90 #masthead

{ display: none; }

Un po’ complicato ma sicuramente efficace e una volta imparato anche piuttosto semplice.

Lasciate pure commenti e suggerimenti nel modulo qui sotto