Come usare i Webhook con i moduli WordPress

Vuoi integrare i tuoi moduli WordPress con diverse applicazioni e servizi web?

Se hai bisogno di un modo semplice per inviare dati a un'applicazione web direttamente dal tuo modulo WordPress, i webhook sono la soluzione perfetta. Con un modulo webhook, non è necessario l'aiuto di un connettore di terze parti come Zapier.

In questo post, ti mostreremo come utilizzare i webhook sui tuoi moduli WordPress in modo da poter inviare facilmente dati in tempo reale alle tue app e ai tuoi servizi preferiti.

Ma prima, se sei un principiante, spiegheremo cosa sono i webhook e perché sono importanti. Tieni presente che il metodo che utilizzeremo oggi non richiede alcuna competenza di codifica.

Cosa sono i Webhook?

I webhook consentono a due applicazioni web di comunicare tra loro. Quindi, ad esempio, se qualcuno invia un modulo d'ordine sul tuo sito web, puoi inviare tali dati al tuo canale Slack per informare il tuo team di prodotto che è stato effettuato un ordine. Puoi farlo anche quando ricevi un nuovo lead o un nuovo iscritto.

In termini tecnici, i webhook sono callback HTTP definiti dall'utente che vengono attivati da un evento in un sistema sorgente e inviati al sistema di destinazione.

Ciò significa che quando si verifica un evento o un trigger sul tuo sito web, vengono inviati messaggi automatici a un servizio connesso. Un trigger può essere qualsiasi cosa, come commenti sul blog, acquisti di prodotti, registrazioni di utenti e invii di moduli.

Se ti stai chiedendo perché dovresti usare i webhook, ecco alcuni vantaggi:

• Trasferire informazioni tra due servizi/app automaticamente
• Automatizzare le attività e ridurre il tempo amministrativo
• Ridurre il costo dell'utilizzo di servizi connettori come Zapier e Hubspot per elaborare dati nelle app.

I webhook sono incredibilmente utili per sviluppatori e utenti WordPress esperti di tecnologia.

Detto questo, iniziamo la nostra guida passo passo su come creare un modulo webhook in WordPress.

Creazione di un Modulo Webhook in WordPress [Metodo Semplice]

Ci sono molti modi in cui puoi utilizzare i webhook per inviare le tue sottomissioni di moduli WordPress ad altre applicazioni web.

Utilizzeremo WPForms per questo tutorial poiché offre un componente aggiuntivo Webhooks facile da usare per chiunque, compresi i principianti. Non è assolutamente richiesta alcuna codifica.

WPForms è il miglior plugin per la creazione di moduli per siti WordPress. E quello che devi sapere è che offre tonnellate di modelli predefiniti e campi modulo pronti all'uso che ti consentono di creare tutti i tipi di moduli WordPress. Questi includono ordini di prodotti, registrazioni, prenotazioni di appuntamenti, semplici moduli di contatto e altro ancora.

WPForms viene fornito con un generatore di moduli drag and drop che rende la personalizzazione dei moduli un gioco da ragazzi. Ha tonnellate di componenti aggiuntivi e integrazioni che puoi utilizzare per connetterti ad app di posta elettronica, pagamento e marketing.

Con il suo Componente aggiuntivo Webhooks, puoi facilmente connettere il tuo WordPress con qualsiasi servizio o app. Bastano pochi clic per abilitare questa funzionalità.

Inoltre, WPForms ti consente di utilizzare regole condizionali per attivare un'azione webhook in base alla risposta dell'utente al modulo. Quindi, solo se il valore di un campo viene soddisfatto, il webhook verrà eseguito. Questo ti dà un maggiore controllo sui dati che desideri inviare e a quale app.

Puoi connetterti a tantissime app e servizi. Per questo tutorial, ti mostreremo come connetterti a Slack. Ma ricorda, puoi usare gli stessi passaggi per connetterti ad altre app e endpoint.

Ora, devi creare un nuovo webhook per ottenere informazioni dal tuo modulo WordPress. Quindi, fai clic sul pulsante Aggiungi nuovo webhook allo spazio di lavoro.

Connettendo il tuo modulo webhook a Slack, puoi inviare automaticamente messaggi e informazioni dal tuo sito web ai tuoi canali Slack. Puoi aggiornare i membri del tuo team o i reparti quando una persona invia un modulo, abbandona un modulo e altro ancora.

Ora, per inviare dati da WordPress a un altro servizio utilizzando i webhook, dovrai creare un ponte tra le due app. Quindi, per connetterti a Slack, dovrai creare un'app Slack (il ponte).

