# Visszaszámláló widget: fejlécsáv és tapadó időzítő

> Hogyan tedd a Visszaszámlálót vékony akciósávba a fejléc fölé, és hogyan tapadjon az oldal tetejére görgetés közben.

Egy hosszú értékesítési oldal közepén lévő visszaszámlálót csak az látja, aki odáig görget. Egy vékony sáv a fejléc fölött vagy az oldal tetejére tapadó időzítő mindenkinek látszik. A **Visszaszámláló** widgetnek nincs saját pozíciós beállítása: a tapadást és az egész webhelyre kiterjedő megjelenést a tároló és a fejlécsablon adja. A widget dolga, hogy elég kicsi legyen a sávhoz, és számoljon tovább.

Minden, amit itt leírunk, az ingyenes változatban is elérhető: a rögzített **Indítás dátuma**, a három **Visszaszámláló stílusa** minta és a **Sorközi stílus**. Előfeltétel az Elementor, és a widget bekapcsolása a **The Plus Addons → Widgets** oldalon.

## Akciósáv a fejléc fölött

Az egész webhelyre kiterjedő sávhoz a fejlécet globálisan szerkesztő sablon kell: ezt az Elementor Pro Theme Builderje vagy a Nexter Builder adja. Enélkül a sáv csak azon az egy oldalon lesz meg, ahová építed.

1. Nyisd meg szerkesztésre a fejlécsablonodat.
2. Adj hozzá egy tárolót a meglévő fejlécsor fölé. Adj neki háttérszínt és szűk kitöltést, kb. 15 képpontot fent és lent.
3. Húzd a **Visszaszámláló** widgetet a tárolóba.
4. Az **Elrendezés** szakaszban a **Visszaszámlálás beállítása** maradjon **Normál visszaszámlálás**, és állítsd be az **Indítás dátuma** mezőt az akció végére.
5. A **Visszaszámláló stílusa** maradjon **Stílus 1**, és kapcsold be a **Sorközi stílus** kapcsolót. Ettől fér el az időzítő egy sávban.
6. Tedd közzé a fejlécsablont, és nézd meg egy olyan oldalon, amelyre érvényes.

![A Visszaszámláló Elrendezés szakasza a Sorközi stílus kapcsolóval](./kepek/dobozok-gombok-2-szamlalo-panel.webp)

