MagyarmagyarLebegő sáv
Lebegő sáv (Floating Bar) létrehozása sablonból, a tartalom, a stílus és a haladó beállítások.
A lebegő sávok az oldal tetején vagy alján megjelenő szalagok. Promóciókra, bejelentésekre és felhívásokra használd őket: felhívják a látogatók figyelmét, és interakcióra ösztönzik őket anélkül, hogy megzavarnák a böngészést.
A lebegő sáv sablon, nem widget vagy egyéb elem. A WordPress admin felületéről hozod létre, nem a szerkesztő elemei közül.
Mire jó?
Szekció neve “Mire jó?”- Akciók: kuponkóddal hirdess akciót a lebegő sávból.
- Navigáció: az oldal új vagy kiemelt részére irányíthatod a látogatókat.
- Cselekvésre ösztönzés: a sáv gombjával hírlevélre iratkoztathatod fel a látogatókat, vagy más műveletre buzdíthatod őket.
Egy példa: egy ruhaüzlet tulajdonosa esős időt jósló előrejelzés miatt az esernyőkínálatra akarja felhívni a figyelmet, ezért lebegő sávot tesz az oldalra, amely minden oldalon látszik.
Lebegő sáv létrehozása lépésről lépésre
Szekció neve “Lebegő sáv létrehozása lépésről lépésre”A lebegő sáv előre elkészített sablonra épül. A sablont testre szabhatod, de nulláról nem készíthetsz új sablont.
A sablon létrehozása
Szekció neve “A sablon létrehozása”- A WordPress admin felületén nyisd meg a Lebegő Elemek menüpontot (az Elementor menüben, a Sablonminták mellett). A lista üres, amíg nem hozol létre elemet.
- Kattints az Új Lebegő elem hozzáadása gombra. Megnyílik az Új lebegő elemek ablak.
- A Lebegő elem kiválasztása listából válaszd a Lebegő sávok lehetőséget. (A másik lehetőség a Lebegő gombok.)
- Ha szeretnéd, add meg a sablon nevét a Nevezd el a sablonodat mezőben.
- Kattints a Lebegő elem létrehozása gombra.
A képen a Lebegő elem kiválasztása mezőben a Lebegő sávok áll, alatta a sablon neve, majd a Lebegő elem létrehozása gomb.
- A szerkesztő megnyílik, és előtte megjelenik a sablontár ablak a Lebegő sávok fülön. Ebből kell választanod egy sablont. Az ablak felirata a magyar felületen Médiatár.
- Vidd az egeret a kiválasztott sablon fölé, és kattints a Beszúrás gombra. A sablon megjelenik a szerkesztő vásznán.
A képen a lebegő sáv sablonok kártyái láthatók; a fölé vitt kártyán megjelenik a Beszúrás gomb.
A sablontárból a beszúráshoz az Elementor egy ingyenes személyes fiókhoz való kapcsolódást kér: ha a webhely még nincs csatlakoztatva, a Beszúrás után megjelenik a „Csatlakozás a sablontárhoz” képernyő, és a Kezdés gombbal kezdheted el a csatlakozást. A Pro jelölésű sablonok csak Elementor Pro felhasználóknak érhetők el.
A lebegő sáv szerkesztése
Szekció neve “A lebegő sáv szerkesztése”A panel beállításai a választott sablontól függnek. Példánkban megváltoztatjuk a sáv üzenetét, az ikont, a gombot és a sáv helyét.
- A panelen keresd meg az Ikon mezőt, kattints a jobb oldali ikonra, és válassz az ikonkönyvtárból (például esernyőt), majd kattints a Beszúrás gombra.
- A bejelentés mezőbe írd be az üzenetet, például: „Viharos idő? Nézd meg az esernyőinket.”
- Nyisd meg a CTA gomb mezőt, és a Szöveg mezőt írd át (például „Maradj szárazon!”). Egy valódi webáruházban ide a megfelelő oldalra mutató linket tennéd.
- Nyisd meg a Haladó fület, és kattints az alsó ikonra: a lebegő sáv a képernyő aljára kerül.
- A jobb felső sarokban kattints a Közzététel gombra.
- Kattints a feltétel hozzáadására.
- (Csak Elementor Pro felhasználóknak) Állíts be feltételeket, hogy a sáv hol jelenjen meg az oldalon. Részletek: a globális sablonok megjelenítési feltételeiről szóló fejezetben.
- Kattints a Mentés és bezárás gombra. A lebegő sáv ezután a kijelölt oldalakon megjelenik.
A lebegő sáv beállításai
Szekció neve “A lebegő sáv beállításai”Az alábbiak a lebegő sáv sablonok leggyakoribb beállításai. Sokféle sablon van, ezért egyeseknél eltérő beállítások vagy elrendezés lehet.
Tartalom fül
Szekció neve “Tartalom fül”| Beállítás | Mit csinál |
|---|---|
| Ikon | Ikon beszúrása a sávba |
| Szöveg (bejelentés) | Rövid szöveg a sávban; általában ne legyen hosszabb egy sornál |
| CTA gomb: Szöveg | A gombon megjelenő felirat, általában két-három szó |
| CTA gomb: Link | A gomb linkje: popup, az oldal egy lapja vagy bármilyen más művelet, amit link indíthat |
| CTA gomb: Ikon | A gomb ikonja |
| Bezáró gomb | Rejtett értéknél a látogatók nem tudják bezárni a sávot |
| Elérhető név | A sáv neve, amelyet a képernyőolvasók felolvasnak a korlátozott látású látogatóknak |
Stílus fül
Szekció neve “Stílus fül”| Szekció | Beállítások |
|---|---|
| Ikon | Szín, Pozíció (a bejelentés szövegének jobb vagy bal oldalán), Méret |
| Szöveg | Tipográfia (méret és betűtípus), Szín |
| CTA gomb | Típus (Gomb vagy Link); Tipográfia; Normál és Rámutatás állapot (a szöveg és a háttér színe); Szegély (ha bekapcsolod, színt és vastagságot is meg kell adnod); Sarkok (kerek, lekerekített vagy éles); Padding; Belépő animáció (az animáció stílusa és időtartama) |
| Bezáró gomb | Vízszintes pozíció (a sáv jobb vagy bal oldala), Szín, Méret |
| Elemek igazítása | A bejelentés szövege, az ikon és a CTA gomb igazítása: balra, középre, jobbra vagy Nyújtás (szétterülnek a sávon) |
| Elemek közti térköz | Mennyi hely legyen a szöveg, az ikon és a gomb között |
| Padding | Belső térköz a szövegnek, az ikonnak és a gombnak |
| Háttér | A sáv háttere |
| Háttér-fedés | Áttetsző háttér a sávhoz |
A szín és a térközök beállításáról lásd: Színválasztó és Térköz, margó és belső térköz.
Haladó fül
Szekció neve “Haladó fül”| Beállítás | Mit csinál |
|---|---|
| Függőleges pozíció | A sáv a képernyő tetején vagy alján jelenik meg |
| Ragadós (Sticky) | Ha kikapcsolod, a sáv eltűnik, ahogy a látogató lefelé görget az oldalon. Ez a hatás csak a weboldalon látszik, a szerkesztőben nem |
| Megnyitás | A legördülő menü aktiválása: kattintásra vagy rámutatásra |
| Animáció | A sáv lassú megjelenése; az animáció időtartama szabályozza, mennyi idő alatt jelenik meg teljesen |
| CSS ID | Azonosító a sávnak. Lásd: CSS-osztály és azonosító |
| CSS-osztályok | Osztály a sávnak. Lásd: CSS-osztály és azonosító |
| Egyedi CSS | Egyedi CSS a sávhoz |
| Attribútumok | Egyedi attribútumok a sávhoz |
Készült: