Aggiunta di hook di azione al tuo framework di temi WordPress

In questo tutorial aggiungerai alcuni hook di azione ai tuoi file modello, a cui poi assegnerai le funzioni nel prossimo tutorial. Successivamente, aggiungerai alcuni hook di filtro.

Il vantaggio della creazione di hook di azione nel framework è che qualsiasi contenuto a cui vengono associati può essere facilmente sovrascritto dalle funzioni in un tema secondario o dai plug-in. Ciò consente di risparmiare la creazione di file modello duplicati nei temi figlio e offre maggiore flessibilità.

Nota: se hai bisogno di saperne di più sull'azione e sui hook del filtro prima di iniziare, questo tutorial ti aiuterà.

Cosa ti serve

Per seguire questo tutorial, avrai bisogno di:

  • un'installazione di sviluppo di WordPress
  • il tuo tema oi file del tema della Parte 3 di questa serie, che puoi trovare nel repository GitHub per accompagnare la serie
  • un editor di codice

Aggiunta di ganci all'intestazione

Aggiungiamo due ganci all'intestazione: uno davanti e uno all'interno.

Nel header.php, immediatamente dentro l'apertura tag, aggiungi il primo hook di azione:

Questo hook potrebbe essere utile per aggiungere contenuti, menu o collegamenti sopra l'intestazione del sito.

Aggiungi un altro gancio all'interno dell'intestazione, a destra. I temi figlio possono utilizzarli per inserire contenuti personalizzati, moduli di ricerca o widget.

Si noti che ho incluso questo hook all'interno di a div con un paio di classi che funzionano con lo stile orientato agli oggetti nel mio tema - se stai lavorando con il tuo tema, dovrai usare qualcosa di diverso ma il gancio stesso sarà lo stesso.

Aggiunta di hook al contenuto

Il tema includerà due hook di contenuto: uno prima del ciclo e aperto dopo di esso, entrambi all'interno di #content div. Fortunatamente a causa del modo in cui il mio tema è strutturato, devo solo aggiungere ogni hook una volta, mentre apro quel div nel file header.php file e chiudilo nel sidebar.php e Pagina-full-width.php file: viene aggiunto al modello di pagina a larghezza intera poiché non chiama la barra laterale.

Iniziamo con quello precedente al ciclo.

Alla fine di header.php, aggiungi quanto segue solo all'interno dell'apertura #soddisfare div:

Ciò fornirà un gancio per qualsiasi cosa all'interno dell'area del contenuto ma sopra il ciclo.

Avanti in sidebar.php, poco prima della chiusura del #soddisfare div, aggiungi questo codice:

Infine aggiungi lo stesso codice al Pagina-full-width.php modello come hai appena fatto sidebar.php, di nuovo poco prima della chiusura del #soddisfare div.

Aggiungere ganci alla barra laterale

Il passo successivo è quello di sostituire l'area del widget nella barra laterale con un gancio, che verrà quindi utilizzato per aggiungere nuovamente l'area del widget in una fase successiva, ma può anche essere utilizzato per aggiungere codice personalizzato o sovrascrivere l'area del widget.

Sostituisci tutto il codice per l'area del widget con il nuovo hook:

Ciò significa che se si desidera sostituire l'area del widget con il proprio codice in un plug-in o un tema figlio, è possibile farlo allegando il nuovo codice a questo hook e ignorando il hook che collega l'area del widget.

Aggiunta di ganci al piè di pagina

Infine è necessario aggiungere un paio di ganci al footer: uno al suo interno e uno al di sotto, che verrà utilizzato per il colophon.

Dentro il footer elemento, sostituisci tutto il codice esistente con il gancio:

Successivamente, aggiungi un altro gancio per il colophon, dopo la chiusura del footer elemento:

Nota: il codice rimosso per le aree widget e il colophon verrà sostituito in una fase successiva, ma invece di aggiungerlo direttamente ai file modello verrà aggiunto utilizzando una funzione attivata tramite il gancio pertinente. Aggiungiamo anche i ganci filtro ad alcune di queste funzioni.

Sommario

L'uso di hook di azione nei file di template offre all'utente e agli utenti del framework molta più flessibilità su tutta la linea. Puoi utilizzarli per inserire qualsiasi tipo di contenuto ovunque tu voglia, e sovrascrivere o rimuovere anche i contenuti, il tutto senza creare nuovi file modello.

Nella parte successiva di questa serie, ti mostrerò come creare funzioni che aggiungeranno aree widget e altri contenuti, tutte attivate tramite questi hook.