Bannerek | Yaplet HU

Hogyan működnek a bannerek

A bannerek közvetlenül a weboldaladon jelennek meg, amikor a trigger feltételek teljesülnek. Zökkenőmentesen integrálódnak a weboldalad dizájnjával, és tartalmazhatnak szöveges tartalmat, stílusbeállításokat és interaktív elemeket, mint gombok vagy bezárás vezérlők.

Banner lista

A banner lista az összes banneredet vizuális kártyaként jeleníti meg rácsos elrendezésben. Minden kártya mutatja:

Egy élő szín előnézet csík, amely a banner tényleges színeit tükrözi
A banner nevét és a hozzárendelt widgetet
Egy Publikált/Vázlat jelvényt — kattints rá közvetlenül a listából a banner állapotának váltásához
Prioritás súlyozás és létrehozás dátuma
Gyors művelet gombok a szerkesztéshez, másoláshoz vagy törléshez

Banner létrehozása

Kattints az Új banner gombra a létrehozási ablak megnyitásához. Kezdheted a nulláról, vagy választhatsz előre elkészített sablont:

Üres banner

Kezdj egy üres bannerrel és konfigurálj mindent a semmiből.

Szerverhiba

Sárga beágyazott banner "Kapcsolatfelvétel" chat művelettel. Minden oldalmegtekintéskor aktiválódik.

Új funkció

Kék beágyazott banner "Tudj meg többet" URL művelettel. Munkamenetenként egyszer aktiválódik.

Különleges ajánlat

Zöld beágyazott banner "Ajánlat igénylése" URL művelettel. Munkamenetenként egyszer aktiválódik.

Fontos közlemény

Piros beágyazott banner bezárás gomb és művelet nélkül. Minden oldalmegtekintéskor aktiválódik.

Információs tipp

Indigó beágyazott banner "Mutasd meg" URL művelettel. Munkamenetenként egyszer aktiválódik.

A sablonok előre kitöltik mind a vizuális beállításokat, mind a trigger feltételeket, így azonnal használható bannert kapsz, amelyet tovább szabhatsz testre.

Banner szerkesztő

A banner szerkesztő kétpaneles elrendezést használ asztali gépen: bal oldalon a beállítások panel, jobb oldalon az élő előnézet. Mobilon az előnézet ragadós csíkként jelenik meg a tetején, alatta a teljes beállítási űrlappal.

A felső navigációs sáv mutatja a banner nevét, egy Éles/Vázlat állapot jelvényt, valamint a riportok és mentés gombokat.

A beállítások panel jól elkülönülő, ikonnal jelölt szekciókra van osztva — Trigger, Általános, Tartalom, Háttér, Elrendezés, Szegély és Művelet —, így minden mezőcsoport vizuálisan elválik és könnyebben átlátható.

Bannerek aktiválása

A Trigger szekció az első dolog, amit a szerkesztőben látsz. Ha nincsenek triggerek beállítva, egy figyelmeztető doboz jelenik meg, amely a beállításukra ösztönöz. Ha vannak triggerek, egy összefoglaló mutatja a számukat. Bármelyikre kattintva megnyílik a trigger konfigurációs ablak.

A triggerek konfigurálásáról részletes információkat a trigger dokumentációnkban találsz.

Trigger konfiguráció

Ismerkedj meg az összes elérhető trigger opcióval és azok konfigurálásával a bannereidhez.

Banner beállítások

Általános

Név

string required

Leíró cím a banneredhez, amelyet a vezérlőpulton használsz.

Widget

string required

Válaszd ki, melyik widgethez tartozik ez a banner. A widget határozza meg, melyik weboldalon jelenik meg a banner.

Publikált

boolean

Kapcsoló, hogy a banner aktív-e és megjeleníthető-e a látogatók számára.

Tartalom

string required

A banner fő szöveges tartalma, HTML formázást támogatva szövegszerkesztőn keresztül.

Háttér

A Háttér szekció egy Egyszínű / Színátmenet fülkapcsolóval kezdődik — ugyanaz a minta, amit a widget Indító gombnál is használunk. Válaszd ki a módot, és csak az adott módhoz tartozó mezők jelennek meg alatta.

Egyetlen háttérszín a bannerhez.

Szín

string

A banner háttérszíne.

:: :::

Több színből álló lineáris színátmenet. Minden szín egy stop, amelyek sorrendben, a megadott szög mentén keverednek össze.

1. szín … N. szín

string

2 és 5 közötti színstop. Új stopot a Szín hozzáadása gombbal adsz hozzá; a melletti × gombbal távolíthatsz el egy stopot (a 2 stopos minimum kötelező — ez alá nem mehetsz).

Szög

number

Elforgatási szög fokokban (0–360). Szerkesztheted a számbeviteli mezőben, húzhatod a csúszkát, vagy kattinthatsz a csúszka alatti 0° / 90° / 180° / 270° / 360° előre beállított jelzők egyikére.

