Cum să utilizați webhook-urile cu formulare WordPress

Doriți să vă integrați formularele WordPress cu diferite aplicații și servicii web?

Dacă aveți nevoie de o modalitate simplă de a trimite date într-o aplicație web direct din formularul dvs. WordPress, webhook-urile sunt soluția perfectă. Cu un formular webhook, nu trebuie să luați ajutorul unui conector terță parte precum Zapier.

În această postare, vă vom arăta cum să utilizați webhook-urile pe formularele dvs. WordPress, astfel încât să puteți trimite cu ușurință date în timp real către aplicațiile și serviciile dvs. preferate.

Dar mai întâi, dacă ești începător, vom aborda ce sunt webhook-urile și de ce sunt importante. Rețineți că metoda pe care o vom folosi astăzi nu necesită abilități de codificare.

Ce sunt Webhook-urile?

Webhook-urile permit două aplicații web să comunice între ele. Deci, de exemplu, dacă cineva trimite un formular de comandă de achiziție pe site-ul dvs. web, puteți trimite acele date către canalul dvs. Slack pentru a actualiza echipa de produse că a fost plasată o comandă. Puteți face acest lucru atunci când obțineți un nou client potențial sau abonat.

În termeni tehnici, webhook-urile sunt apeluri HTTP definite de utilizator care sunt declanșate de un eveniment într-un sistem sursă și trimise către sistemul de destinație.

Aceasta înseamnă că atunci când un eveniment sau declanșare are loc pe site-ul dvs. web, mesajele automate sunt trimise către un serviciu conectat. Un declanșator poate fi ceva precum comentariile pe blog, înregistrările utilizatorilor de achiziție de produse și trimiterile de formulare.

Dacă vă întrebați de ce ar trebui să utilizați webhook-uri, iată câteva beneficii:

• Transferați automat informații între două servicii/aplicații
• Automatizați sarcinile și reduceți timpul de administrare
• Reduceți costul utilizării serviciilor de conectare precum Zapier și Hubspot pentru a procesa date în aplicații.

Webhook-urile sunt incredibil de utile pentru dezvoltatori și utilizatorii WordPress cunoscători de tehnologie.

Cu asta, să începem ghidul nostru pas cu pas despre cum să creați un formular webhook în WordPress.

Crearea unui formular Webhook în WordPress [Metoda ușoară]

Există multe moduri în care puteți folosi webhook-uri pentru a trimite formularele dvs. WordPress către alte aplicații web.

Vom folosi WPForms pentru acest tutorial, deoarece oferă un supliment Webhooks care este ușor de utilizat pentru oricine, inclusiv pentru începători. Nu este absolut nicio codificare implicată.

WPForms este cel mai bun plugin de generare de formulare pentru site-urile WordPress. Și ceea ce trebuie să știți este că oferă tone de șabloane prefabricate și câmpuri de formulare gata de utilizare, care vă permit să creați toate tipurile de formulare WordPress. Aceasta include comanda de produse, înregistrarea, rezervarea de întâlniri, formulare simple de contact și multe altele.

WPForms vine cu un generator de formulare prin glisare și plasare care face ca personalizarea formelor să fie o simplă simplă. Are o mulțime de suplimente și integrări pe care le puteți utiliza pentru a vă conecta la aplicații de e-mail, de plată și de marketing.

Cu programul său de completare Webhooks, vă puteți conecta cu ușurință WordPress la orice serviciu sau aplicație. Este nevoie doar de câteva clicuri pentru a activa această funcționalitate.

De asemenea, WPForms vă permite să utilizați reguli condiționate pentru a declanșa o acțiune webhook bazată pe răspunsul utilizatorului la formular. Deci, numai dacă valoarea unui câmp este îndeplinită, atunci webhook-ul va rula. Acest lucru vă oferă mai mult control asupra datelor pe care doriți să le trimiteți și către ce aplicație.

Vă puteți conecta la o mulțime de aplicații și servicii. Pentru acest tutorial, vă vom arăta cum să vă conectați la Slack. Dar rețineți că puteți folosi aceiași pași pentru a vă conecta și la alte aplicații și puncte finale.

Pasul 1: Creați o nouă aplicație Slack

Conectând formularul de webhook la Slack, puteți trimite automat mesaje și informații de pe site-ul dvs. către canalele dvs. Slack. Vă puteți actualiza membrii echipei sau departamentele atunci când o persoană trimite un formular, abandonează un formular și multe altele.

