Felugró űrlapok létrehozása és megjelenítése

Published: 2026. július 16. · Last updated: 2026. július 21. · By Marcus Biel

A felugró ablak a webhely tartalma fölött jelenik meg. A feliratkozási ajánlatot közvetlenül a látogató látóterébe helyezi, miközben az alatta lévő oldal változatlanul a helyén marad.

A felugró ablakok hasznosak hírlevélajánlatokhoz, kedvezményekhez, eseményregisztrációkhoz, lead magnetekhez és más célzott cselekvésre ösztönző üzenetekhez. Mivel megszakítják az oldal szokásos használatát, az időzítés és a gyakoriság ugyanolyan fontos, mint a dizájn.

Ez az útmutató a felugró ablakokra vonatkozó beállításokat ismerteti. Az elrendezéseket, tartalmi blokkokat, feliratkozói mezőket, címkéket, tipográfiát, rétegeket és feliratkozási folyamatokat a fő Feliratkozási űrlapépítő útmutató ismerteti.

Felugró ablak létrehozása

Nyissa meg a „Signup Forms” menüpontot, kattintson a „Create Form” lehetőségre, majd válassza a „Popup” opciót. Adjon meg egy egyértelmű belső nevet, és lépjen tovább az építőfelületre.

Meglévő felugró ablakot is szerkeszthet, ha a nevére kattint a Signup Forms Overview oldalon.

Olyan nevet használjon, amely leírja az ajánlatot vagy az elhelyezést, például „Homepage Discount Popup”, „Webinar Registration Popup” vagy „Guide Download Popup”. A belső név automatikusan nem jelenik meg a látogatók számára.

Felugróablak-sablon kiválasztása

A felugró ablakokhoz üres űrlap, standard űrlap és négy megtervezett sablon áll rendelkezésre:

• Clean discount
• Warm guide
• Dark webinar
• Soft community

Olyan sablont válasszon, amelynek mérete és tartalmi szerkezete illeszkedik az ajánlathoz. A szövegek, mezők, színek, képek, térközök és az elrendezés később mind módosíthatók.

A felugró ablak megtervezése

A vizuális építővel rendezheti el a felugró ablak elemeit. A feliratkozási űrlapot szövegekkel, képekkel, videókkal, listákkal, gombokkal, közösségi linkekkel, feliratkozószámlálóval, térközökkel és elválasztókkal kombinálhatja.

A fő üzenet legyen elég rövid ahhoz, hogy azonnal érthető legyen. Egy egyértelmű címsor, egy rövid magyarázat és egy konkrét küldés gomb általában hatékonyabb, mint több, egymással versengő üzenet.

Jelölje ki a feliratkozási űrlap blokkot a mezők, a kötelező adatok, a rejtett címkék, a folyamatjelző, a feliratkozószámláló, a beviteli mezők és a küldés gomb beállításához. Az általános felugróablak-háttér és a megjelenés alapértelmezéseinek módosításához nyissa meg a „Page settings” menüpontot.

A felugró ablak a webhely fölött jelenik meg, bezárási lehetőséggel. Hagyjon elegendő vizuális teret a fontos szövegek és mezők körül, hogy az űrlap kis képernyőn is könnyen használható maradjon.

A felugró ablak viselkedésének beállítása

Jelölje ki a feliratkozási űrlap blokkot, majd nyissa meg a „Widget Settings” menüpontot. Ez a rész szabályozza, hogy mikor jelenjen meg a felugró ablak, és milyen gyakran láthatja ugyanaz a látogató.

Megjelenítési késleltetés

A „Display Delay” azt határozza meg, hogy a Maildroppa hány másodpercet várjon, mielőtt megjeleníti a felugró ablakot egy beágyazott webhelyoldalon.

Adjon meg 0 értéket, ha további késleltetés nélkül szeretné megjeleníteni. Nagyobb értéket akkor használjon, ha a látogatóknak időt szeretne hagyni az oldal elolvasására, mielőtt az ajánlat megjelenik. Az építő legfeljebb 86 400 másodperces késleltetést fogad el.

A késleltetést az oldal alapján válassza ki. Egy rövid késleltetés megfelelő lehet egy célzott kampányoldalon, míg egy cikkben a hosszabb késleltetés kevésbé zavaró lehet.

