Come inserire uno script JS o PHP in WordPress?

Condividi
Condividi su linkedin
LinkedIn
Condividi su facebook
Facebook
Condividi su twitter
Twitter
Condividi su whatsapp
WhatsApp
Condividi
Condividi su linkedin
Condividi su facebook
Condividi su twitter
Condividi su whatsapp
WordPress è senza dubbio alcuno il miglior CMS di sempre, ricco di temi professionali, soluzioni software infinite e sempre in continua evoluzione. Quasi per tutto infatti, esiste l’opportunità di scegliere il plugin già fatto e finito da installare sul nostro Sito Web.
Cosa troverai in questo articolo
Argomenti Correlati
Articolo | 13 Marzo 2019

Come inserire uno script JS o PHP in WordPress? Attraverso l’uso corretto del Tema Figlio o Child Theme e il plugin Header and Footer Scripts. Vediamo come.

WordPress è senza dubbio alcuno il miglior CMS di sempre, ricco di temi professionali, soluzioni software infinite e sempre in continua evoluzione. Quasi per tutto infatti, esiste l’opportunità di scegliere il plugin già fatto e finito da installare sul nostro Sito Web.

Ottimo certo, ma attenzione sempre al peso globale del pacchetto completo dato dal CMS, dal peso dei file media come immagini, video e da quello dei file come quelli di stile, JS o PHP.

Il problema del peso dei plugin installati

Ho bisogno di avere un plugin che mi permetta di visualizzare una data (GG-MM-AAA) fissa su ogni pagina o articolo.” – semplice necessità e di facile implementazione. Nel repository di WordPress, scelgo il plugin migliore o comunque compatibile, lo installo, attivo e lo configuro (se richiesto).

Argomenti Correlati
Articolo | 25 Marzo 2019

Nulla di più semplice e pratico se non fosse per il fatto che anche lui contribuisca ad aumentare il peso del tuo Sito Web e, quindi, a farti scendere il punteggio (score) che, ad esempio, rilevi su GTmetrix. Ogni singolo accessorio che installi è composto da uno o più file anche per eseguire una sola piccola funzione.

Ti ricordo che ottimizzare il tuo Sito Web in fatto di velocità e prestazioni, è pratica quanto mai fondamentale ai fini SEO e per un ottimale tuo Ritorno sull’Investimento (ROI).

Quindi, qualora non lo avessi già fatto, ti consiglio vivamente di utilizzare WP Rocket quanto prima per portare il tuo Sito in classe A seguendo la mia guida completa che trovi qui a fianco.

GTmetrix | Basso Score 

Problema in sintesi

Plugin a volte utili a volte no, pieni di file che incidono sulla pesantezza del Sito.

Soluzione in sintesi

Se possibile, iniettare il codice JS o PHP in modo da ridurre il peso del Sito.

Il problema dei codici da inserire manualmente

Altra questione è data dall’occasionale inserimento di codici javascript o php come quelli per tracciare a attivare determinate funzionalità.

  • AddThis: strumenti per la condivisione social.
  • Facebook Ads Pixel: misura le tue campagne pubblicitarie, ottimizzale e definisci il pubblico.
  • iubenda: generatore di Privacy e Cookie Policy
  • Google Analytics: acquisisci una conoscenza più approfondita dei tuoi clienti.
  • Google TAG Manager: gestisci tutti i tuoi tag senza modificare il codice.
  • ShareThis: strumenti per la condivisione social.

Prendiamo ad esempio il codice di Google TAG Manager. Questo è scritto in linguaggio JS e deve essere inserito in ogni parte del Sito Web:

<!– Google Tag Manager –>
<script async=”async”>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({‘gtm.start’:
new Date().getTime(),event:’gtm.js’});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!=’dataLayer’?’&l=’+l:”;j.async=true;j.src=
‘https://www.googletagmanager.com/gtm.js?id=’+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,’script’,’dataLayer’,’XXXXXXXX’);</script>
<!– End Google Tag Manager –>

Altro ancora, ma sempre in questa categoria, script o meta informazioni che dovrebbero essere inserite nella parte superiore di una pagina/articolo (head). Un esempio su tutti il codice html per la verifica della proprietà del tuo Sito Web sulla Search Console di Google:

<meta name=”google-site-verification” content=”xxxxxxxxxxxx” />

In tal senso, il problema nasce non dalla pesantezza di inutili plugin piuttosto dal fatto che dovresti andare a modificare il core del tuo tema. Ora, ammesso di avere lo skill per sapere dove intervenire, la cosa grave riguarderebbe i futuri update. Ogni aggiornamento modificherebbe i file e, quindi, perderesti tutti i dati inseriti a mano.

Problema in sintesi

Codici JS o PHP da iniettare nel tema con il rischio di perdere le modifiche dopo eventuali aggiornamenti

Soluzione in sintesi