Acum, pentru a trimite date de la WordPress către un alt serviciu folosind webhooks, va trebui să creați o punte între cele două aplicații. Deci, pentru a vă conecta la Slack, va trebui să creați o aplicație Slack (punte).

Dacă sunteți nou în acest domeniu, nu vă faceți griji, este destul de ușor și vă vom ghida pas cu pas. Mai întâi, va trebui să deschideți pagina Slack API și să faceți clic pe butonul Creați o aplicație .

În următoarea fereastră pop-up, puteți alege cum doriți să creați o aplicație cu Slack. Există două opțiuni:

• De la zero
• Din manifestul unei aplicații.

Aici, vom crea o aplicație Slack de la zero. Pare multă muncă, dar durează doar câteva clicuri.

Apoi, veți vedea fereastra pop-up în care puteți adăuga numele aplicației și puteți alege locul de muncă Slack. După ce ați terminat, faceți clic pe Creare aplicație .

Aceasta deschide pagina Informații de bază. Aici, trebuie să faceți clic pe opțiunea Incoming Webhooks .

În ecranul următor, activați setările Activare webhooks primite . Acest lucru vă permite să publicați mesaje pe Slack de la servicii externe.

Odată activat, veți vedea secțiunea URL-uri Webhooks pentru spațiul dvs. de lucru pe pagină.

Acum, trebuie să creați un nou webhook pentru a obține informații din formularul dvs. WordPress. Deci, faceți clic pe butonul Adăugați un nou webhook la spațiul de lucru .

În continuare, puteți vedea fereastra de tip pop-up în care puteți selecta un canal Slack pentru a posta formularele trimise.

După ce ați ales un canal Slack, faceți clic pe Permite .

Acum, veți putea vedea noua adresă URL webhook pentru aplicația dvs. Slack.

Tot ce trebuie să faceți acum este să copiați URL-ul Webhook. Veți avea nevoie de el câțiva pași mai târziu.

Pasul 2: Instalați și activați WPForms

Odată ce aveți adresa URL a webhook-ului, o puteți adăuga la formularul WordPress.

Pentru a începe, creați un cont pe site-ul web WPForms.

Există o versiune gratuită a pluginului, dar veți avea nevoie de versiunea premium pentru a accesa funcții avansate ale formularului, cum ar fi webhooks. WPForms vine cu o garanție de rambursare a banilor 100% fără riscuri, astfel încât să puteți încerca serviciul înainte de a vă angaja.

După ce vă înregistrați, veți găsi fișierul de descărcare a pluginului și cheia de licență în fila Descărcări .

Acum, mergeți la tabloul de bord WordPress și instalați pluginul. Dacă doriți mai multe detalii, puteți consulta ghidul nostru despre cum să instalați un plugin WordPress.

Odată ce instalați și activați WPForms pe site-ul dvs., va trebui să introduceți cheia de licență pentru a vă bucura de toate funcțiile și suplimentele premium.

Înainte de a începe să vă creați formularul, trebuie să instalați suplimentul Webhooks.

Pentru aceasta, accesați fila WPForms » Suplimente și veți găsi o mulțime de suplimente care vă ajută să extindeți funcționalitatea formularelor dvs. WordPress. Aici, faceți clic pe butonul Instalați supliment pentru Webhooks Addon.

Acum, sunteți gata să vă creați formularul webhook în WordPress.

Pasul 3: Creați un formular Webhook

Pentru a crea un formular nou, mergeți la pagina WPForms » Adăugați nou , unde veți vedea o listă de șabloane prefabricate. Aceste șabloane vin pre-completate cu câmpurile de care veți avea nevoie în funcție de scopul formularului dvs. Biblioteca de șabloane include:

• Formular simplu de contact
• Solicitați un formular de cotație
• Formular de donație
• Formular de facturare/comandă
• Formular de sondaj
• Formular de sugestie

…și altele! Pentru acest tutorial, vom alege șablonul Formular de sugestie , deoarece am creat o aplicație Slack pentru feedbackul utilizatorilor în pasul anterior. Simțiți-vă liber să alegeți unul care se potrivește cel mai bine ceea ce aveți nevoie.

Tot ce trebuie să faci este să dai un nume formularului tău în partea de sus a paginii. Apoi alegeți orice șablon în funcție de nevoile dvs. sau puteți alege șablonul gol pentru a începe de la zero.

După ce selectați un șablon, veți vedea generatorul de formulare de glisare și plasare în fereastra următoare.

Dacă doriți să adăugați mai multe câmpuri, pur și simplu trageți și plasați câmpuri noi din meniul din stânga în previzualizarea formularului.

