Tovább a tartalomhoz

Carousel Anything: több oszlop, automatikus lejátszás, végtelen mód és középső dia

Négy gyakori beállítás a Carousel Anything widgetben: egyszerre több dia, automatikus léptetés, körbeérő karusszel és a kiemelt középső dia.

Ez a fejezet a Carousel Anything widget négy gyakori beállítását írja le. Mindegyik a Stílus lap Carousel beállításai szakaszában, az Asztali gép fülön van. Előfeltétel a bekapcsolt widget és diánként egy közzétett, mentett Elementor-sablon.

A három első beállítás Pro. Az ingyenes bővítményben az Asztali oszlopok csak az 1 oszlopot kínálja, az automatikus lejátszás és a végtelen mód csak figyelmeztetést mutat (a karusszel mindig körbeér, és sosem játszik automatikusan), a középre igazítási mód kapcsolója pedig szintén csak figyelmeztetést.

Apró kártyák, logók vagy termékdobozok egyenként mutatva elvesznek. A widget több diát is megmutat egymás mellett, és külön oszlopszámot kap asztali gépen, táblagépen és telefonon.

  1. Jelöld ki a widgetet, és nyisd meg a Stílus → Carousel beállításai szakaszt.
  2. Az Asztali gép fülön válaszd ki az Asztali oszlopok értékét, például 3 oszlopot. A lista 1 és 12 oszlop között választ.
  3. A Következő/előző értéke Egy oszlop vagy Összes látható oszlop: az előbbi kattintásonként egy diát léptet, az utóbbi egy egész sornyit.
  4. A Tablet fülön válaszd ki az Oszlopok táblagépen értéket (1 és 8 oszlop között).
  5. A Mobil fülön válaszd ki a Mobil oszlopok értéket (1 és 6 oszlop között).

Tedd közzé az oldalt, és nézd meg különböző képernyőszélességeknél.

https://minta-bolt.hu/tp-kn4-car/
Háromoszlopos Carousel Anything nyilakkal és pontokkal

A képen három dia látszik egymás mellett, a két szélén a nyilakkal, alul a pontokkal.

Képernyőszélesség Használt oszlopszám
1024 px és szélesebb Asztali oszlopok
768 és 1023 px között Oszlopok táblagépen
767 px és keskenyebb Mobil oszlopok
  • Asztali 3, táblagépes 2 és mobil 1 beállítással a karusszel 1024 px-en 3 diát, 1023 és 768 px-en 2 diát, 767 és 390 px-en 1 diát mutatott.
  • Egy oszlop beállításnál a Következő gomb az 1 és 3 közötti diákról a 2 és 4 közöttiekre lép. Az Összes látható oszlop beállításnál a 4 és 6 közöttiekre.
  • Az Oszlopok táblagépen és a Mobil oszlopok értéke 1 oszloppal indul. Ha csak az asztali oszlopot állítod, a táblagép és a telefon egy diát mutat.
  • A karusszel 1024 px alatt vált a táblagépes oszlopokra. Pontosan 1024 px-en még az asztali oszlopszámot használja, pedig az Elementor ezt a szélességet már táblagépnek veszi.
  • A Reszponzív megjelenítés táblagépen és mobilon külön automatikus lejátszás, végtelen mód, pontok és nyilak beállítást nyit meg az adott eszközre. Ilyenkor az Automatikus lejátszás és a Végtelen mód is bekapcsolva indul. Bekapcsolás után ellenőrizd ezeket a kapcsolókat: táblagép szélességen a karusszel akkor is automatikusan lépett, ha asztali gépen ki volt kapcsolva.

A telefonon csak egy dia látszik. Állítsd be a Mobil oszlopok értékét a Mobil fülön, mert az nem követi az Asztali oszlopok értékét.

A karusszel táblagépen magától lépked. A Tablet fülön kapcsold ki az Automatikus lejátszás beállítást, vagy a Reszponzív megjelenítés táblagépen kapcsolót.