Se sei nuovo in questo, non preoccuparti, è abbastanza facile e ti guideremo passo dopo passo. Per prima cosa, dovrai aprire la pagina API di Slack e fare clic sul pulsante Crea un'app.

Nella finestra popup successiva, puoi scegliere come vuoi creare un'app con Slack. Ci sono due opzioni:

• Da zero
• Da un manifest dell'app.

Qui, creeremo un'app Slack da zero. Sembra molto lavoro, ma in realtà richiede solo pochi clic.

Quindi, vedrai il popup dove puoi aggiungere il nome dell'app e scegliere il tuo spazio di lavoro Slack. Una volta fatto, fai clic su Crea App.

Questo apre la pagina Informazioni di base. Qui, devi fare clic sull'opzione Webhook in entrata.

Nella schermata successiva, abilita le impostazioni Attiva Webhook in entrata. Questo ti consente di inviare messaggi su Slack da servizi esterni.

Una volta abilitato, vedrai la sezione URL Webhook per il tuo spazio di lavoro nella pagina.

Ora, devi creare un nuovo webhook per ottenere informazioni dal tuo modulo WordPress. Quindi, fai clic sul pulsante Aggiungi nuovo webhook all'area di lavoro.

Successivamente, puoi vedere il popup dove puoi selezionare un canale Slack per pubblicare le tue richieste di modulo.

Dopo aver scelto un canale Slack, fai clic su Consenti.

Ora, sarai in grado di vedere il nuovo URL webhook per la tua app Slack.

Tutto quello che devi fare ora è copiare l'URL del Webhook. Ti servirà qualche passaggio più avanti.

Passaggio 2: Installa e Attiva WPForms

Una volta ottenuto l'URL del webhook, puoi aggiungerlo al tuo modulo WordPress.

Per iniziare, iscriviti per un account sul sito web di WPForms.

Esiste una versione gratuita del plugin ma avrai bisogno della versione premium per accedere alle funzionalità avanzate del modulo come i webhook. WPForms viene fornito con una garanzia di rimborso al 100% priva di rischi, quindi puoi provare il servizio prima di impegnarti.

Dopo esserti registrato, troverai il file di download del plugin e la chiave di licenza nella scheda Download.

Ora, vai alla tua bacheca di WordPress e installa il plugin. Se desideri maggiori dettagli, puoi consultare la nostra guida su come installare un plugin di WordPress.

Una volta installato e attivato WPForms sul tuo sito, dovrai inserire la tua chiave di licenza per godere di tutte le tue funzionalità e componenti aggiuntivi premium.

Prima di iniziare a creare il tuo modulo, devi installare il componente aggiuntivo Webhooks.

Per fare ci ilde{o}, vai alla scheda WPForms » Addons e troverai tantissimi addon che ti aiuteranno ad estendere le funzionalit ilde{i} del tuo modulo WordPress. Qui, fai clic sul pulsante Installa Addon per Webhooks Addon.

Ora sei pronto per creare il tuo modulo webhook in WordPress.

Passaggio 3: Crea un modulo Webhook

Per creare un nuovo modulo, vai alla pagina WPForms » Aggiungi Nuovo dove vedrai un elenco di modelli predefiniti. Questi modelli sono precompilati con i campi di cui avrai bisogno in base allo scopo del tuo modulo. La libreria di modelli include:

• Modulo di contatto semplice
• Modulo di richiesta preventivo
• Modulo di donazione
• Modulo di fatturazione/ordine
• Modulo di sondaggio
• Modulo di suggerimento

...e altro ancora! Per questo tutorial, sceglieremo il modello Modulo di suggerimento perch ilde{e} abbiamo creato un'app Slack per il feedback degli utenti nel passaggio precedente. Sentiti libero di sceglierne uno che meglio si adatta alle tue esigenze.

Tutto quello che devi fare ilde{e} dare un nome al tuo modulo nella parte superiore della pagina. Quindi scegli un modello a seconda delle tue esigenze o puoi scegliere il modello vuoto per iniziare da zero.

Dopo aver selezionato un modello, vedrai il costruttore di moduli drag and drop nella finestra successiva.

Se vuoi aggiungere altri campi, trascina e rilascia semplicemente nuovi campi dal menu di sinistra nell'anteprima del modulo.

WPForms offre molte opzioni di personalizzazione, quindi puoi fare clic su qualsiasi campo per modificarlo. Ti consente di modificare i nomi dei campi, le descrizioni e impostazioni pi ilde{u} avanzate.

