Come aggiungere PHP o JavaScript personalizzato per WPForms

Vuoi aggiungere snippet personalizzati di JavaScript o PHP al tuo sito? Questo tutorial ti offrirà diverse opzioni su come aggiungere questi snippet al tuo sito con istruzioni passo-passo per ogni opzione che sceglierai. L'aggiunta di snippet di codice personalizzati al tuo sito con PHP o JavaScript può estendere la funzionalità del tuo sito per le tue esigenze specifiche. Che si tratti di estendere la funzionalità del tuo tema WordPress o di estendere la funzionalità di qualsiasi plugin.

Con questa utile guida, potrai scegliere facilmente come desideri aggiungere gli snippet al tuo sito. Una volta selezionato il metodo di implementazione, puoi iniziare a esplorare la documentazione per sviluppatori per scegliere quali snippet desideri iniziare ad aggiungere al tuo sito!

Per dare un'occhiata alla serie di snippet disponibili, esplora la nostra documentazione per sviluppatori.

Consulta il nostro video tutorial per una visione più pratica di come aggiungere PHP o Javascript personalizzati al tuo sito.

Opzioni di implementazione

Esistono diversi approcci disponibili per aggiungere PHP o Javascript per personalizzare le tue esigenze specifiche, non solo per WPForms ma per qualsiasi codice personalizzato che desideri aggiungere.

Utilizzo del plugin WPCode (consigliato)

L'utilizzo del plugin WPCode è velocissimo e facilissimo per aggiungere snippet al tuo sito.

Uno dei tanti motivi per cui consigliamo vivamente di utilizzare questo plugin per aggiungere snippet personalizzati al tuo sito è che dispone di un controllo integrato prima di salvare il tuo snippet. Se manca un punto e virgola o viene aggiunta una parentesi extra, lo snippet non verrà salvato. Ciò impedisce che si verifichino problemi come errori JavaScript o persino errori PHP Fatali a causa di uno snippet copiato e incollato in modo errato. E sì, anche con la versione gratuita, riceverai questo controllo aggiuntivo prima che il tuo snippet venga reso attivo.

Una volta installato il plugin, naviga nel menu Code Snippets dal menu sul lato sinistro della tua dashboard di WordPress e seleziona + Add Snippet.

Successivamente, fai semplicemente clic su Add Your Custom Code (New Snippet), quindi fai clic sul pulsante blu Use Snippet per creare un nuovo snippet.

Quando appare la schermata del tuo nuovo snippet, assegna allo snippet un nome che abbia senso per te in modo che tu e gli amministratori del tuo sito ne comprendiate lo scopo. Dal menu a discesa Code Type, seleziona PHP.

Ai fini di questo tutorial, aggiungeremo il seguente snippet.

Nella sezione Anteprima codice, aggiungi il tuo snippet subito sotto <?php. Ecco un esempio da utilizzare ai fini di questa documentazione.

/**
 * Trigger submit from checkbox click
 *
 * @link https://wpforms.com/developers/how-to-automatically-submit-a-form-with-a-field-choice/
 */
function wpf_dev_automatic_submit_form() {
    ?>
    <script type="text/javascript">
    jQuery(function($){
        var event = jQuery.Event("submit");
        jQuery("input:checkbox").change(
            function()
            {
                // when any checkbox is checked, trigger this function
                if( jQuery(this).is(":checked") )
                {
                    // only run this function for the form ID 3046
                    jQuery("#wpforms-form-3046").submit();
                }
            }
        );
    });
    </script>
    <?php
}
add_action('wpforms_wp_footer_end', 'wpf_dev_automatic_submit_form', 30);

Successivamente, vedrai la sezione Inserimento. Per questo particolare snippet, selezioneremo Inserimento automatico per il Metodo di inserimento e Solo frontend per la Posizione.

Una volta aggiunto lo snippet, fai clic su Salva snippet. Questo salverà lo snippet, ma non lo attiverà automaticamente. Una volta salvato inizialmente, noterai che lo stato dello snippet è impostato su Inattivo per impostazione predefinita. È sufficiente attivare l'interruttore da Inattivo ad Attivo e fare clic su Aggiorna per impostare lo snippet su Attivo.

Creazione di un plugin specifico per il sito

Se sei un utente più avanzato e desideri mantenere tutti i tuoi script personalizzati in un unico file sul tuo sito, puoi facilmente creare il tuo plugin univoco per archiviare questi snippet.