Az automatikusan lépő karusszel azoknak a látogatóknak is megmutatja az összes diát, akik nem kattintanak.

  1. Jelöld ki a widgetet, és nyisd meg a Stílus → Carousel beállításai szakaszt.
  2. Az Asztali gép fülön kapcsold be az Automatikus lejátszás beállítást. Pro változatban alapból be van kapcsolva.
  3. Állítsd be az Automatikus lejátszás sebességét ezredmásodpercben (500 és 10000 között, alapérték 3000).
  4. Kapcsold be a Szüneteltetés rámutatáskor beállítást, ha a karusszelnek meg kell állnia, amíg a látogató rámutat.

Tedd közzé az oldalt, és a nyilvános oldalon nézd meg. Az automatikus lejátszás a szerkesztőben nem fut.

Beállítás Mit csinál Alapérték
Automatikus lejátszás Időzítővel a következő diára lép. Be
Automatikus lejátszás sebessége A várakozás ideje a következő lépés előtt, ezredmásodpercben (500 és 10000 között). 3000
Szüneteltetés rámutatáskor Amíg az egérmutató a karusszel fölött van, megáll a lejátszás. Ki
Dia sebessége Egy mozgás ideje ezredmásodpercben. Hozzáadódik a várakozáshoz. 1500
  • Két dia között az Automatikus lejátszás sebessége és a Dia sebessége összege telik el. Az alapértékekkel (3000 + 1500) a dia kb. 4,5 másodpercenként váltott, 1000 és 300 értékkel kb. 1,3 másodpercenként.
  • Bekapcsolt Végtelen mód esetén a lejátszás az utolsó diától az elsőre ugrik.
  • Kikapcsolt Végtelen mód esetén a lejátszás nem áll meg az utolsó diánál: visszafelé fut az elsőig, majd újra előre.
  • A Szüneteltetés rámutatáskor bekapcsolva a karusszel ugyanazon a dián maradt, amíg a mutató fölötte volt, és a mutató eltávolodásakor azonnal folytatta.
  • Táblagépre és telefonra külön lejátszás állítható: nyisd meg a Tablet vagy Mobil fület, kapcsold be a Reszponzív megjelenítés táblagépen (illetve mobilon) kapcsolót, és ott állítsd az Automatikus lejátszást és a sebességét. Ez a kapcsoló az adott eszközön be is kapcsolja az automatikus lejátszást (1500-as sebességgel), akkor is, ha asztali gépen ki van kapcsolva. Ha nem kell, kapcsold ki abban a fülön.

A karusszel a szerkesztőben nem mozog. Ez a normális működés. Nézd meg a közzétett oldalon.

A karusszel a végén visszafelé megy. Kapcsold be a Végtelen mód beállítást, hogy az utolsó diától az elsőre ugorjon.

A diák túl lassan váltanak. Csökkentsd az Automatikus lejátszás sebességét, és nézd meg a Dia sebességét is: a hosszú mozgás hozzáadódik a várakozáshoz.

A körbeérő karusszelnek nincs első és utolsó diája: az utolsó után újra az első következik. Kikapcsolva a karusszel mindkét végén megáll.

  1. Jelöld ki a widgetet, és nyisd meg a Stílus → Carousel beállításai szakaszt.
  2. Az Asztali gép fülön kapcsold be vagy ki a Végtelen mód beállítást. Pro változatban alapból be van kapcsolva.
  3. Tedd közzé az oldalt, és a nyilakkal vagy a pontokkal próbáld ki a végeket.
Végtelen mód be Végtelen mód ki
Előző az első dián Az utolsó diára lép Letiltva, nem történik semmi
Következő az utolsó dián Az első diára lép Letiltva, nem történik semmi
Automatikus lejátszás az utolsó diánál Az első diával folytatja Visszafelé fut az elsőig, aztán újra előre
  • Táblagépre és telefonra más érték is állítható: kapcsold be a Reszponzív megjelenítés táblagépen (illetve mobilon) kapcsolót az adott fülön, és ott állítsd be a Végtelen módot. Bekapcsolva indul.
  • Az ingyenes bővítményben a Végtelen mód kapcsoló csak figyelmeztetést mutat, a karusszel pedig mindig körbeér: az első dián az Előző az utolsó diára lépett.