Una volta terminato di aggiungere i campi del modulo, fai clic sul pulsante Salva.

Nel prossimo passaggio, impareremo come configurare i webhook per questo modulo e connettere la tua app Slack.

Passaggio 4: Configura un Webhook per Slack

Affinch ilde{e} i webhook funzionino sul tuo modulo, devi navigare alla scheda Impostazioni » Webhooks e fare clic sull'opzione Abilita Webhooks.

Verr ilde{a} creato un nuovo webhook che puoi modificare per configurare la tua integrazione Slack.

Innanzitutto, puoi cambiare il nome del webhook. Questo ti aiuter ilde{a} a riconoscerlo in seguito.

Ora ricorda l'URL del Webhook che hai copiato dalla tua app Slack nel Passaggio 1? Dovrai incollarlo qui nell'opzione URL Richiesta. Questo ti permetter ilde{a} di connettere il tuo modulo WordPress con altri servizi come Slack.

Dopo questo, vedrai varie impostazioni per la configurazione del tuo webhook. Discuteremo cosa fa ciascuna e cosa aggiungere a questi campi qui.

• Metodo Richiesta: Ti consente di scegliere che tipo di connessione vuoi creare con il tuo servizio connesso. Ci sono molti tipi di metodi HTTP che puoi usare in base al tipo di connessione che stai cercando di creare:
  • GET: Questo otterrr ilde{a} dati dal modulo inviato e invier ilde{a} i dettagli a un'app connessa.
  • POST: Questo invier ilde{a} i dati a un servizio secondario. Useremo la richiesta HTTP POST in quanto dobbiamo inviare dati dal tuo modulo al tuo canale Slack.
  • PUT: Questo ti consente di aggiornare i dati quando il tuo webhook viene eseguito.
  • PATCH: Questo ti consente di sostituire i dati quando il tuo webhook viene eseguito.
  • ELIMINA: Questo ti consente di eliminare informazioni quando questo specifico webhook viene eseguito.
• Formato Richiesta: Questa opzione mostrerà al server quale tipo di contenuto stai inviando. È un po' tecnico, ma fondamentalmente ci sono due diversi tipi di formato richiesta disponibili:
  • JSON: Formatta i tuoi dati in un formato application/json e imposterà il tipo di contenuto come charset=utf-8.
  • FORM: Formatta i tuoi dati in un formato application/x-www-form-urlencoded e imposterà il tipo di contenuto come charset=utf-8.
• Segreto: Se sei uno sviluppatore e desideri integrare la tua API per l'autenticazione, puoi utilizzare una chiave segreta. Ma per il nostro tutorial, non abbiamo bisogno di questa opzione, quindi la lasceremo vuota.
• Intestazioni Richiesta: Invia valori specifici quando la richiesta viene inviata all'app. Quando il webhook viene eseguito, i campi verranno generati automaticamente. Lasceremo anche questo campo vuoto.
• Corpo Richiesta: Per questa opzione, devi impostare il tipo di messaggio e selezionare un campo per inviare messaggi. Poiché gli utenti inseriranno suggerimenti in formato testo, imposteremo la Chiave su Testo. Quindi, seleziona il campo in cui gli utenti inseriranno il loro messaggio.

Dopo aver terminato le impostazioni della richiesta webhook, fai clic sul pulsante Salva.

Passaggio 5: Imposta le Notifiche del Modulo

Successivamente, puoi impostare le notifiche via email per il modulo WordPress. Questo ti consente di inviare email automatiche all'amministratore, a qualsiasi membro del team e al cliente/utente dopo che hanno inviato il modulo.

Per impostare questi flussi di lavoro via email, vai alla scheda Impostazioni » Notifiche, seleziona l'opzione Abilita Notifiche per vedere le impostazioni predefinite.

Qui puoi personalizzare le impostazioni di notifica e aggiungere indirizzi email dei destinatari.

WPForms ti consente anche di inviare notifiche email automatiche agli utenti del modulo. Per impostare questo, fai clic sul pulsante Aggiungi Nuova Notifica nell'angolo in alto a destra della pagina.

Quindi, devi utilizzare l'opzione Mostra Smart Tag e selezionare Email. Con questo tag, WPForms rileverà automaticamente l'indirizzo email inserito dall'utente nel modulo.

Nella sezione Messaggio Email, puoi aggiungere il tuo messaggio personalizzato e utilizzare lo smart tag {all_fields} per mostrare tutti i dati del modulo inseriti dall'utente.

