Abbiamo già parlato dell'importanza dei temi leggeri di WordPress, così come limitare le (inutili) revisioni salvate in memoria e altre best practices come evitare o stare attenti alla combo Slider Revolution e Page Builders (carica molte risorse e quindi rallenta il caricamento, chiediamoci se ha senso o meno la cosa).
Oggi vediamo un altro aspetto importante, ovvero: come includere Contact Form 7 solo dove è necessario
Contact Form 7, cosa è e come funziona:
Si tratta del plugin principale di WordPress per quanto riguarda la creazione di moduli di contatto. Quindi utilizzato da moltissimi siti web. Tuttavia, ha un problema: attivando il plugin, di default il suo codice (JavaScript, CSS) viene caricato in TUTTE le pagine del sito web! Quando in realtà il modulo di contatto è presente solo nella pagina "Contatti" oppure magari un paio di pagine, "Contatti" e "Homepage". Quindi sebbene non si tratti di file pesantissimi, è concettualmente assurdo pensare di caricare il codice per il modulo di contatto in tutte le pagine di Blog o prodotti, quando appunto il modulo non è presente in quella pagina!
Codice per disabilitare Contact Form 7 dove non richiesto:
Esistono varie procedure per risolvere questo problema, fra cui installare appositi plugin. Onestamente, installare un plugin aggiuntivo per dire di rimuovere una funzionalità, concettualmente non lo ritengo la scelta migliore da fare!
Quindi vediamo la scelta migliore, ovvero scrivere uno script di codice direttamente nel file functions.php.
functions.php, dove si trova? Dove è localizzato?
Il file functions.php di WordPress è localizzato qui:
- Bacheca di amministrazione: aspetto, editor del tema (lo troviamo subito qui)
- FTP: all'interno della directory wp-includes
Prima di modificare a mano functions.php, così come altri file importanti, è consigliato aprire il client FTP nella directory specifica, avendo appena fatto un backup, così nel caso ci fosse un problema improvviso che potrebbe impedirci l'accesso via browser alla bacheca di amministrazione, trattandosi di un errore lato server (WordPress: errore HTTP 500) con un semplice copia-incolla il problema viene risolto in due secondi.
Codice da aggiungere a functions.php
Nello specifico, il codice da aggiungere (possiamo scriverlo alla fine del file functions.php) è questo:
add_action( 'wp_print_scripts', 'deregister_cf7_javascript', 100 );
function deregister_cf7_javascript() {
if ( !is_page(array(8, 10)) ) {
wp_deregister_script( 'contact-form-7' );
}
}
add_action( 'wp_print_styles', 'deregister_cf7_styles', 100 );
function deregister_cf7_styles() {
if ( !is_page(array(8, 10)) ) {
wp_deregister_style( 'contact-form-7' );
}
}
NB: il codice è corretto che sia scritto così, anche se sembra duplicato (github.com). Guardando bene infatti, prima abbiamo "script" e poi "styles", sono quindi due funzioni diverse!
Dove vediamo scritto array(8,10), questa parte va modificata in modo opportuno con l'ID della pagina! Ovvero se il form di contatto viene caricato nelle pagine con ID 15 e ID 27, scriviamo array(15,27).
Come vedere ID pagina su WordPress?
La cosa non è proprio scontata perché, salvo aver impostato i permalink con ID pagina anziché un URL personalizzato con keyword e testo "utile" per l'utente (quindi anche in ottica SEO è assolutamente molto meglio che la pagina abbia un URL del tipo sito.it/contatti piuttosto che sito.it/?id=123 oppure sito.it/123), questo ID non è subito visibile. Tuttavia, se andiamo nella pagina che ci interessa e clicchiamo su "modifica", vediamo l'ID scritto come aprametro URL, ad esempio: sito.it/wp-admin/post.php?post=123&action=edit, quindi l'ID della pagina in questo caso è 123 ed è il numero da inserire nella funzione precedente.
Spero che questa guida sia sufficientemente chiara 😀 ricordiamoci che, almeno dove possibile, prevenire il caricamento di codice (JavaScript, CSS che sia) in pagine in cui non è richiesto, è ovviamente una scelta prefedibile!
