Cum se Creează o Fereastră Popup pentru Formularul de Autentificare

Fereastră Popup pentru Formularul de Autentificare

Creați o fereastră popup pentru formularul de autentificare cu un slider în fundal. În acest articol veți învăța cum se creează o Fereastră Pop-up pentru Formularul de Autentificare, ca să:

1. Faceți clic pe un buton pentru a deschide o fereastră de tip Autentificare
2. Utilizați diapozitive ca fundal pentru pop-up
3. Redirecționați utilizatorul către tabloul de bord atunci când închideți fereastra pop-up

Proiectați Popup-ul și Conținutul Acestuia

1. Accesați Șabloane > Ferestre Pop-up > Adăugați nou și dați un nume noii ferestre pop-up. (O metodă alternativă este să apăsați CMD+E sau CTRL+E pentru a deschide Finder, căutați Popup, alegeți Add New Popup și dați-i un nume.)
2. Alegeți un șablon pop-up pre-proiectat sau închideți suprapunerea Bibliotecă și proiectați-vă pop-up-ul de la zero. Pentru acest exemplu, s-a folosit un Pop-up gata proiectat din Biblioteca Șablon.

Popup > fila Aspect

1. Lățimea personalizată: setată la 300 px
2. Înălțime: selectați Personalizat
3. Înălțime personalizată: setată la 600 px
4. Suprapunere: setați la Ascundere

Popup > Fila Avansat

Preveniți închiderea prin suprapunere: setați la Da

Conţinut

Sectiunea 1:

Fila Aspect

1. Înălțime minimă: setată la 600 px
2. Acum adăugați un Widget de Titlu și de Autentificare la secțiune. Ajustați conținutul titlului și stilul după cum este necesar.
3. În Widget-ul de Conectare > Conținut > Opțiuni Suplimentare > Redirecționare după conectare: Setați la Activat și introduceți adresa URL a paginii pentru a redirecționa utilizatorul către:

Fila Aspect

Înălțime minimă: setată la 600 px

Widget Slide-uri > fila Aspect

1. Înălțime: setată la 600 px
2. Imagini > Pentru fiecare imagine a diapozitivului, repetați următoarele patru modificări de opțiune:
3. Imagine: alegeți o imagine
4. Dimensiune: Alegeți Copertă
5. Efectul Ken Burns: Setați la Da
6. Direcție de mărire: Setați la In

Acum să așezăm cele două secțiuni una peste alta.

1. Secțiunea 2 > Margini > Top: -600 px (negativ 600)
2. Secțiunea 1 > Z-Index: 1

Publicați Popup-ul

Faceți clic pe butonul Publicați. Nu există condiții, declanșatoare sau reguli avansate pentru acest pop-up, așa că faceți clic pe butonul Salvare și închidere.

Controlați Popup-ul

Editați pagina care conține butonul Autentificare.

Editați butonul Autentificare. Dacă nu ați creat deja un Buton, puteți face acest lucru acum. Editați-i textul și tipografia după cum este necesar.

Buton Widget > Conținut

1. Buton > Link: Faceți clic pe pictograma Dynamic și sub Acțiuni, alegeți Popup
2. Faceți clic din nou pe Popup și selectați Comutați popup.
3. Acum, în câmpul Popup, începeți să tastați pentru a căuta widgetul de autentificare pe care tocmai l-ați creat.
4. Faceți clic pe butonul Actualizare.

Popup > Fila Avansat

Preveniți închiderea prin suprapunere: setați la Da

Totul este gata. Vizitați pagina cu butonul Autentificare pe ea ca vizitator normal (nu autentificat). Faceți clic pe butonul Conectare. Dacă completați formularul și vă conectați cu succes, veți fi redirecționat către pagina pe care ați desemnat-o ca tablou de bord. Dacă alegeți să închideți fereastra pop-up în loc să vă conectați, faceți clic din nou pe butonul Conectare pentru a comuta/închide fereastra pop-up.

Pentru confortul dvs. urmăriți acest tutorial și în format Video. Video creat de echipa de asistență Elementor.

Documentație adițională

• Ferestre Popup Slide In
• Ferestre Popup Bara de jos
• Cum se Creează un Meniu Popup Receptiv
• Ferestre Popup în Elementor