Non dimenticare di salvare le tue impostazioni alla fine.

Passaggio 6: Personalizza il Messaggio di Conferma

WPForms ti consente anche di visualizzare messaggi di conferma sul frontend del tuo sito dopo che gli utenti hanno inviato correttamente il modulo.

Nella scheda Impostazioni » Conferme, vedrai le impostazioni di conferma. Per impostazione predefinita, il Tipo di Conferma è impostato su 'Messaggio', ma ci sono 3 opzioni in questo menu:

• Messaggio: Aggiungi un messaggio di conferma che viene visualizzato sul frontend dopo che i clienti hanno inviato il loro ordine. 
• Mostra Pagina: Reindirizza i tuoi utenti a qualsiasi pagina del tuo sito.
• Vai all'URL (Reindirizzamento): Invia gli utenti a un URL specifico.

Per saperne di più, puoi consultare la nostra guida su come impostare notifiche e conferme dei moduli nel modo corretto.

Una volta terminate le impostazioni, fai clic sul pulsante Salva.

Dobbiamo anche menzionare qui che WPForms ti consente di integrarti con il tuo servizio email preferito come Constant Contact e Mailchimp.

Devi semplicemente accedere a questa opzione sotto la scheda Marketing e seguire le istruzioni a schermo per collegare il tuo account email. Nella maggior parte dei casi, dovrai fornire una chiave API che puoi generare con il provider di posta elettronica.

Se desideri collegare anche i moduli online a un gateway di pagamento, puoi imparare come fare qui: Come Creare un Modulo d'Ordine Online

Tutto ciò che devi fare ora è pubblicare il tuo modulo webhook sul tuo sito WordPress.

Passaggio 7: Pubblica il Modulo Webhook sul Tuo Sito

Per iniziare a inviare le richieste del modulo a servizi esterni, devi prima pubblicare il modulo webhook. Con il blocco personalizzato di WPForms, puoi aggiungere i tuoi moduli a qualsiasi pagina o post sul tuo sito WordPress.

Per questo tutorial, aggiungeremo il modulo a una nuova pagina sul nostro sito. Quindi naviga alla scheda Pagine » Aggiungi Nuova nel tuo pannello di amministrazione WP. Nella schermata dell'editor a blocchi, aggiungi un nuovo blocco e cerca 'WPForms'.

Quando aggiungi il blocco WPForms alla tua pagina, vedrai un menu a discesa che ti permetterà di selezionare il modulo webhook che hai appena creato.

Quindi, puoi pubblicare la tua pagina sul tuo sito.

Se stai usando l'editor classico di WordPress, puoi aggiungere il modulo utilizzando il pulsante Aggiungi Modulo sull'editor.

Puoi persino inserire il tuo modulo webhook in un'area pronta per i widget come un piè di pagina o una barra laterale. Per fare ciò, vai alla scheda Aspetto » Widget e trascina e rilascia il widget WPForms nel menu della barra laterale o del piè di pagina sulla destra.

Quindi, puoi selezionare il modulo che hai creato dal menu a discesa e salvare le modifiche.

Ora il tuo modulo webhook è pubblicato sul tuo sito. Quando gli utenti compilano e inviano il modulo, riceverai notifiche Slack dal tuo sito web.

In questo modo, puoi utilizzare WPForms per connetterti a diverse app utilizzando URL webhook. Hai il controllo completo sui dati che desideri recuperare e inviare ad altre app.

Tutto qui! Speriamo che questo post ti abbia aiutato a capire come utilizzare i Webhook sui tuoi moduli WordPress. Con WPForms, puoi creare un modulo webhook e connetterti facilmente a un servizio di terze parti.

Puoi anche usarlo per creare altri moduli professionali per WordPress come moduli d'ordine, moduli di prenotazione, moduli di registrazione e altro ancora. Potresti anche voler imparare come usare WPForms per salvare i dati del modulo nel database di WordPress.

Per i tuoi prossimi passi, puoi consultare queste risorse:

• Come Aggiungere l'Opzione 'Salva e Continua Più Tardi' ai Moduli di WordPress
• Come ridurre l'abbandono dei moduli e aumentare le conversioni
• I migliori strumenti di acquisizione email e moduli per WordPress

Questi post ti aiuteranno ad aggiungere la funzionalità di salvataggio e ripresa successiva ai tuoi moduli WordPress e a ridurre i tassi di abbandono dei moduli. L'ultimo ti aiuterà a far crescere la tua lista di email marketing.