Cum se deschide o fereastră pop-up la clic pe buton folosind Elementor? [2022]

Publicat: 2022-05-13

Te întrebi cât de captivant va apărea site-ul tău pentru vizitatori dacă se deschide o fereastră pop-up la clic pe buton ? Dacă doriți un astfel de buton interactiv care deschide o fereastră pop-up, atunci există numeroase moduri în cel mai popular constructor de site-uri web, Elementor . Astăzi vă vom arăta cum puteți crea cu ușurință o fereastră pop-up uimitoare cu clic pe buton fără codare.

popup open on button click

5 cele mai bune cazuri de utilizare a butonului cu element pop-up Modal

Să aruncăm o privire la ce beneficii te vei bucura făcând un pop-up modal Elementor deschis la clic pe buton înainte de a începe cu tutorialul. Practic, acest tip de pop-up modal interactiv este folosit pentru campaniile de marketing pe site-uri web . În afară de acestea, există și atât de multe cazuri de utilizare versatile pentru deschiderea unei ferestre pop-up la clic pe buton. Iată primele 5 cazuri de utilizare ale pop-upului modal.

1. Pentru captarea clienților potențiali pentru afaceri

Pentru a vă desfășura afacerea fără probleme și a crește creșterea companiei, aveți nevoie de clienți potențiali. Hrănind clienții potențiali, îi puteți transforma în clienți obișnuiți. Și un site web este cel mai bun mediu pentru a capta clienți potențiali. Dacă deschideți o fereastră pop-up la un clic pe buton, atunci puteți colecta cu ușurință numele clienților potențiali , numerele de telefon, e-mailurile și alte detalii.

2. Colectarea abonamentului prin e-mail

De obicei, dacă adăugați un buton de bază pentru a colecta abonamente prin e-mail, utilizatorii dvs. vor ajunge la o nouă pagină web. În loc să faceți acest lucru, puteți deschide o fereastră pop-up la un clic pe buton, apoi utilizatorii dvs. nu vor fi nevoiți să părăsească pagina web curentă. Această practică vă crește în mod surprinzător abonamentul prin e-mail numără lin.

Popup Opens on a Button Click

3. Promoții de marketing și vânzări

Când desfășurați promoții de marketing prin site-ul dvs., se deschide o fereastră pop-up la un clic pe buton poate oferi site-ului dvs. un aspect interactiv și crește vânzările . Puteți adăuga imagini, formulare, cupoane speciale de reducere etc. într-un singur pop-up al Elementor. Fără a vă face site-ul nedorit împreună cu secțiunile de promovare, puteți înlocui acest lucru cu o fereastră pop-up care se deschide la un clic pe buton.

4. Distribuirea de anunțuri interesante

Dacă intenționați să anunțați o lansare extraordinară sau alte anunțuri și promoții interesante, pop-up-ul se deschide la un clic pe buton poate fi cea mai bună modalitate. Acesta va oferi site-ului dvs. un aspect uimitor și îl puteți decora cu confetti virtuale și alte decorațiuni festive. În plus, dacă intenționați să anunțați vreo știre mare „în curând”, atunci fereastra pop-up se deschide la un clic pe buton vă poate ajuta să creați noutăți .

5. Utilizați ca blocare de conținut

Când aveți un site web multifuncțional, poate fi necesar să oferiți restricții asupra conținutului în funcție de vârstă, calitate de membru, abonament și multe altele. Dacă furnizați direct conținut restricționat direct pe o secțiune a site-ului web, atunci cu siguranță vă va reduce numărul de clicuri pe acțiune. În loc de aceasta, puteți crea o fereastră pop-up atractivă care se deschide instantaneu prin clic pe buton.

Popup Opens on a Button Click

De ce este Elementor cea mai bună platformă pentru a crea pop-up pe un buton?

