Cum să adăugați un pop-up la site-urile WordPress în mod liber și rapid

Când vizitați un site web, ați văzut vreodată o imagine sau un mesaj afișat brusc pe ecran? Aceasta este fereastra pop-up sau de notificare a site-ului.

Popup este o strategie de marketing populară și eficientă, folosită de mulți oameni de afaceri și proprietari de site-uri web. Pentru a adăuga o fereastră de tip pop-up la WordPress, puteți utiliza un plugin gratuit pentru a face acest lucru rapid și simplu. Chiar dacă nu ești un expert, durează doar 10 minute pentru a urma instrucțiunile noastre.

De ce ar trebui să utilizați un pop-up pe un site web de afaceri?

Imaginea de mai jos este un exemplu pentru pop-up-ul unui site web de afaceri. Arată grozav, nu-i așa?

Popup-ul nu este doar uimitor (dacă reușiți să proiectați unul bine potrivit și atractiv), dar are și multe alte beneficii, cum ar fi:

• Promovați informații importante, campanii de vânzare și marketing,...
• Îndemn, crește rata de conversie
• Generați lead

Adăugați un popup la WordPress cu pluginul Popup Builder

Pentru a adăuga un pop-up pe site-ul dvs. WordPress, puteți angaja o companie credibilă de design web sau un programator. Cu toate acestea, pentru a economisi timp și bani, pluginul este cea mai bună opțiune. Printre numeroasele pluginuri pop-up disponibile, Popup Builder poate fi cel mai ușor de utilizat și mai eficient.

Este un plugin gratuit și disponibil pe wordpress.org, așa că trebuie doar să instalați și să activați pluginul chiar în tabloul de bord.

După ce ați terminat, urmați acești pași de mai jos.

Pasul 1: Alegeți tipul pop-up-ului

Acum, submeniul Popup Builder va apărea pe tabloul de bord. Mergeți acolo, faceți clic pe Adăugați știri și alegeți unul dintre cele 4 tipuri de pop-up furnizate.

Pentru o ilustrare mai bună, imaginea de mai jos arată cum se afișează cele 4 tipuri de pop-up furnizate de acest plugin pe partea frontală.

După ce ați ales tipul dorit, treceți la pasul următor.

Pasul 2: Adăugați conținut în fereastra pop-up

Mai întâi, dați un nume ferestrei pop-up pentru a o gestiona mai ușor.

Diferite tipuri de pop-up au nevoie de conținut diferit. Să săpăm în fiecare tip.

Adăugați conținut în ferestrele pop-up Facebook

Pe interfața pentru a crea ferestre pop-up Facebook, trebuie să completați aceste informații:

1. Mesajul care apare în fereastra pop-up. Ar trebui să utilizați o propoziție de îndemn pentru a încuraja cititorii să interacționeze. De asemenea, ar trebui să adăugați imagini, bannere, astfel încât să fie mai uluitor.
2. Introduceți URL-ul Facebook.
3. Alegeți un aspect pentru fereastra pop-up dintr-un capriciu. Practic, aceste aspecte nu sunt atât de diferite. Astfel, poți să le încerci și să-l alegi pe cel preferat.
4. Faceți clic aici pentru a ascunde butonul de distribuire dacă doriți.

Și asta am:

Adăugați conținut în ferestrele pop-up imagine

Aici trebuie doar să încărcați imaginea sau să introduceți linkul imaginii. Acest plugin acceptă JPG, PNG și GIF.

Acesta este un banner frumos pe care l-am făcut singur pentru campania de Vinerea Neagră a site-ului meu:

Adăugați conținut în ferestrele pop-up HTML

Adăugarea de conținut la pop-up HTML este la fel ca și cum scrieți o postare în editorul WordPress Gutenberg. Puteți insera imagini, videoclipuri, tabele, butoane, citate etc. sau orice alt conținut pe care editorul WordPress îl acceptă. Interfața este oarecum similară cu editorul Gutenberg, deci este destul de prietenoasă și nativă.

Și acesta este popup-ul meu HTML pe front-end:

Adăugați conținut în ferestrele pop-up pentru abonament

Aici avem destul de mult conținut de completat și personalizat pentru formularul de abonare. Cu toate acestea, ceea ce trebuie să observați cel mai mult sunt câmpurile din formular, cum ar fi Prenume , Nume , E-mail și personalizați substituentul și câmpul obligatoriu .

După aceea, derulați în jos și personalizați afișarea formularului în ceea ce privește opțiunile de fundal al formularului, stilul intrărilor, stilurile butoanelor de trimitere pentru a-l face mai uimitor și mai potrivit cu site-ul web.

În special, în secțiunea După abonament de succes , alegeți cu tact un mesaj potrivit sau informațiile pe care doriți să le afișați utilizatorilor după ce se abonează. De exemplu, puteți afișa note de mulțumire, cupoane, cadouri, carduri cadou, ... pentru acești abonați. Procedând astfel, puteți trage impresiile utilizatorilor și puteți îmbunătăți experiența acestora.

De exemplu, acesta este e-mailul pop-up pentru abonamentul meu. Odată ce s-au trimis, voi afișa o notificare despre campania de reduceri de Vinerea Neagră, îndemnând clienții să meargă la cumpărături.

Accesați Popup Builder > Toți abonații pentru a gestiona abonații.

