Cum să adăugați un formular de contact glisant în WordPress (Tutorial ușor)

Poate fi frustrant atunci când oamenii vizitează site-ul dvs. WordPress, dar nu iau niciodată legătura. Poate că navighează pe paginile dvs., chiar petrec câteva minute citind, dar formularul dvs. de contact nu primește nicio trimitere.

Adesea, nu este vorba că vizitatorii nu vor să se conecteze. Pur și simplu nu văd o modalitate ușoară sau atrăgătoare de a face acest lucru.

Aici intervine un formular de contact glisant, care poate face o mare diferență. Acesta apare ușor din lateral, oferind ajutor exact atunci când vizitatorii au nevoie, fără a le întrerupe experiența.

În acest ghid, vă vom arăta cum să adăugați un formular de contact glisant pe site-ul dvs. WordPress pas cu pas, folosind o metodă fiabilă și testată. 🧑‍💻

De ce să adăugați un formular de contact glisant în WordPress? 💭

Un formular de contact glisant face mai ușor pentru vizitatori să ia legătura *fără* a părăsi pagina pe care se află. Acesta glisează ușor din lateral, atrage atenția și permite utilizatorilor să trimită un mesaj rapid exact atunci când au nevoie de ajutor.

Mulți proprietari de afaceri mici adaugă o pagină de contact, sperând că vizitatorii o vor folosi și că aceasta va ajuta la dezvoltarea afacerii lor.

Dar, în realitate, majoritatea oamenilor pleacă fără să ia legătura. De aceea veți vedea site-uri populare folosind pop-up-uri de contact, slidere sau butoane plutitoare pentru a facilita comunicarea.

Aceste opțiuni animate și interactive atrag atenția asupra formularului de contact, făcând site-ul dvs. să pară mai interactiv și mai abordabil. Astfel, puteți transforma vizitatorii ocazionali în clienți potențiali sau clienți reali mai ușor.

Acestea fiind spuse, vom explica cum să creați un formular de contact glisant în WordPress. Iată o prezentare generală rapidă a tuturor lucrurilor pe care le vom acoperi în acest ghid:

• Adăugarea unui formular de contact glisant în WordPress
• Pasul 1: Crearea unui formular de contact în WordPress
• Pasul 2: Crearea unei campanii glisante în OptinMonster
• Pasul 3: Afișarea formularului de contact glisant în WordPress
• Întrebări frecvente: Adăugați un formular de contact glisant în WordPress
• Resurse bonus pentru utilizarea formularelor WordPress

Să începem.

Adăugarea unui formular de contact glisant în WordPress

Pentru acest tutorial, veți avea nevoie de WPForms. Este cel mai bun plugin pentru formulare de contact WordPress de pe piață, deoarece este atât ușor, cât și puternic.

ℹ️ Notă: WPForms alimentează toate formularele noastre de la WPBeginner, inclusiv formularul nostru de contact. Este ușor de utilizat, extrem de personalizabil, iar noile instrumente AI fac crearea formularelor mai rapidă ca niciodată.

Curios cum funcționează? Consultați recenzia noastră completă despre WPForms pentru a explora tot ce poate face.

Pentru a urma acest tutorial, puteți utiliza versiunea gratuită a pluginului de formular de contact WPForms dacă nu aveți nevoie de niciuna dintre funcționalitățile sale premium (logică condiționată, integrări avansate și multe altele).

Apoi, veți conecta formularul cu OptinMonster. Este cel mai puternic software de optimizare a conversiilor și vă ajută să transformați vizitatorii abandonați ai site-ului web în clienți.

Pasul 1: Crearea unui formular de contact în WordPress

Mai întâi, trebuie să instalați și să activați pluginul WPForms. Din zona de administrare WordPress, accesați Pluginuri » Adăugare Plugin Nou pentru a începe.

Pe ecranul următor, poți folosi bara de căutare pentru a găsi rapid plugin-ul WPForms.

În rezultatul căutării, pur și simplu faceți clic pe „Instalare acum” și apoi pe „Activare” pentru a finaliza procesul.

Pentru mai multe detalii, consultați ghidul nostru pas cu pas despre cum se instalează un plugin WordPress

La activare, trebuie să vizitezi pagina WPForms » Adaugă nou pentru a crea un nou formular de contact. Aceasta va lansa interfața de construire WPForms.

Introduceți un nume pentru formularul dvs. de contact în partea de sus a paginii.

După aceea, trebuie să treceți cursorul mouse-ului peste șablonul „Formular de contact simplu” și să faceți clic pe butonul „Utilizare șablon”.