WPForms oferă multe opțiuni de personalizare, astfel încât să puteți face clic pe orice câmp pentru a le edita. Vă permite să schimbați numele câmpurilor, descrierea și setările mai avansate.

După ce ați terminat de adăugat câmpurile formularului, faceți clic pe butonul Salvare .

În pasul următor, vom afla cum să configurați webhook-uri pentru acest formular și să vă conectați aplicația Slack.

Pasul 4: Configurați un Webhook pentru Slack

Pentru ca webhook-urile să funcționeze în formularul dvs., trebuie să navigați la fila Setări » Webhooks și să faceți clic pe opțiunea Activare webhooks .

Va fi creat un nou webhook pe care îl puteți edita pentru a vă configura integrarea Slack.

În primul rând, puteți schimba numele webhook-ului. Acest lucru vă va ajuta să-l recunoașteți mai târziu.

Acum vă amintiți URL-ul Webhook pe care ați copiat-o din aplicația Slack la Pasul 1? Va trebui să-l lipiți aici în opțiunea Solicitare URL . Acest lucru vă va permite să vă conectați formularul WordPress cu alte servicii precum Slack.

După aceasta, veți vedea diverse setări pentru configurarea webhook-ului. Vom discuta aici ce face fiecare și ce să adauge la aceste câmpuri.

• Metoda de solicitare: Vă permite să alegeți ce tip de conexiune doriți să creați cu serviciul dvs. conectat. Există multe tipuri de metode HTTP pe care le puteți utiliza în funcție de tipul de conexiune pe care doriți să o creați:
  • GET : Acesta va primi date din formularul trimis și va trimite detaliile unei aplicații conectate.
  • POST : Aceasta va trimite datele unui serviciu secundar. Vom folosi solicitarea HTTP POST deoarece trebuie să postăm date din formularul dvs. pe canalul dvs. Slack.
  • PUT : vă permite să actualizați datele când rulează webhook.
  • PATCH : Acest lucru vă permite să înlocuiți datele când rulează webhook.
  • DELETE : Acest lucru vă permite să ștergeți informații atunci când acest webhook specific rulează.
• Format cerere: Această opțiune va arăta serverului prin ce tip de conținut trimiteți. Acest lucru este puțin tehnic, dar, practic, există două tipuri diferite de format de solicitare disponibile:
  • JSON : vă formatează datele într-un format aplicație/json și va seta tipul de conținut ca charset=utf-8 .
  • FORM : vă formatează datele într-un format application/x-www-form-urlencoded și va seta tipul de conținut ca charset=utf-8 .
• Secret: Dacă sunteți dezvoltator și doriți să vă integrați propriul API pentru autentificare, atunci puteți utiliza o cheie secretă. Dar pentru tutorialul nostru, nu avem nevoie de această opțiune, așa că vom lăsa acest necompletat.
• Antete de solicitare: aceasta trimite valori specifice atunci când cererea este trimisă la aplicație. Când rulează webhook-ul, câmpurile vor fi generate automat. Vom lăsa și acest câmp necompletat.
• Corpul solicitării: pentru această opțiune, trebuie să configurați tipul de mesaj și să selectați un câmp pentru a posta mesaje. Deoarece utilizatorii vor introduce sugestii în format text, vom seta Cheia la Text . Apoi, selectați câmpul în care utilizatorii își vor introduce mesajul.

După ce ați terminat cu setările solicitării webhook, faceți clic pe butonul Salvare .

Pasul 5: Configurați notificările de formular

Apoi, puteți configura notificări prin e-mail pentru formularul WordPress. Acest lucru vă permite să trimiteți e-mailuri automate administratorului, oricărui membru al echipei și clientului/utilizatorului odată ce trimit formularul.

Pentru a configura aceste fluxuri de lucru prin e-mail, mergeți la fila Setări » Notificări , bifați opțiunea Activare notificări pentru a vedea setările implicite.

Aici, puteți personaliza setările de notificare și puteți adăuga adrese de e-mail ale destinatarului.

WPForms vă permite, de asemenea, să trimiteți notificări automate prin e-mail și către utilizatorii formularului. Pentru a configura acest lucru, faceți clic pe butonul Adăugați o notificare nouă din colțul din dreapta sus al paginii.

Apoi, trebuie să utilizați opțiunea Afișare etichete inteligente și să selectați E- mail . Cu această etichetă, WPForms va detecta automat adresa de e-mail introdusă de utilizator în formular.