*A Visszaszámláló Elrendezés szakasza a Sorközi stílus kapcsolóval* (https://minta-bolt.hu/wp-admin/post.php?post=91&action=elementor)

A képen a **Sorközi stílus** kapcsoló látszik, amely a négy egységet egy sorba teszi.

| Beállítás | Mit csinál | Alapérték |
| --- | --- | --- |
| **Sorközi stílus** | A négy egységet egy sorba teszi: kb. 37 képpont magas 124 helyett. Csak a **Stílus 1** esetén érhető el. | Ki |
| **Visszaszámlálás beállítása** | A **Normál visszaszámlálás** mindenkinek ugyanabban a pillanatban jár le. | Normál visszaszámlálás |
| **A napok szakaszának szövege** és a többi három | Rövidítsd a feliratokat (például N, Ó, P, M), ha szűk a sáv. | Nap, Óra, Perc, Másodperc |

Hogyan viselkedik:

- A widget ugyanúgy működik fejlécben, mint bárhol máshol.
- A **Sorközi stílus** mellett a négy egység egy sorban áll, a widget magassága az eredeti harmada.
- Ha a fejléctároló tapad, az időzítő látszik marad, és görgetés közben is számol.
- A határidő a WordPress időzónájából jön, ezért mindenki ugyanabban a pillanatban látja lejárni a sávot.

Korlátozások:

- A webhelyre kiterjedő megjelenés nem a widget érdeme. Ha nincs témaszerkesztős fejlécsablonod, a sáv csak azon az oldalon lesz, amelyiken megépítetted.
- A **Sorközi stílus** nem reszponzív: egyetlen be- vagy kikapcsolt érték. Keskeny telefonon a sáv még törhet; rövidítsd a feliratokat, vagy rejts el egy egységet.
- Az **Indítás dátuma** percre pontos, és a **Stílus 2** meg a **Stílus 3** a látogató időzónájában olvassa a határidőt (lásd a [beállítások áttekintését](https://hub.hellowp.io/hu/plugins/theplus_elementor_addon/dobozok-gombok-visszaszamlalo-attekintes/)). Ha a pontos végidő számít, maradj a **Stílus 1** stílusnál.
- Állítsd a widget gyorsítótárát **Inaktív** értékre a **Haladó** fülön, hogy ne jelenjen meg elavult határidő.

## Tapadó időzítő

Egy határidő addig hat, amíg látszik. Ha az olvasó elgörget mellette, a sürgetés is elmegy.

1. Döntsd el, hol lesz a sáv: egy tárolóban az oldal tetején, vagy a fejlécsablonban, ha az egész webhelyre kell.
2. Húzd a **Visszaszámláló** widgetet a tárolóba.
3. Az **Elrendezés** szakaszban hagyd a **Normál visszaszámlálás** értéket, és állítsd be az **Indítás dátuma** mezőt.
4. A **Visszaszámláló stílusa** maradjon **Stílus 1**, és kapcsold be a **Sorközi stílus** kapcsolót, hogy az időzítő egy sor magas legyen.
5. Jelöld ki a tárolót (ne a widgetet), és a **Haladó → Mozgáshatások → Tapadás** értékét állítsd **Fent**-re. Adj a tárolónak háttérszínt és z-indexet, hogy az oldal fölött maradjon.
6. Tedd közzé, és görgess.

| Hol | Beállítás | Mit csinál |
| --- | --- | --- |
| Visszaszámláló widget | **Sorközi stílus** | Egy sorba teszi az egységeket. Csak a **Stílus 1** esetén érhető el. |
| Visszaszámláló widget | **Indítás dátuma** | A határidő, a WordPress időzónája szerint. |
| Tároló | **Mozgáshatások → Tapadás** | A tárolót fent vagy lent az oldalhoz rögzíti görgetéskor. Elementor Pro funkció. |
| Tároló | **Z-index** | A rögzített sávot az oldal fölött tartja. |

- Az időzítő görgetés közben is számol, a mérés szerint 1400 képpontnyi görgetésnél is frissült.
- A **Sorközi stílus** miatt a widget olyan alacsony, hogy elfér a sávban, és nem takarja az oldalt.
- A rögzítést a tároló végzi. A widget nem tud róla, hogy rögzítve van-e.

Korlátozások:

- A widget nem tud magától tapadni: a **Visszaszámláló** panelen nincs pozíciós beállítás. Ha a tároló nincs rögzítve, az időzítő sem.
- Az Elementor tapadási beállítása az Elementor Pro-hoz kell. Csak ingyenes Elementorral a tároló nem tapad, a normál folyamatban marad, és elgörög. Alternatíva a Nexter Builder tapadó fejléce, vagy a témád saját tapadó fejléce.
- A lejárat pillanatában **Stílus 1** esetén nem történik semmi, az **Indítás dátuma** percre pontos, és az elemgyorsítótár miatt a határidő elavult lehet. Ezekről a [beállítások áttekintésében](https://hub.hellowp.io/hu/plugins/theplus_elementor_addon/dobozok-gombok-visszaszamlalo-attekintes/) írunk részletesen.

## Hibaelhárítás

| Jelenség | Ok és megoldás |
| --- | --- |
| A sáv elgörög az oldallal. | A tároló nem tapad. Ellenőrizd, hogy a tárolón (nem a widgeten) állítottad be a **Tapadás** értéket, és hogy van Elementor Pro vagy más tapadófejléc-eszköz: az ingyenes Elementor nem rögzít tárolót. |
| A sáv takarja a tartalmat. | Adj a tárolónak z-indexet, és tegyél a fölötte elhelyezkedő szakasz fölé kitöltést, vagy használd az Elementor tapadási eltolását. A **Sorközi stílus** is jóval alacsonyabbá teszi a sávot. |
| Az időzítő görgetés után megáll. | Nem szabadna megállnia. Ha mégis, nézd meg a böngészőkonzolt, hogy egy másik bővítmény JavaScript-hibát ad-e, és állítsd a widget gyorsítótárát **Inaktív** értékre. |
| A sáv túl magas. | Kapcsold be a **Sorközi stílus** kapcsolót (csak **Stílus 1** esetén látszik), és csökkentsd a tároló kitöltését. A widget maga 37 képpont magas sorközi stílusban, ami ennél magasabb, a tárolóból jön. |
| Mobilon két sorba tör. | Rövidítsd a feliratokat a **Tartalom forrása** szakaszban (például **A napok szakaszának szövege**: N), vagy kapcsold ki a **nap** kapcsolót, ha az akció egy napnál rövidebb. |
| A sáv csak egyes oldalakon látszik. | A fejlécsablon megjelenítési feltételei miatt van, nem a widget. Nézd meg, mely oldalakra van kiosztva a sablon. |