WPForms va crea un nou formular bazat pe șablonul Contact Form simplu.

Veți vedea previzualizarea formularului în panoul din dreapta al constructorului de formulare. Puteți face clic pe orice câmp pentru a-l edita sau pentru a adăuga noi câmpuri de formular din coloana din stânga.

Pentru instrucțiuni pas cu pas, vă rugăm să consultați ghidul nostru despre cum să creezi un formular de contact WordPress.

După ce ați terminat de editat formularul, faceți clic pe butonul „Salvare” pentru a vă stoca modificările.

Apoi, trebuie să faceți clic pe butonul „Încorporare” din partea de sus pentru a obține codul de încorporare al formularului dvs.

Aceasta va deschide o fereastră pop-up care afișează mai multe moduri de a încorpora formularul dvs.. Pur și simplu faceți clic pe linkul „utilizați un shortcode” și apoi copiați shortcode-ul. Veți avea nevoie de el în pasul următor.

Pasul 2: Crearea unei campanii glisante în OptinMonster

Acum, vom crea o campanie glisantă care va afișa formularul de contact pe care l-ați creat în primul pas.

Trebuie să instalezi și să activezi pluginul gratuit OptinMonster. Acest plugin acționează ca un conector între site-ul tău web și contul tău OptinMonster.

ℹ️ Notă: Folosim OptinMonster la WPBeginner pentru a promova oferte exclusive prin pop-up-uri, slide-in-uri și bannere. Este un instrument versatil care stimulează implicarea și ne crește lista de email fără efort.

Doriți să aflați mai multe? Consultați recenzia noastră completă despre OptinMonster pentru a explora funcționalitățile sale.

Pentru început, să vă creăm contul OptinMonster. Pe site-ul lor, faceți clic pe butonul „Get OptinMonster Now”, selectați un plan și finalizați procesul de înregistrare.

După ce ați terminat, veți fi redirecționat către tabloul de bord OptinMonster.

Acum, accesați Pluginuri » Adăugare Plugin Nou din tabloul de bord WordPress pentru a instala pluginul OptinMonster.

Apoi, pur și simplu folosiți funcția de căutare pentru a găsi rapid pluginul OptinMonster.

Odată ce l-ați găsit, faceți clic pe butonul „Instalare Acum” și apoi pe „Activare”.

Pentru detalii, puteți consulta ghidul nostru despre cum să instalați un plugin WordPress.

La activare, expertul de configurare OptinMonster va porni automat. Acesta vă va permite să creați un cont nou sau să conectați un cont existent.

După ce creați sau conectați contul dvs. OptinMonster, puteți crea o nouă campanie de înscriere.

Navigați pur și simplu la pagina OptinMonster » Campanii și faceți clic pe butonul „Adăugare nouă”. Dacă nu aveți încă nicio campanie, puteți face clic și pe butonul „Creați prima campanie”.

OptinMonster oferă diferite tipuri de campanii dinamice.

Pentru acest tutorial, vom folosi campania „Slide-in”.

Continuă și dă clic pentru a selecta „Slide-in” ca tip de campanie.

Apoi, trebuie să selectați șablonul. OptinMonster oferă mai multe șabloane gata făcute.

Pentru acest tutorial, trebuie să alegeți „Canvas”.

Poți găsi acest lucru ușor folosind funcția de căutare, apoi dă clic pe butonul „Utilizează șablon” care apare atunci când treci cu mouse-ul peste el.

Imediat ce selectați șablonul, vi se va cere să furnizați un nume pentru campania dvs. Acest lucru vă va ajuta să localizați cu ușurință campania în tabloul de bord OptinMonster.

Apoi, faceți clic pe butonul „Start Building”.

Acum, OptinMonster va încărca interfața sa de creare a campaniilor.

Veți vedea o previzualizare live a campaniei dvs. în dreapta și diferitele blocuri din meniul din stânga.

Pur și simplu găsiți blocul WPForms, apoi trageți-l și plasați-l în zona de previzualizare.

Acum, blocul WPForms va apărea pe șablon și veți vedea setările sale în stânga.

Va trebui să faceți clic pe meniul derulant „Selecție formular” din setările blocului din meniul din stânga și să selectați opțiunea „Adăugare scurtcod manual”.

Acest lucru vă va permite să inserați shortcode-ul formularului de contact WPForms shortcode-ul formularului de contact în bloc. L-ați copiat mai devreme în tutorial.

Acum, puteți șterge sau personaliza celelalte blocuri de pe formular.