În site-uri web, există mai multe moduri de a crea o fereastră pop-up care se deschide la un clic pe buton în WordPress. O modalitate de a face acest lucru este prin codificare personalizată sau angajarea experților. Dacă nu sunteți priceput la tehnologie, atunci efectuarea codurilor sau angajarea experților vă poate costa o avere. Dar când utilizați Elementor – cel mai popular constructor de site-uri WordPress, atunci o puteți face fără codare .

Pentru a crea o fereastră pop-up care se deschide la un clic pe buton, o puteți face pur și simplu prin glisare și plasare , fără a fi nevoie de codare. Mai mult decât atât, cu ajutorul Elementor Popup builder, crearea unui pop-up care se deschide la un clic pe buton este atât de simplă încât le puteți crea pe toate singur. Elementor oferă opțiuni nelimitate de personalizare și personalizare. Deci, aliniind aceasta cu valoarea mărcii site-ului dvs., puteți crea orice tip de pop-up care se deschide la un clic pe buton instantaneu.

Popup Opens on a Button Click

Tutorial fără cod: Cum să faci un pop-up Elementor Modal să se deschidă la clic pe buton?

Acum să intrăm în tutorial și să începem să deschidem o fereastră pop-up la clic pe buton. Înainte de a începe să creați un pop-up Elementor, tot ce aveți nevoie este concentrare de 5 minute și urmați acest tutorial ușor pas cu pas.

Pasul 1: Începeți cu Elementor PRO

Dacă intenționați să creați o fereastră pop-up modală care se deschide la un clic folosind Elementor, atunci trebuie să obțineți Elementor PRO . Cu caracteristica exclusivă a Elementor PRO, Elementor Popup Builder , puteți crea instantaneu ferestre pop-up care se deschid la un clic pe buton. Elementor vine cu planuri de preț versatile, începând de la 49 USD . După ce obțineți pluginul Elementor PRO, instalați-l și activați-l pe site-ul dvs. WordPress.

Popup Opens on a Button Click

Pasul 2: Creați un șablon utilizând Elementor Popup Builder

Acum, timpul pentru a crea un șablon pentru pop-up se deschide la un clic pe buton. Pentru a face acest lucru, accesați tabloul de bord WordPress, accesați Șabloane → Popup . Făcând clic pe filă, vă va duce instantaneu la generatorul pop-up Elementor. Apoi faceți clic pe butonul „Adăugați pop-up nou” . Va apărea o fereastră pop-up. Tipul șablonului este selectat automat ca pop-up. Puteți da un nume de șablon dacă doriți și apoi faceți clic pe butonul „Creați șablon” .

Popup Opens on a Button Click

Apoi veți fi redirecționat către Biblioteca de șabloane Elementor . Există peste 100 de colecții pop-up disponibile în categorii versatile. Pe baza cerințelor site-ului dvs. WordPress, selectați un șablon pop-up Elementor potrivit. Faceți clic pe șablon pentru a obține o scurtă previzualizare. Apoi faceți clic pe butonul „Inserare” pentru a deschide fereastra pop-up modală la un clic pe buton.

Popup Opens on a Button Click

Pasul 3: Configurați și personalizați șablonul pop-up

După aceea, panoul editor Elementor se va deschide cu toate opțiunile de configurare în partea stângă. De acolo puteți personaliza cu ușurință fereastra pop-up care se deschide la un clic pe buton. Puteți păstra pop-up-ul modal cu Boxed sau Full Width . În mod similar, puteți configura înălțimea pop-upului modal, decalajul coloanei, poziția coloanei, alinierea verticală, depășirea, etichetele HTML și multe altele. Diferite tipuri de lățime oferă diferite tipuri de configurație.

Popup Opens on a Button Click

Pentru a personaliza conținutul pop-upului modal, pur și simplu faceți clic pe text, imagine sau butoane. Instantaneu, panoul de editare va fi deschis în stânga. Puteți schimba cu ușurință conținutul pop-up, familia de fonturi etc. Adăugați, de asemenea, mai multe secțiuni de ieșire a e-mailului, înălțimea, lățimea, culoarea, textul și multe altele butoane. Există o opțiune disponibilă pentru a seta acțiuni după trimitere, a gestiona trimiterile, a adăuga conținut personalizat de e-mail, e-mail al destinatarului, ID-ul e-mailului expeditorului, etc. După ce ați făcut toate modificările, faceți clic pe butonul „Publicare” .

