Come creare un sito web con WordPress – Terza parte

In questa terza parte proseguiamo con la creazione del sito WordPress e scopriamo altre utili funzionalità del tema GeneratePress.

Cosa sono gli Hook e a cosa servono

Cominciamo a creare la home page del sito sfruttando l’editor a blocchi di WordPress. Inoltre scopriamo GenerateBlocks, un plugin creato dallo stesso autore del tema GeneratePress che ci mette a disposizione 4 blocchi fondamentali per poter gestire meglio i contenuti all’interno delle varie pagine (e non solo, come vedremo più avanti).

Nelle lezioni successive ti mostrerò come, grazie alla funzionalità Elementi di GeneratePress (disponibile nella versione Premium) è possibile personalizzare il proprio sito senza dover ogni volta cercare e installare nuovi plugin.

Sia che si tratti di modificare l’aspetto della testata, di aggiungere une sezione o un box prima o dopo gli articoli, oppure altro ancora… è spesso possibile farlo in modo semplice, senza ulteriori plugin.

Un concetto importante da apprendere per sapere dove è possibile posizionare gli elementi all’interno della struttura delle varie pagine è quello degli hook.

Gli hook sono una funzionalità tipica di WordPress, non sono solo un qualcosa che funziona con GeneratePress. Ci sono gli hook messi a disposizione da WordPress e, a questi, si aggiungono gli hook messi a disposizione dal tema GeneratePress.

Ma cosa sono questi hook?

Hook letteralmente significa gancio. Infatti grazie agli hook è possibile agganciarsi a determinati punti della pagina per far accadere delle cose o modificare il comportamento predefinito di WordPress o del tema.

In questa pagina della documentazione di GeneratePress trovi un elenco di tutti gli hook messi a disposizione da questo tema.

In pratica questi hook (per la precisione questi action hook) rappresentano i diversi punti della pagina nei quali puoi aggiungere il tuo codice personalizzato.

Ad esempio l’hook generate_after_header indica il punto immediatamente dopo l’header (la testata del sito).

L’hook generate_after_entry_content indica il punto subito dopo il contenuto di una pagina o di un articolo.

Un hook come generate_before_comments indica invece il punto subito prima l’inizio della sezione dei commenti in un articolo.

Quindi, giusto per fare un esempio, se vorrai creare un elemento e farlo comparire dopo il contenuto di un articolo, dovrai agganciarlo all’hook generate_after_entry_content.

Ora, non devi impararli a memoria per usarli. Anche perché la funzione Elementi di GeneratePress ti permette di sfruttare gli hook in modo molto semplice. Senza dover scrivere alcuna riga di codice.

In questa pagina puoi anche trovare delle immagini che ti indicano, in modo visuale, dove sono posizionati i vari hook nel tema GeneratePress.

Approfondimenti

Se desideri approfondire il concetto di hook, qui trovi un articolo dettagliato sugli hook di WordPress pubblicato da Kinsta e qui la documentazione ufficiale di WordPress.

Aggiungi un box autore senza plugin sfruttando gli hook

In questa lezione ti mostro come, grazie alla funzione Elementi di GeneratePress, puoi aggiungere un box autore con la tua foto profilo, una tua breve descrizione e i link ai tuoi profili social, sotto ogni articolo del blog. Il tutto senza dover installare alcun plugin aggiuntivo.
Per farlo, sfruttiamo gli hook che abbiamo visto nella lezione precedente.

Crea un elemento per la navigazione tra gli articoli

Sempre sfruttando gli Elementi di GeneratePress, vediamo come creare e personalizzare un elemento da inserire sotto ogni articolo del blog, per permettere ai visitatori di accedere rapidamente all’articolo precedente e a quello successivo.

Personalizzare le meta informazioni negli articoli