Se possibile, iniettare il codice JS o PHP senza perdere le modifiche.

Tema figlio e il plugin Header and Footer Scripts

Tema figlio o Child Theme

Argomenti Correlati
Articolo | 15 Marzo 2019

Dunque, come inserire uno script JS o PHP in WordPress?

Per risolvere questo problema ci vengono in aiuto due splendide soluzioni. La prima riguarda l’uso di quello che viene comunemente definito Tema Figlio o Child Theme. Questa versione ridotta del tema principale è ormai pratica comune ed è molto difficile non trovarla. Un tema professionale di un certo calibro (ti invito a leggere quali sono i migliori temi professionali in circolazione), di default, offre sempre questa possibilità.

Applicarla è molto semplice, si installa come fosse un normalissimo tema quindi devi scaricare il pacchetto compresso dal tuo fornitore e poi caricarlo su WordPress come faresti per qualsiasi altro template.

Aspetto → Aggiungi nuovo tema → Carica tema → Scegli file

Una volta installato, attivalo come tema principale ed il gioco è fatto.

Child Theme 

Il tema figlio è collegato direttamente a quello principale, precedentemente installato, e contiene un file CSS per gestire gli stili e un file functions-php per la modifica degli script. Sarà proprio questa la nostra soluzione per capire come inserire uno script JS o PHP in WordPress. La sua utilità estrema sta proprio qui, ovvero nel suo utilizzo al fine di apportare modifiche al Sito senza rischiare di perderle in futuro.

[bctt tweet=”In WordPress, per sicurezza, accertati sempre di avere solo tre temi installati. quello che hai scelto, il suo child e l’ultimo default disponibile del CMS.” username=”glpartengo”]

Dove si trova?

Il file functions.php (raggiungibile ovviamente anche tramite un Client FTP) è modificabile semplicemente raggiungendolo dal backend di WirdPress

Aspetto → Editor del tema → functions.php

Child Theme | functions.php 

Come si usa?

Questo file è stato realizzato per l’inserimento manuale di codici in linguaggio PHP; da non utilizzare per script JS!

Richiede certamente uno skill particolare ma è pur vero che in rete, si trovino milioni di tutorial che spiegano passo a passo eventuali implementazioni dei codici.

Ad esempio, torniamo a quello relativo alla meta informazione per la Search Console. Avremmo dovuto aprire la pagine dinamica del nostro tema principale, copiarlo dentro e non aggiornare MAI PIU’ il tema. Impossibile!

Con questa soluzione basta aprire l’editor del file come sopra descritto e copiarvi dentro il codice seguente che verrà così, “iniettato” in modo silente in tutto il Sito.

<?php
function google_header_metadata() {
?>
<meta name=”google-site-verification” content=”xxxxxxxxxxxx” />
}
add_action( ‘wp_head’, ‘google_header_metadata’ );
?>

Header and Footer Scripts

Questa soluzione, un semplice plugin, ti permette di inserire in modo dinamico e semplice, tutti i codici JS necessari al tuo Sito Web, senza dover modificare nessuna pagina del tema e senza appesantire ulteriormente il CMS.

Plugin → Aggiungi nuovo → Cerca nel repository

Plugin Header and Footer Scripts 

Dove si trova?

Una volta installato e attivato, raggiungerlo è facilissimo.

Impostazioni → Header and Footer Scripts

Plugin Header and Footer Scripts 

Come si usa?

In modo analogo a quanto detto per il file functions.php, anche in questo caso è sufficiente prendere il codice che ci interessa, come quello ad esempio di Google TAG Manager ad inizio articolo ed inserirlo (incolla) nella relativa sezione; in questo caso HEADER.

Plugin Header and Footer Scripts 

Conclusioni

Come inserire uno script JS o PHP in WordPress? Ora lo sappiamo, due piccoli trucchetti, due piccole ma potenti soluzioni per garantire al tuo Sito Web un controllo totale sulla pulizia e velocità del codice. Non immagini quanto sia possibile fare con questi due, quindi … non ti rimane altro che provare. 😉

Per ora … a presto e grazie.

Condividi su linkedin
Condividi su facebook
Condividi su twitter
Condividi su whatsapp
Gian Luca Partengo

Gian Luca Partengo

Professionista del Web e del Marketing da oltre 20 anni. Ha lavorato per importanti Agenzie e Aziende italiane e ha creato e seguito passo a passo il Brand di numerosi Clienti. Oggi sviluppa progetti altamente professionali a partire da un'analisi sullo stato di salute di un Sito Web e della sua SEO Organica, fornendo anche consulenza a privati e aziende.

Potrebbero Interessarti anche ...

MAIN PARTNERS

Get in Touch

Ci sono molti modi per iniziare una conoscenza o rimanere in contatto e BRiDWEB ti mette a disposizione i migliori: modulo di contatto, e-mail, WhatsApp o chiamata. Scegli tu quale usare.