De exemplu, puteți schimba imaginea făcând clic pe ea și folosind setările din stânga.

Sau îl puteți șterge pur și simplu trecând mouse-ul peste bloc și făcând clic pe pictograma „Trash”.

Pentru acest tutorial, vom șterge celelalte blocuri din optin, lăsând doar blocul WPForms.

Dacă dorești, poți, de asemenea, să dai clic pe fundal și să alegi o culoare, un gradient sau o imagine pentru opțiune din panoul de setări din stânga.

Apoi, trebuie să dai clic pe fila „Reguli de afișare” din partea de sus a paginii pentru a configura când și cum va fi afișată opțiunea.

Ar trebui să vă uitați la fila „Condiții” din partea de jos a ecranului. Aici, setările implicite vor afișa optin-ul pe orice pagină după 5 secunde. Acest lucru ar trebui să funcționeze pentru majoritatea site-urilor web.

Apoi, ar trebui să faceți clic pe fila „Acțiuni” din partea de jos a paginii.

În mod implicit, nu există animație sau sunet atunci când se afișează optin-ul. Dacă doriți, puteți selecta o opțiune din meniul derulant „Animate with MonsterEffects”, cum ar fi „Slide In (Left)”.

Când ați terminat de configurat Regulile de Afișare, trebuie să faceți clic pe butonul „Salvare” din partea de sus pentru a vă stoca setările și apoi să faceți clic pe butonul „Publicare”.

Pe ecranul următor, trebuie să schimbi Starea publicării în „Publică”. Acest lucru va face ca opțiunea să fie disponibilă pe blogul tău WordPress sau pe site-ul tău web.

Pasul 3: Afișarea formularului de contact glisant în WordPress

Acum că ați creat atât formularul de contact, cât și campania de tip slide-out, sunteți gata să le afișați pe site-ul dvs. web.

Puteți închide pagina Publish Status făcând clic pe pictograma „X” din colțul din dreapta sus. Acum ar trebui să vedeți o pagină care vă permite să configurați „WordPress Output Settings” și „Visibility & Status” ale optin-ului.

Când derulați în jos la secțiunea „Vizibilitate și stare”, veți dori, în mod normal, ca „Toți vizitatorii și utilizatorii conectați” să vadă campania. Cu toate acestea, există opțiuni pentru „Doar vizitatori” și „Doar utilizatori conectați‘.

Odată ce ai făcut acest lucru, ar trebui să dai clic pe butonul „Salvează modificările” pentru a stoca setările tale.

Puteți vizita acum site-ul dvs. web pentru a vedea formularul de contact de tip slide-out în acțiune:

Întrebări frecvente: Adăugați un formular de contact glisant în WordPress

Acum că știți cum să adăugați un formular de contact de tip slide-out în WordPress, să trecem în revistă câteva întrebări frecvente pe care utilizatorii le pun adesea.

Care este dimensiunea ideală pentru o casetă de tip slide-out?

Aproximativ 400–600 px lățime și 300–400 px înălțime funcționează de obicei bine. Ar trebui să iasă în evidență fără a acoperi prea mult din pagină.

Care este diferența dintre un slide-out, un popup și un overlay?

Un slide-out glisează din lateral, un popup apare în centru, iar un overlay acoperă întregul ecran. Slide-out-urile sunt de obicei mai puțin intruzive, dar fiecare opțiune vă poate ajuta să creșteți implicarea – alegeți doar ce se potrivește cel mai bine stilului site-ului dvs..

Care sunt unele dintre cele mai bune alternative la formularele popup?

Puteți folosi formulare inline, bare plutitoare sau formulare de tip slide-out pentru o experiență de utilizare mai fluidă și mai puțin perturbatoare.

Resurse bonus pentru utilizarea formularelor WordPress

Sperăm că acest articol v-a ajutat să învățați cum să adăugați un formular de contact de tip slide-out în WordPress.

De asemenea, este posibil să doriți să consultați câteva dintre celelalte ghiduri ale noastre despre formularele WordPress:

• Cum să afișezi un formular de contact plutitor în WordPress
• Cum să adăugați un popup cu formular de contact în WordPress
• Cele mai bune practici pentru designul paginii formularului de contact (cu exemple)
• Cum să folosești formularul de contact pentru a-ți crește lista de email în WordPress
• Cum să blocați spam-ul formularelor de contact în WordPress

Dacă ți-a plăcut acest articol, te rugăm să te abonezi la canalul nostru de YouTube pentru tutoriale video WordPress. Ne poți găsi, de asemenea, pe Twitter și Facebook.