Az Előző nyíl az első dián nem csinál semmit. A Végtelen mód ki van kapcsolva, ezért az első dián túl nem lehet visszalépni. Kapcsold be, hogy körbeérjen.

Az automatikus lejátszás visszafelé megy. Kapcsold be a Végtelen módot. Nélküle a lejátszás az utolsó diánál megfordul.

Ha az aktív dia középen van, nagyobb, a szomszédai pedig csak belelógnak a képbe, a karusszel jobban olvasható. A Középre igazítási mód az aktív diát középen tartja, a Méretezés effekttel pedig nagyobbnak mutatja, mint a mellette lévőket.

1. lépés: a középre igazítás bekapcsolása

Szekció neve “1. lépés: a középre igazítás bekapcsolása”
  1. Jelöld ki a widgetet, és nyisd meg a Stílus → Carousel beállításai szakaszt.
  2. Az Asztali gép fülön állítsd az Asztali oszlopok értékét páratlan számra, például 3 oszlopra, hogy a középső diának jusson egy szomszédja mindkét oldalon.
  3. Kapcsold be a Középre igazítási módot, és állítsd be a Középső paddinget: ennyi pixel hely marad a karusszel bal és jobb szélén, ahová a szomszédos diák belelógnak.
  1. A Középső diaeffektek listában választhatsz: nincs, Méretezés vagy Árnyék.
  2. A Méretezés esetén állítsd be a Középső dia méretezését (alapérték 1) és a Normál dia méretezését (alapérték 0,8).
  3. A Normál dia átlátszatlansága (alapérték 0,7) elhalványítja az oldalsó diákat.

Tedd közzé az oldalt, és nézd meg az eredményt.

https://minta-bolt.hu/tp-kn4-car-kozep/
Három látható dia: a középső teljes méretű, a két szélső kisebb és halványabb, mellettük a szomszédos diák széle

A képen a Kezdő csomag dia a középen teljes méretben látszik, a mellette lévők kisebbek és halványabbak, a két szélen a következő diák keskeny sávja kikandikál.

Beállítás Mit csinál Alapérték
Középső padding Hely a karusszel bal és jobb szélén a szomszédos diáknak (0 és 500 px között). 0
Középső diaeffektek nincs, Méretezés vagy Árnyék. nincs
Középső dia méretezése A középső dia mérete a Méretezés effektnél (0,3 és 2 között). 1
Normál dia méretezése A többi dia mérete a Méretezés effektnél (0,3 és 2 között). 0,8
Normál dia átlátszatlansága A többi dia átlátszatlansága, ha van effekt (0,1 és 1 között). 0,7
  • 3 oszlop, 60-as Középső padding és Méretezés esetén a középső dia teljes méretű és átlátszatlan volt, a két oldalsó 80%-os méretű és 70%-os átlátszatlanságú.
  • A karusszel mozgatásakor a következő dia lesz az új középső.
  • nincs esetén a diák mérete és átlátszatlansága nem változik, csak a padding hat.
  • 1 oszlopnál és nagy (például 150) paddingnél egy széles dia ül középen, a szomszédok a két szélen kandikálnak be.
  • A Középre igazítási mód és a Középső padding táblagépre és telefonra is beállítható a Tablet és Mobil fülön, a Reszponzív megjelenítés táblagépen, illetve mobilon bekapcsolása után.
  • Az Árnyék a középső diát is halványítja: a középső dia megkapta az árnyékot, de ugyanolyan 70%-os átlátszatlansággal látszott, mint a többi. Ha a középső diának teljesen láthatónak kell maradnia, állítsd a Normál dia átlátszatlanságát 1-re.

A középső dia nem nagyobb. Állítsd a Középső diaeffektek értékét Méretezés-re, és a Normál dia méretezése legyen 1 alatt. nincs esetén egyik dia sem változtatja a méretét.

Nem látszanak a szomszédos diák. Növeld a Középső paddinget, vagy használj egynél több oszlopot.

Készült:

Tiszteletben tartjuk a magánszférádat

Sütiket használunk a böngészési élmény javítására és a forgalom elemzésére. Az analitika csak akkor indul, ha engeded. Adatvédelmi irányelvek, Sütitájékoztató.

Sütibeállítások