Megjelenítési gyakoriság

A „Display Frequency” azt az időszakot szabályozza, amelynek elteltével a felugró ablak ugyanannak a látogatónak ismét megjelenhet. Az elérhető lehetőségek:

• Always
• Once per hour
• Once per day
• Once per week
• Once per month

Az „Always” lehetőséget körültekintően használja. A felugró ablak, amely ugyanazt a látogatót ismételten megszakítja, frusztrálóvá válhat. Egy általános webhelyajánlat esetén gyakran jobb kiindulópont a napi vagy heti gyakoriság.

A gyakoriságot a látogató böngészője tárolja. Ezért egy másik böngészőben, privát böngészési ablakban vagy törölt böngészőtárhellyel végzett teszt eltérő eredményt adhat.

Kilépési szándék használata

Engedélyezze az „Exit Intent Popup” lehetőséget, ha azt szeretné, hogy a felugró ablak akkor nyíljon meg, amikor a látogató a mutatót az oldal területén kívülre mozgatja, jelezve, hogy talán távozni készül.

Ha a kilépési szándék engedélyezve van, a felugró ablak a szokásos késleltetett megjelenítés helyett erre a viselkedésre vár. A kiválasztott megjelenítési gyakoriság továbbra is megakadályozza, hogy túl hamar újra megjelenjen.

A kilépési szándék a mutató mozgásán alapul, ezért elsősorban asztali számítógépes és laptopos böngészőkben releváns. Az érintőképernyős eszközök nem biztosítják ugyanezt a kilépési jelzést. Mindig gondoskodjon arról, hogy a mobilos látogatók magán az oldalon vagy egy másik megfelelő űrlapon keresztül is felfedezhessék a feliratkozási ajánlatot.

Felugró ablak manuális megnyitása egy oldalelemről

A felugró ablak akkor is megnyílhat, amikor a látogató a webhelyen egy adott gombra, képre vagy linkre kattint. Ez a manuális kattintási aktiváló. Ez eltér az „Exit Intent Popup” működésétől, amely akkor reagál, amikor a látogató a mutatót az oldal területén kívülre mozgatja.

A manuális kattintási aktiválót az alábbiak szerint állíthatja be és telepítheti:

1. Nyissa meg a felugró ablakot a Signup Form Builderben.
2. Kattintson a vásznon a feliratkozási űrlap blokkjára, majd jobb oldalon nyissa meg a „Settings” menüpontot.
3. Nyissa le a „Widget Settings” részt, és engedélyezze az „Open popup when a customer clicks a page element” lehetőséget.
4. Kattintson a „Save changes” gombra.
5. Térjen vissza a Signup Forms Overview oldalra, és aktiválja a felugró ablakot, ha inaktív.
6. Kattintson az adott felugró ablak sorában a „Show Code Snippet” lehetőségre.

A párbeszédablak a webhelyen szükséges két értéket tartalmazza:

1. Másolja ki a teljes kódot a „JavaScript” lapról, és adja hozzá ahhoz a webhelyoldalhoz, amelyen a felugró ablaknak elérhetőnek kell lennie.
2. A kód alatt másolja ki az „Add this ID to element from which you want to manually trigger Popup” felirat alatt látható azonosítót.
3. Adja hozzá ezt a pontos értéket annak a gombnak, képnek vagy linknek az id attribútumához, amelynek meg kell nyitnia a felugró ablakot.

Az azonosító formátuma:

maildroppa-popup-btn-[form-id]

Például:

<button id="maildroppa-popup-btn-[form-id]">Get the guide</button>

A JavaScript tölti be a felugró ablakot. Az azonosító kapcsolja össze a felugró ablakot a kiválasztott oldalelemmel. Mindkettőnek ugyanazon a közzétett oldalon kell jelen lennie. Amikor a látogató a pontos azonosítóval rendelkező elemre kattint, a Maildroppa szkriptje megnyitja a felugró ablakot.

Ha a webhely gombja már rendelkezik egy másik felugróablak-rendszerből származó azonosítóval, cserélje le a Maildroppa aktiválóazonosítójára, amikor azt szeretné, hogy a kattintást a Maildroppa kezelje. Ne helyezze a Maildroppa felugró ablakát a webhelyépítő által biztosított második felugró ablakba.

