Creare un modello di pagina personalizzato per WordPress
Avete sicuramente notato che su molti blog, alcune pagine hanno un aspetto totalmente diverso delle altre pagine dello stesso blog. Anche se usano lo stesso tema come voi, fanno queste modifiche con un modello di pagina personalizzato, quando vogliono creare il contenuto che deve essere visto in modo diverso o semplicemente per differenziarlo dal resto del sito.
Il sito WordPress.org spiega che un modello di pagina personalizzato è “un tipo di file specifico che può essere applicato a una pagina o a un gruppo di pagine specifiche”. In altre parole, il modello di pagina personalizzata si applicherà solo alle pagine specificate, piuttosto che al vostro intero sito WordPress. Cioè particolarmente utile quando è necessario creare un footer di pagina o header personalizzato che verrà applicato solo a una pagina.
Come creare il nostro modello di pagina personalizato
Lavoreremo con frammenti di codice in tutto questo articolo. Vi consigliamo vivamente di eseguire il backup del sito WordPress prima di cambiare qualcosa. Anche se dobbiamo solo apportare modifiche minori, una riga di codice può rompere una pagina intera o anche un sito.
Per essere onesti, non c’è bisogno di conoscere il codice php per creare un modello di pagina personalizzata per il tuo sito WordPress. Tutto è fatto con copia/incolla, anche se si utilizza uno dei temi di default WordPress, è possibile basarsi su parti del suo codice e compilarli per creare il proprio modello di pagina.
È possibile utilizzare questa soluzione per qualsiasi pagina, sia per dare un altro design alla tua Home page, alla tua pagina about us, alla mappa del sito o anche a una galleria di immagini.
Per cominciare, serve avere un buon editor HTML
Se si desidera solo creare una pagina personalizzata, senza modificare il footer o il header di pagina, è possibile utilizzare il codice dal ‘ page. php ‘ file che si trova nella directory del sito WordPress. Questo file contiene il layout di pagina di ogni pagina del tuo sito WordPress.
Passo 1: spostarsi nella directory del file del sito
Per iniziare, è necessario accedere alla directory di file del tuo sito WordPress. È possibile utilizzare un client FTP, come FileZilla, o si può farlo direttamente attraverso il file Manager del vostro host Web.
Vai alla cartella del tema, di solito si trova in ‘/wp-content/themes/il-tuo-Tema ‘
Fase 2: creare un nuovo file php
Ora che ci si trova nella cartella tema attivo, creare un nuovo file. Questo file sarà il nuovo modello di pagina personalizzato che creiamo.
Per questo esempio, chiameremo il nostro modello di pagina personalizzata ‘ New-Model. php ‘. È possibile assegnare un nome al modello nel modo desiderato, ad eccezione di ‘ page. php ‘, poiché questo nome è riservato a WordPress. Assicurati che il nome del tuo modello finisca con ‘. php ‘.
Copia e incolla il codice qui sotto nella parte superiore del file appena creato. Sostituisci “nuovo modello di pagina” con il nome che desideri assegnare al modello di pagina personalizzato.
<?php /* Template Name: Nuovo Modello di Pagina */ ?>
Seleziona la pagina del template che hai creato, sarà visualizzato come lo hai chiamato nel codice incollato sopra, nel nostro esempio “nuovo modello di pagina”.
ecco! Il nuovo modello verrà applicato alla nuova pagina appena creata. bisogna aggiungere qualcosa in questa pagina in modo da non ritrovarsi con una pagina vuota o bianca…
Fase 4: connessione al contenuto del tuo sito
Vai alla directory dei file del tuo sito WordPress, poi nella cartella ‘/wp-content/themes/your-theme ‘. Aprire il file ‘ page. php ‘ del tuo sito WordPress e copiare tutto il codice contenuto in questo file.
Ora aprire il modello di pagina personalizzato che abbiamo creato sopra, dovrebbe essere nella stessa cartella.
Incollare il codice appena copiato dal file ‘ page. php ‘ e assicurarsi di incollare il codice sotto la riga di codice che abbiamo aggiunto nella parte superiore del file modello di pagina personalizzata (fase 2).
Da qui sta a voi per apportare le modifiche, aggiungere una colonna, una tabella o se si desidera ricostruire l’intera pagina, iniziare scrivendo il nuovo codice invece del codice appena incollato.
Nota: se non si vede alcun codice HTML in cui si pensa che il contenuto dovrebbe essere, la pagina può ottenere il contenuto da una funzione diversa in un file diverso. Se questo è il caso, si dovrà cercare questa funzione e cambiarla. Oppure, si può semplicemente cancellare la funzione e scrivere un nuovo codice HTML in posizione.
Se tutto quello che si desidera modificare è il layout della pagina, il modello di pagina personalizzata deve essere pronto rapidamente! Salvare il file, assicuratevi di caricarlo sul server, e testare il tuo sito.
Passaggio 5: aggiungere una nuova intestazione o footer al modello di pagina personalizzato
Se si desidera creare un header o un footer di pagina personalizzato, sarà necessario eseguire alcune modifiche aggiuntive.
In primo luogo, creare un nuovo modello di pagina e copiare tutto il codice ‘ page. php ‘ nel modello appena creato, come abbiamo fatto in precedenza.
Ora è necessario creare un file di modello aggiuntivo che verrà utilizzato per il header o footer di pagina.
Proprio come sopra, creare un nuovo file php e metterlo nella cartella del vostro tema. Per questo esempio, chiameremo il nostro file ‘ header-Secondary. php ‘. Assicurarsi di assegnare un nome a questo file iniziando con “header-“.
Proprio come prima, copia e incolla il codice qui sotto nella parte superiore del file modello
<?php /* Template Name: Header Secondario */ ?>
Dare un nome al file, ma scegliere qualcosa di semplice in modo che sia facile da trovare in futuro.
Ora cambieremo la riga di codice che assomiglia alla riga qui sotto, nella parte superiore della pagina:
get_header(); ?>
Eliminare questa singola riga di codice e incollare la seguente riga di codice al suo posto:
get_header( ‘secondario’ ); ?>
Si noti che questo nome è specifico per l’esempio che ho preso, perché ho chiamato il mio file ‘ header-Secondario. php ‘. Sostituire “secondario” con il nome assegnato al nuovo modello di intestazione. Ad esempio, se hai chiamato “header-New. php”, Sostituisci “secondario” con “new”.
Ora il modello di pagina personalizzata approfittiamo del file ‘ header-secondario. php ‘ appena creato.
Utilizzeremo esattamente lo stesso processo per il footer di pagina, ma in questo caso dovrete modificare la riga:
<?php get_footer(); ?>
È sufficiente aggiungere ‘ footer-Secondario ‘ o qualsiasi altro nome assegnato al modello del footer diella vostra pagina personalizzata.
Come con il file ‘ page. php ‘, copiare il codice da’ header. php ‘ o ‘ footer. php ‘ dalla cartella tema del tuo sito WordPress, e incollarlo nel vostro header personalizzato o footer personalizzato. È ora possibile modificare il modello nel modo desiderato.
Passo 6: prova il tuo sito
Una volta che tutti i file vengono salvati e scaricati sul server, scegliere il nuovo modello di pagina personalizzata dalla tua nuova pagina di WordPress, e si dovrebbe vedere tutte le modifiche apportate al codice nel vostro nuovo Modello.
Ora che il modello di pagina personalizzata è a posto, prenditi una pausa, te la sei merita!