În secțiunea Mesaj e-mail , puteți adăuga mesajul personalizat și puteți utiliza eticheta inteligentă {all_fields} pentru a afișa toate datele din formular pe care le-a introdus utilizatorul.

Nu uitați să salvați setările la sfârșit.

Pasul 6: Personalizați mesajul de confirmare

WPForms vă permite, de asemenea, să afișați mesaje de confirmare pe partea frontală a site-ului dvs. după ce utilizatorii trimit cu succes formularul.

În fila Setări » Confirmări , veți vedea setările de confirmare. În mod implicit, Tipul de confirmare este setat la „Mesaj”, dar există 3 opțiuni în acest meniu:

• Mesaj: Adăugați un mesaj de confirmare care este afișat pe front-end după ce clienții își trimit comanda.
• Afișați pagina: redirecționați utilizatorii către orice pagină de pe site-ul dvs.
• Accesați URL (redirecționare): trimiteți utilizatorii la o anumită adresă URL.

Pentru a afla mai multe despre acest lucru, puteți consulta ghidul nostru despre cum să configurați corect notificările și confirmările de formulare.

După ce ați terminat cu setările, faceți clic pe butonul Salvare .

De asemenea, trebuie să menționăm aici că WPForms vă permite să vă integrați cu serviciul dvs. de e-mail preferat, cum ar fi Constant Contact și Mailchimp.

Trebuie pur și simplu să accesați aceasta din fila Marketing și să urmați instrucțiunile de pe ecran pentru a vă conecta contul de e-mail. În cele mai multe cazuri, va trebui să furnizați o cheie API pe care o puteți genera cu furnizorul de e-mail.

Dacă doriți să conectați și formularele online la un gateway de plată, puteți afla cum să faceți acest lucru aici: Cum să creați un formular de comandă online

Tot ce trebuie să faceți acum este să publicați formularul de webhook pe site-ul dvs. WordPress.

Pasul 7: Publicați formularul Webhooks pe site-ul dvs

Pentru a începe să trimiteți trimiteri de formulare către servicii externe, mai întâi trebuie să publicați formularul webhook. Cu blocul personalizat WPForms, puteți adăuga formularele pe orice pagină sau postați pe site-ul dvs. WordPress.

Pentru acest tutorial, vom adăuga formularul pe o nouă pagină de pe site-ul nostru. Așa că navigați la fila Pagini » Adăugați nou din panoul de administrare WP. În ecranul editorului de blocuri, adăugați un nou bloc și căutați „WPForms”.

Când adăugați blocul WPForms la pagina dvs., veți vedea un meniu drop-down care vă permite să selectați formularul webhook pe care tocmai l-ați creat.

Apoi, vă puteți publica pagina pe site-ul dvs.

Dacă utilizați editorul clasic WordPress, puteți adăuga formularul folosind butonul Adăugare formular de pe editor.

Puteți chiar să inserați formularul de webhook într-o zonă pregătită pentru widget-uri, cum ar fi un subsol sau o bară laterală. Pentru a face acest lucru, mergeți la fila Aspect » Widgeturi și trageți și plasați widgetul WPForms în bara laterală sau meniul de subsol din dreapta.

Apoi, puteți selecta formularul pe care l-ați creat din meniul derulant și puteți salva modificările.

Acum formularul dvs. de webhooks este publicat pe site-ul dvs. Când utilizatorii completează și trimit formularul, veți primi notificări Slack de pe site-ul dvs. web.

Astfel, puteți utiliza WPForms pentru a vă conecta la diferite aplicații folosind URL-uri webhook. Obțineți control complet asupra datelor pe care doriți să le preluați și să le trimiteți către alte aplicații.

Asta e tot! Sperăm că această postare te-a ajutat să înveți cum să folosești Webhooks în formularele tale WordPress. Cu WPForms, puteți crea un formular webhook și vă puteți conecta cu ușurință la un serviciu terță parte.

De asemenea, îl puteți folosi pentru a crea alte formulare profesionale WordPress, cum ar fi formulare de comandă, formulare de rezervare, formulare de înregistrare și multe altele.

Pentru următorii pași, puteți consulta aceste resurse:

• Cum să adăugați opțiunea „Salvați și continuați mai târziu” la formularele WordPress
• Cum să reduceți abandonul formularelor și să creșteți conversiile
• Cele mai bune instrumente de captare a e-mailului și generatori de formulare pentru WordPress

Aceste postări vă vor ajuta să adăugați funcția de salvare și să reluați ulterior pe formularele dvs. WordPress și să reduceți ratele de abandon al formularelor. Ultimul vă va ajuta să vă creșteți lista de email marketing.