Ha visszaváltasz Egyszínű módra, a színátmenet stopjai megmaradnak, így a színeid elvesztése nélkül válthatsz a két mód között. A szöveg színe automatikusan igazodik a színátmenet középső színéhez az optimális kontraszt érdekében.

Elrendezés

Stílus

select required

Válaszd ki a banner megjelenítési stílusát (lásd a Megjelenítési stílusok részt alább).

Szegély lekerekítés

number

Csak akkor jelenik meg, ha a Stílus értéke Lebegő kapszula — beállítja a lekerekített sarkokat (hagyd üresen az alapértelmezetthez).

Bezárás gomb megjelenítése

boolean

Engedélyezi, hogy a látogatók egy × gombbal a jobb felső sarokban bezárják a bannert.

Megjelenítési stílusok

A bannerek három különböző megjelenítési stílust kínálnak, mindegyik egyedi pozicionálással és viselkedéssel:

Teljes szélességű bannerek, amelyek a body tag tetejéhez kerülnek hozzáfűzésre. Lenyomják a nem rögzített elemeket és együtt görgetődnek az oldal tartalmával - görgetéskor eltűnnek, mint a normál oldalelemek.

Amikor aktív, a body tag megkapja a yaplet-b-shown CSS osztályt.

Teljes szélességű bannerek, amelyek a képernyő tetejéhez tapadnak görgetéskor is. Ez a stílus nem próbálja lenyomni az oldal tartalmát - a meglévő elemek tetején jelenik meg. Tökéletes rögzített navigációs sávokkal vagy fejlécekkel rendelkező oldalakhoz.

yaplet-b-shown és yaplet-b-fi CSS osztályokat ad a body-hoz. Szükség esetén a --yaplet-margin-top CSS változóval tolhatod le a rögzített fejléceket.

Középen elhelyezett, kapszula alakú bannerek, amelyek nem feszítik ki a teljes képernyőszélességet. A lebegő teljes szélességűhöz hasonlóan a tetejéhez tapadnak, de vizuálisan elkülönülnek és kissé eltávolodnak a képernyő szélétől.

yaplet-b-shown és yaplet-b-f CSS osztályokat ad a body-hoz. Szükség esetén a --yaplet-margin-top CSS változóval tolhatod le a rögzített fejléceket.

A bannerek automatikusan CSS osztályokat és CSS változókat adnak az oldaladhoz megjelenítéskor, lehetővé téve az elrendezés szükség szerinti módosítását. Használd ezeket a weboldalad elemeinek és a banner pozicionálás kölcsönhatásának testreszabásához.

Szegély

Szegély megjelenítése

boolean

Keretet rajzol a banner köré. A szélesség és szín mezők bekapcsolás után jelennek meg.

Szegély szélesség

number

Szegély vastagsága pixelben.

Szegély szín

string

A keret színe.

Művelet

Konfiguráld, mi történjen, amikor a látogatók interakcióba lépnek a bannereddel:

Nincs művelet

A banner csak információt jelenít meg, interaktív elemek nélkül.

Beszélgetés indítása

Chat beszélgetést nyit meg. Opcionálisan válassz egy specifikus munkafolyamatot a beszélgetés megkezdéséhez.

Kérdőív indítása

Kérdőívet indít a látogatói visszajelzés gyűjtéséhez.

Visszajelzési űrlap megjelenítése

Visszajelzési űrlapot jelenít meg a felhasználói bemenet gyűjtéséhez.

URL megnyitása

Külső weboldalra vagy oldalra irányítja a látogatókat.

Tudásbázis cikk megjelenítése

Tudásbázis cikket jelenít meg a widget tudásbázisából.

Hír cikk megjelenítése

Hír cikket mutat az outreach tartalmaidból.

Művelet testreszabás

Interaktív elemeket tartalmazó műveletekhez:

Művelet szöveg

string

A művelet gombon megjelenő szöveg.

Művelet szín

string

Egyéni szín a művelet gombhoz (hagyd üresen az alapértelmezett stílus használatához).

A művelet gombok öröklik a banner szövegszín logikáját - automatikusan megfelelő kontrasztszíneket használnak a háttérválasztásod alapján.

Előnézet és tesztelés

A szerkesztőben lévő élő előnézet pontosan megmutatja, hogyan fog kinézni a bannered a weboldaladon. Asztali gépen egy böngésző makettben jelenik meg a beállítások panel mellett. Módosíthatod az előnézet háttérszínét, hogy különböző oldal hátterekkel tesztelj, és biztosítsd a megfelelő kontrasztot.

Outreach kampányok tesztelése

Tudd meg, hogyan tesztelheted biztonságosan az outreach kampányaidat, mielőtt éles látogatóknak telepítenéd.

Mindig teszteld a bannereidet különböző eszközökön és képernyőméreteken, különösen lebegő stílusok vagy színátmenetek használatakor, hogy biztosítsd a helyes megjelenítést minden látogató számára.