Se desideri maggiori informazioni su come creare un plugin specifico per il sito, consulta questo tutorial.

Per creare un plugin, dovrai seguire questi passaggi.

• 1. Utilizzando il tuo editor di testo preferito, crea un nuovo file. Quindi, aggiungi le seguenti righe all'inizio del file:
  <?php
/*
Plugin Name: WPForms Custom Code Snippets
Plugin URI: https://wpforms.com/
Description: Plugin for adding custom code snippets
Author: WPForms Team
Version: 1.0
Author URI: https://wpforms.com/
*/
• 2. Salva il file come wpforms-custom-snippets.php.
• 3. Comprimi o zippa il file.
• 4. Accedi alla tua bacheca di WordPress e, sotto Plugin, fai clic su Aggiungi nuovo. Segui le istruzioni sullo schermo per caricare e attivare il file .zip appena creato.
• 5. Una volta attivato il plugin, puoi ora vedere il file da Plugin » Editor.

Utilizzo di functions.php all'interno di un tema figlio

La creazione di un tema child è (di nuovo) più per utenti esperti. Questa è una soluzione alternativa ai file del tuo tema, al tuo foglio di stile incluso nel tema, ma anche per qualsiasi funzione personalizzata che potresti voler utilizzare come quelle descritte nei tutorial e snippet per sviluppatori di WPForms.

I nostri amici di WPBeginner hanno messo insieme un eccellente articolo su come creare un tema child. Questo tutorial include anche un video da seguire.

Per questo esempio, creeremo un tema child dal tema WordPress Twenty Twenty. Per fare ciò, segui i passaggi seguenti.

• 1. Crea una nuova cartella sul tuo desktop chiamata twentytwenty-child
• 2. Crea un documento di testo con queste righe:
  <?php
/*
Theme Name: Twenty Twenty Child
Theme URI: http://yoursite.com/twenty-twenty-child/
Description: Twenty Twenty Child Theme
Author: Your name
Author URI: http://yoursite.com
Template: twentytwenty
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: twentytwentychild
*/
• 3. Salva questo file all'interno della tua cartella twentytwenty-child e chiamalo style.css.
• 4. All'interno di questa stessa cartella, crea un nuovo documento e chiamalo functions.php. L'unica cosa che questo file dovrà contenere è il tag PHP di apertura: <?php.

• 5. Comprimi o zippa la cartella twentytwenty-child.
• 6. Accedi al tuo pannello di amministrazione di WordPress e, sotto Aspetto » Temi, fai clic su Aggiungi Nuovo per caricare il file twentytwenty-child.zip che hai appena creato. Quando richiesto, attiva anche questo tema.
• 7. Ora vedrai nel tuo pannello di amministrazione di WordPress che hai attivato il tema Twenty Twenty Child.

Una volta completati questi passaggi, vedrai che hai un tema child funzionante di Twenty Twenty e un file functions.php vuoto a cui aggiungere snippet, oltre a un foglio di stile vuoto a cui puoi aggiungere il tuo CSS personalizzato.

Il tuo tema funzionerà ancora come prima, caricando prima tutti i file e gli stili necessari. Tuttavia, qualsiasi snippet personalizzato che utilizzi dalla documentazione per sviluppatori di WPForms verrebbe aggiunto al functions.php del tema child e personalizzerebbe i moduli in base agli snippet che aggiungi.

E questi sono solo alcuni dei diversi modi in cui puoi facilmente aggiungere PHP o JavaScript personalizzato al tuo sito.

Note

Quando aggiungi qualsiasi tipo di codice personalizzato al tuo sito, è importante preservare il tuo codice da eventi imprevisti. Quindi, indipendentemente dall'approccio scelto, è una buona idea eseguire sempre il backup del tuo sito. In questo modo, avrai accesso a versioni precedenti dei file di codice, se necessario.

FAQ

D: In che modo questo mi aiuta ad aggiungere codice personalizzato a WPForms?

R: Questo tutorial non è specifico per gli snippet di codice di WPForms ma per qualsiasi snippet di codice. Trova semplicemente quale opzione sopra ti è più facile per aggiungere qualsiasi snippet di codice, inclusi gli snippet di codice WPForms menzionati nella sezione Tutorial e Snippet.