La funzione Elementi di GeneratePress permette di personalizzare anche le meta informazioni negli articoli (o nelle pagine). Queste meta informazioni sono il nome dell’autore, la data di pubblicazione, le categorie o i tag associati a un articolo.

In questa lezione ti mostro anche i template già pronti per i vari Elementi che è possibile personalizzare con GeneratePress.

Cosa sono e come utilizzare i Content Template di GeneratePress

Vediamo ora un’altra funzionalità degli Elementi di GeneratePress. Si tratta di una novità, chiamata Content Template, che permette di costruire l’aspetto di alcuni contenuti permettendo un incredibile quantità di personalizzazioni.

Grazie a questa funzione puoi infatti definire l’aspetto di come i tuoi articoli appaiono nelle pagine del blog o degli archivi.

Grazie ai Content Template è possibile riprogettare come appare il singolo articolo all’interno del blog (così come negli archivi di categoria, o negli altri archivi) del tuo sito.

Questa attività di personalizzazione è possibile farla sempre sfruttando l’editor a blocchi e senza dover intervenire sul codice.

Interventi avanzati con i Content Template

Questa è una delle lezioni più avanzate del corso. Quanto spiegato in questa lezione, potrebbe non servirti. Ma ho ritenuto utile mostrarti queste possibilità per permetterti di capire e apprezzare la flessibilità di WordPress e del tema GeneratePress.

In particolare in questa lezione vediamo:

• come differenziare gli archivi di una categoria rispetto a tutti gli altri archivi e alle pagine del blog.
• come copiare un elemento in un nuovo elemento, per velocizzare le operazioni di personalizzazione.
• come variare il numero di colonne utilizzate nelle varie pagine di archivio (se ad esempio vuoi visualizzare gli articoli del blog su 2 colonne, ma in una categoria vuoi usare 1 sola colonna).

Qui di seguito trovi un esempio del codice utilizzato nel video, sfruttando il plugin Code Snippets (già usato in una lezione precedente) e i Conditional Tags di WordPress. Qui trovi la documentazione di GeneratePress per la personalizzazione delle colonne.

add_filter( 'generate_blog_get_column_count','tu_search_column_count' );
function tu_search_column_count( $count ) {
    if ( is_category( 'slug-tua-categoria' )  ) {
        return 100;
    }
    return $count;
}

Attivare e disattivare i vari Elementi e snippet di codice

Se un elemento che hai creato non ti serve più puoi decidere di eliminarlo. Ci sono casi però nei quali è più furbo disattivare gli elementi che non ti servono. In questo modo li hai già pronti all’uso se un domani dovessi cambiare idea.

La stessa cosa vale per quei codici inseriti utilizzando il plugin Code Snippets.

Personalizza gli archivi di categoria degli articoli

Le pagine di archivio delle varie categoria degli articoli sono spesso trascurate e utilizzate come un semplice elenco degli articoli inseriti in quella categoria.

È però possibile, e ti suggerisco di farlo, personalizzare maggiormente queste pagine di archivio. Ad esempio inserendo del testo personalizzato per rendere più utili e rilevanti (anche in ottica SEO) queste sezioni del tuo sito.

In questa lezione ti mostro anche come inserire un widget nella barra laterale per permettere una più rapida navigazione tra le varie categorie degli articoli.

Creare un footer personalizzato con GenerateBlocks

Gli Elementi di GeneratePress permettono di creare anche il footer del sito sfruttando l’editor a blocchi di WordPress e il plugin GenerateBlocks.
In questo modo hai la possibilità di personalizzare il footer del sito in modo maggiore rispetto a quanto permesso nelle impostazioni generali del tema.

Installazione codice monitoraggio Google Analytics

In questa lezione ti mostro come installare il codice di monitoraggio di Google Analytics all’interno del tuo sito senza installare alcun plugin aggiuntivo, ma sfruttando la funzionalità Elementi di GenerataPress.

All’interno di questo sito trovi anche un articolo dedicato a Google Analytics 4.