Se stai creando un sito con alcune pagine di livello superiore a cui vuoi attirare l'attenzione dei visitatori e incoraggiarli a visitare, è utile che vengano visualizzate in modo visibile nell'intestazione del tuo sito.
Naturalmente puoi aggiungere pagine di primo livello al tuo menu di navigazione, ma in questo tutorial ti mostrerò come aggiungere dei collegamenti aggiuntivi a queste pagine usando il get_pages ()
funzione.
Nota: non è necessario utilizzare questo codice nell'intestazione del sito. Se funziona meglio per te, puoi sempre aggiungerlo alla barra laterale o al piè di pagina modificando il file sidebar.php
o footer.php
file invece di header.php
.
In questo tutorial creerò un tema figlio del tema dei ventisei anni e quindi creerò un duplicato di ventisei header.php
file nel mio tema figlio, che modifico. Non devi mai modificare i file di un tema che hai scaricato, poiché quando aggiorni il tema perderai il tuo lavoro. In alternativa, se stai lavorando con il tuo tema, sentiti libero di aggiungere questo codice a questo.
Per seguire questo tutorial avrai bisogno di quanto segue:
Quindi iniziamo.
Inizia creando un bambino di ventisei anni (a meno che tu non stia lavorando con il tuo tema personale).
Crea una nuova cartella nel tuo wp-content / themes /
cartella e dargli un nome logico: sto chiamando il mio collegamento pulsanti tutsplus-page-
.
Dentro quella cartella, crea un nuovo file e chiamalo style.css
. Ora apri quel file e aggiungilo a questo:
/ * Nome del tema: Tuts + URI del tema dei pulsanti di collegamento della pagina: http: //.tutsplus.com/tutorials/using-get_get-pages-to-create-link-buttons-to-your-sites-top-level-pages-creating-the -code - cms-24967 Descrizione: Tema per supportare tuts + tutorial sull'aggiunta di pulsanti alle pagine di livello superiore nell'intestazione del tuo sito (parte 1). Tema infantile per il tema Twenty Sixteen. Autore: Rachel McCollin Autore URI: http://rachelmccollin.co.uk/ Template: twentysixteen Versione: 1.0 * / @import url ("... /twentysixteen/style.css");
Modifica il codice sopra per indicare che questo è il tuo tema, non il mio.
Ora salva quel file e attiva il tuo nuovo tema sul tuo sito.
Come modificheremo il header.php
file, dobbiamo creare un duplicato di quel file dal tema dei ventisei anni nel tema figlio. Trovare la header.php
file in venti sedici e copia (non muoverti!) nella cartella del tuo nuovo tema.
Ora il tuo tema avrà due file: style.css
e header.php
. WordPress utilizzerà automaticamente il header.php
file dal tema figlio piuttosto che uno su ventisei, in quanto è così che funzionano i temi figli.
Apri il nuovo header.php
file in modo da poter iniziare a modificarlo.
Aggiungerò i miei link alle pagine di livello superiore all'interno di intestazione
elemento, immediatamente prima della chiusura etichetta. Quindi trova quella linea nel tuo tema e inizia ad aggiungere un nuovo codice sopra la chiusura
etichetta.
Innanzitutto, crea gli argomenti per get_pages ()
digitando quanto segue:
$ args = array ('parent' => 0, 'sort_order' => ASC, 'sort_column' => 'menu_order');
Questo assicura che get_pages ()
recupera solo quelle pagine senza genitore ('genitore' => 0
) e ordina le pagine utilizzando l'ordine specificato nelle schermate di modifica della pagina. Se si desidera modificare l'ordinamento, utilizzare uno o più degli argomenti che è possibile trovare nella pagina del codice get_pages ()
.
Ora, sotto i tuoi argomenti, aggiungi questo:
$ pages = get_pages ($ args);
Questo eseguirà il get_pages ()
funzione usando gli argomenti che hai specificato.
Prima di emettere altro codice, vuoi controllare che ci siano alcune pagine al livello più alto, quindi controlla quello get_pages ()
ha restituito qualcosa.
Sotto il get_pages ()
funzione, aggiungere questo:
if ($ pages)
Quindi aggiungerai l'output del codice all'interno delle parentesi graffe.
Adesso per la parte divertente. All'interno delle parentesi che hai appena aggiunto, digita quanto segue:
Questo apre a ul
elemento, quindi all'interno di quel loop attraverso ogni pagina recuperata da get_pages ()
ed emette il suo titolo all'interno di un link ad esso.
Ora salva il tuo file.
Ho aggiunto alcune pagine fittizie al mio sito. Come puoi vedere dallo screenshot, ci sono tre pagine di primo livello e una pagina di secondo livello, che non dovrebbero apparire nella mia intestazione:
Ed ecco come appaiono i link sul mio sito:
Come puoi vedere, vengono visualizzate solo le pagine di livello superiore. In questo momento non sembrano troppo belli: si presentano in una semplice lista di proiettili. Quindi, nel prossimo tutorial, ti mostrerò come modellarli per assomigliare ai pulsanti.
L'aggiunta di link a pagine di livello superiore nell'intestazione del tuo sito può essere un modo utile per indirizzare il traffico verso tali pagine. Invece di codificare questi collegamenti, è necessario utilizzare WordPress get_pages ()
funzione per automatizzare il processo. Qui hai imparato come farlo, e nella prossima parte ti mostrerò come aggiungere un po 'di stile.