Puteți chiar să trimiteți e-mailuri abonaților în fila Newsletter .

După ce ați adăugat conținut, derulați în jos. Veți vedea multe alte opțiuni de setare. Să săpăm în fiecare opțiune în pașii 4,5,6.

Pasul 3: Configurați locația de afișare și starea ferestrei pop-up

Configurați locația de afișare

În secțiunea Reguli de afișare popup , trebuie să ajustăm unde va/nu va apărea popup-ul.

Puteți alege Everywhere pentru a-l afișa pe fiecare pagină, postare, etichetare sau personaliza, sau să îl afișați într-un anumit loc dorit. De asemenea, puteți da clic pe indicatorul (?) pentru a obține mai multe detalii.

De exemplu, aleg locația ca o anumită pagină, aleg „este” pentru a o afișa și aleg pagina de afișare ca „Acasă” . În plus, puteți adăuga și alte locații alegând Adăugați .

Configurați condiția de afișare

În secțiunea Evenimente pop - up , alegeți ora la care apare pop-up-ul (când site-ul web s-a încărcat pentru câteva secunde, când utilizatorii dau clic pe undeva etc). Acest plugin acceptă următoarele condiții de afișare:

• La încărcare : pop-up-ul va apărea automat după câteva secunde (puteți adăuga numărul de secunde în fila Întârziere ) de la momentul în care site-ul a terminat de încărcat.

• Setat de clasa CC : permite utilizatorilor să facă clic pe o componentă pentru a activa fereastra pop-up. Această componentă se va baza pe ID-ul acesteia. Această parte este destul de complicată, așa că ar fi bine să citiți cu atenție documentația.

• La clic : similar cu secțiunea Set by CSS class, dar nu trebuie să utilizați ID-ul ferestrei pop-up pentru a instala „butonul” pentru a-l activa.

În schimb, dacă alegeți Implicit în secțiunea Opțiuni , pluginul va crea o clasă implicită pentru fereastra pop-up din secțiunea Clasă implicită, ca mai jos.

Dacă alegeți CSS personalizat , completați clasa pe care ați creat-o singur în secțiunea Clasă personalizată .

După aceea, adăugați clasa pop-up-ului în CSS-ul componentei pe care o doriți.

De exemplu, în această postare, am adăugat un buton și clasa pe care o vreau în secțiunea Clase CSS suplimentare .

Acesta este rezultatul pe front-end:

• Hover Click : când treceți cu mouse-ul pe o componentă, va apărea fereastra pop-up. Puteți face același lucru ca în secțiunea On Click .

Pasul 4: Personalizați afișajul popup-ului

După pasul 3, ați avut o fereastră pop-up de bază. Dar dacă doriți să fie mai uimitor, derulați în jos la secțiunea Design . Aici puteți personaliza unele componente, cum ar fi interfața, suprapunerea, fundalul pentru a-l face perfect ca preferat.

Mai mult decât atât, în secțiunea Dimensiuni , ajustați lățimea și lungimea alegând modul personalizat sau alegând modul receptiv pentru ca dimensiunea să se potrivească automat cu conținutul.

Pasul 5: Personalizați alte setări avansate

Aceste setări avansate vă permit să configurați afișarea și interacțiunea cu pop-up, … într-un mod mai detaliat.

De exemplu, puteți alege cum să închideți fereastra pop-up în secțiunea Închidere setări . Există multe moduri de a-l închide, cum ar fi apăsarea Esc sau adăugarea unui buton de închidere,... Alegeți unul sau mai multe, depinde de dvs.

Dacă doriți să adăugați efecte de închidere și deschidere a ferestrei pop-up sau să ajustați orele în care este afișat pentru un utilizator, derulați în jos la secțiunea Opțiuni pop - up . Trebuie doar să faceți clic pe opțiunea dorită și ați terminat.

Rețineți că atunci când utilizați pluginul gratuit Popup Builder, secțiunile denumite Opțiune de deblocare colorate în galben, ca în imaginea de mai jos, sunt caracteristici ale versiunii pro. Trebuie să cumpărați mai multe extensii ale acestui plugin pentru a le folosi.

În cele din urmă, pe bara laterală, există o opțiune foarte interesantă: adăugarea unui buton fix pe site pentru a afișa pop-up-ul când faceți clic pe. Acest buton plutitor este foarte convenabil, permițând oamenilor să-l vadă oricând și oriunde. Designul său este, de asemenea, plăcut și deloc enervant.

Acesta este butonul plutitor de pe site:

Sau îl puteți dezactiva făcând clic pe Dezactivare .

În cele din urmă, faceți clic pe Publicare pentru a finaliza.

Așadar, ați completat pop-up-ul după 6 pași de la setările de bază la cele avansate. Ai făcut o treabă bună!

Ultimele Cuvinte

După cum puteți vedea, adăugarea unui pop-up la WordPress nu este cu adevărat complicată. Trebuie doar să aveți puțină răbdare când îi personalizați afișajul, asta este toată munca grea!

În plus, există multe lucruri pentru a crește rata de conversie a site-ului web. Dacă doriți să construiți o pagină de destinație eficientă, ar fi bine să citiți mai multe articole despre cum să creați o pagină de destinație cu conversii mari sau despre cum să creați o pagină de produs.

Noroc!