Minden HTML-azonosítót csak egyszer használjon egy oldalon. Ha több elemnek kell ugyanazt a felugró ablakot megnyitnia, kérje meg a webhely megvalósítását végző személyt, hogy az elemeket az azonosító megismétlése nélkül kapcsolja össze.

A feliratkozási folyamat összekapcsolása

Tekintse át az építő fejlécében hozzárendelt feliratkozási folyamatot. Ez szabályozza az azonnali küldés utáni választ, a Double Opt-in e-mailt és a megerősítés utáni eredményt.

Kiválaszthat egy meglévő folyamatot, szerkesztheti azt, vagy külön folyamatot hozhat létre ehhez a felugró ablakhoz. Külön folyamat akkor hasznos, ha az ajánlathoz saját megerősítő üzenet vagy lead magnet kézbesítése szükséges.

Előnézet és mentés

Kattintson a „Preview” gombra a felugró ablak dizájnjának és viselkedésének ellenőrzéséhez, anélkül hogy módosítaná a webhelyen használt verziót. Ellenőrizze az elrendezést, a bezárási lehetőséget, a mezők sorrendjét, az érvényesítéshez szükséges helyet és a küldés utáni választ.

Kattintson a „Save changes” gombra, amikor a felugró ablak elkészült. Ezután térjen vissza a Signup Forms Overview oldalra.

A felugró ablak aktiválása és automatikus beágyazása

Aktiválja a felugró ablakot a hárompontos műveleti menüből, ha még nem aktív. Ezután kattintson a „Show Code Snippet” lehetőségre, és másolja ki a teljes kódot a „JavaScript” lapról.

Adja hozzá a szkriptet minden olyan webhelyoldalhoz, amelyen a felugró ablaknak elérhetőnek kell lennie. A kód tartalmazza a felugró ablak egyedi űrlapazonosítóját, és betölti az aktuális mentett konfigurációt.

A „HTML” lap biztosítja az egyedi megvalósításokhoz generált jelölőkódot. Ha ezt használja, gondosan tesztelje az összes viselkedést és beküldési lépést, mert a webhely kódja és stílusai hatással lehetnek az eredményre.

Ez a rész arra az esetre vonatkozik, amikor a felugró ablaknak automatikusan, a megjelenítési késleltetés vagy a kilépési szándék alapján kell megnyílnia. Ha egy gomb, kép vagy link kattintására szeretné megnyitni a felugró ablakot, kövesse a

című részt.

Az általános beágyazási útmutatóért tekintse meg a Beágyazott űrlap létrehozása és beágyazása című részt.

A felugró ablak tesztelése a webhelyen

A kód hozzáadása után tesztelje a felugró ablakot a tényleges webhelyoldalon:

1. Ellenőrizze a beállított késleltetést.
2. Tesztelje a bezárási gombot és az űrlapon kívüli kattintást.
3. Ha engedélyezve van, mozgassa a mutatót az oldal területén kívülre a kilépési szándék teszteléséhez.
4. Ha engedélyezve van, kattintson a beállított oldalelemre a manuális aktiváló teszteléséhez.
5. Ellenőrizze az elrendezést keskeny képernyőn.
6. Küldje be az űrlapot, és hajtsa végre a Double Opt-in folyamatot.
7. Ellenőrizze a feliratkozót és a rejtett címkéket a Maildroppában.

A gyakorisági beállítás megakadályozhatja, hogy a felugró ablak ismételten megjelenjen a tesztek során. Ha tiszta tesztlátogatásra van szüksége, használjon privát böngészési ablakot, vagy törölje a megfelelő böngészőtárhelyet.

A felugró ablak frissítése vagy deaktiválása

A felugró ablak frissítéséhez nyissa meg a Maildroppában, szerkessze a dizájnt vagy a viselkedést, tekintse meg az előnézetét, majd kattintson a „Save changes” gombra. A JavaScript-kódrészlet továbbra is ugyanazt az űrlapazonosítót használja.

Az ideiglenes megjelenítés leállításához válassza a „Deactivate” lehetőséget a műveleti menüből. A deaktiválás megőrzi a felugró ablakot és korábbi jelentésadatait. Ha a továbbiakban nincs rájuk szükség, távolítsa el a szkriptet vagy az aktiváló elemet is a webhelyről.