Popup Opens on a Button Click

Pasul 4: Configurați condițiile și declanșatoarele

Puteți profita de deschiderea pop-up-ului printr-un clic pe buton pentru întregul site web WordPress sau pagini selective. Puteți include sau exclude pop-up Elementor și din paginile selectate. Toate aceste configurații sunt disponibile în fila „Condiție” .

Din fila „Declanșatoare” , trebuie să setați când doriți ca fereastra pop-up să se deschidă la un clic pe buton. Deoarece dorim să previzualizam fereastra pop-up folosind clic pe butonul, comutați pentru a activa „On Click” . Din „Reguli avansate” puteți configura condiții cum ar fi cui să afișați pop-up-ul, să afișați la sosirea formularului și multe altele. Apoi faceți clic pe butonul „Salvare și închidere” . Acesta este cât de ușor puteți crea un șablon pop-up Elementor. Apoi reveniți la tabloul de bord WordPress.

Popup Opens on a Button Click

Pasul 4: Adăugați un buton Elementor acolo unde aveți nevoie

Acum, deschideți o pagină în care doriți să setați o fereastră pop-up care se deschide la un clic pe buton. Dacă doriți să creați o pagină nouă, atunci accesați Pagini → Adăugați nou . pentru acest tutorial, vom conecta popup-ul modal cu butonul Elementor. Trageți și plasați butonul Elementor de pe pagina dvs.

Popup Opens on a Button Click

Personalizați aspectul butonului, textul etc. pentru a ajusta culoarea mărcii site-ului dvs. web. Următorul pas este să legați butonul cu modulul pop-up. Pentru a face acest lucru, faceți clic pe „Tipul dinamic” din câmpul „Link” , alegeți Popup din Acțiuni . Apoi, faceți clic pe pictograma „Setări” de lângă pop-up și selectați șablonul pop-up creat anterior. Asta e!

Popup Opens on a Button Click

O privire finală a pop-upului se deschide la clic pe butonul Elementor

Acesta este cât de ușor puteți crea un pop-up care se deschide la un clic pe buton. După ce faceți alte personalizări, publicați pagina. Acum la previzualizare pentru a vedea cum se deschide o fereastră pop-up la un clic pe buton.

Popup Opens on a Button Click

Dacă doriți să utilizați același buton pentru pagini diferite, atunci Copiați și lipiți butonul într-o pagină web nouă. De asemenea, puteți copia codul scurt pentru șablonul pop-up Elementor și îl puteți utiliza oriunde doriți să adăugați un pop-up care se deschide la un clic pe buton.

Bonus pentru suplimente esențiale pentru utilizatorii Elementor

Essential Addons pentru Elementor este cea mai puternică bibliotecă Elementor, cu peste 1 milion de utilizatori activi și peste 85 de widget-uri unice. Și widgetul său Creative Button vine cu un design mai versatil și o utilizare multifuncțională pentru clienții săi. Dacă utilizați widget-ul butonului Essential Addons, atunci, în mod similar cu butonul Elementor, puteți face cu ușurință deschiderea unei ferestre pop-up la un clic pe buton.

Popup Opens on a Button Click

Elementor a facilitat dezvoltarea site-ului web. Așa cum fereastra pop-up se deschide la un clic pe buton, puteți crea funcționalități mai uimitoare și versatile pentru site-ul dvs. WordPress. Iată sfârșitul acestui tutorial. Dacă ați găsit acest tutorial util, atunci nu uitați să-l împărtășiți altora.

Spuneți-ne cum creați o fereastră pop-up care se deschide la un clic folosind Elementor în comunitatea noastră Facebook . De asemenea, abonați-vă la blogul nostru pentru a rămâne la curent cu aceste tipuri de tutoriale, sfaturi și trucuri.