Galéria-diavetítés

A Galéria-diavetítés elem a képeket csúszkában mutatja. Sok kép esetén helyet takarít meg, mert a látogató lapozva nézi végig őket. A képek forrása a termékazonosító alapján a WooCommerce-termék; a nagyítás, a lightbox, a videó és a bélyegképes lapozó is használható.

Az elem elhelyezése

1. Nyisd meg az oldalt vagy a termékoldal-sablont az Elementorban.
2. Keresd meg a Galéria-diavetítés elemet a keresőben, és húzd a kívánt helyre.
3. Az Általános szekcióban válaszd ki a forrást (lásd Általános beállítások).
4. Állítsd be a Képek és a Diavetítés szekciót.
5. Kattints a Közzététel vagy Frissítés gombra, és nézd meg a weboldalon.

Képek szekció

https://minta-bolt.hu/wp-admin/post.php?post=22&action=elementor

Beállítás	Mit csinál	Alapérték
Képméret	A nagy kép felbontása.	Large
Bélyegképek mérete	A bélyegképek felbontása.	Thumbnail

Ezek a megjelenített kép minőségét szabják meg, az elem méretét a befoglaló konténer adja.

Diavetítés szekció

https://minta-bolt.hu/wp-admin/post.php?post=22&action=elementor

Beállítás	Mit csinál	Alapérték
Irány	A csúszka iránya: vízszintes vagy függőleges. Eszközönként (asztali, tábla, mobil) külön is megadható.	Vízszintes
Végtelenítés bekapcsolása	Az utolsó kép után újra az első jön.	Nem
Egységes diamagasság bekapcsolása	Minden dia egyforma magas lesz.	Nem
Húzás érzékenysége	Mennyire érzékeny a csúszka a húzásra.	0,8
Diák középre igazításának bekapcsolása	A diák középre igazítva jelennek meg; ilyenkor megadható az egyszerre látható diák száma és a köztük lévő távolság.	Nem
Átmeneti effektus	A lapozás animációja.	Csúsztatás

Navigáció

A Navigáció alatt a Bekapcsolás kapcsolóval a nyilakat lehet ki- és bekapcsolni (alapból be van kapcsolva). Bekapcsolva az Előző nyíl és a Következő nyíl ikonját Médiatárból vagy feltöltéssel választhatod ki:

1. Kattints az Előző nyíl (vagy a Következő nyíl) gombra. Megnyílik a Médiatár.
2. Válassz egy már feltöltött ikont, vagy töltsd fel a sajátodat a Fájlok feltöltése fülön.
3. Kattints a Kiválasztás gombra, hogy az ikon a nyílhoz kerüljön.

Lapozó (pagination)

A lapozó alapból be van kapcsolva. Ha a lapozó típusát bélyegképekre állítod, az elem a nagy kép mellett a többi képet bélyegképként mutatja. Itt állítható:

• a lapozó típusa: pontok vagy bélyegképek;
• a bélyegképes lapozó pozíciója: elejére vagy végére;
• eszközönként az egyszerre látható bélyegképek száma és a köztük lévő távolság;
• a bélyegképek saját nyilai.

Vízszintes csúszka bélyegképekkel

1. Az Irány legyen „Vízszintes”.
2. Kapcsold be a lapozót, és válaszd a bélyegképes típust.
3. Frissítsd az oldalt. A bélyegképek a nagy kép alatt jelennek meg.

https://minta-bolt.hu/galeria-csuszka/

A képen a nagy kép alatt négy bélyegkép látszik, az aktuális kép kiemelt.

Függőleges csúszka bélyegképekkel

1. Az Irány legyen függőleges.
2. A lapozót hagyd bekapcsolva, a típusa legyen bélyegkép.
3. Válaszd ki, hogy a bélyegképek a csúszka elején (bal oldalon) vagy a végén jelenjenek meg.

https://minta-bolt.hu/galeria-fuggoleges/

A képen a bélyegképek bal oldalon, egymás alatt állnak, jobbra a nagy kép látszik.

Csúszka a blokkszerkesztőben

A Gallery Slider blokk ugyanígy működik, a beállítások megegyeznek az Elementor-elemével.

1. Nyisd meg az oldalt vagy bejegyzést, kattints a blokkbeszúró gombra, vagy írj be egy „/” jelet az üres területen, és kezdd el gépelni a blokk nevét.
2. Tedd a blokkot a kívánt helyre. Ha a csúszka mellé más tartalom is kell (például űrlap), előbb használj Oszlopok blokkot, és abba helyezd a csúszkát.
3. Az Általános beállításoknál három forrás közül választhatsz: bejegyzéstípusok, kézi kiválasztás vagy WooCommerce-termékek. Termékeknél add meg a termékazonosítót is. Az azonosítót a Termékek listában látod, ha az egérrel a termék fölé állsz.
4. Szükség esetén kapcsold ki a kiemelt képet, és kapcsold be a nagyítást és a galériát. A Galéria bekapcsolása kapcsoló a lightboxot kapcsolja be: kattintásra a kép nagyban nyílik meg.
5. Állítsd be a Képek és a Diavetítés fület, majd kattints a Mentés gombra.

Ha termékoldal-sablont szerkesztesz, és a termékazonosító mezőt üresen hagyod, a csúszka az éppen megnyitott termék képeit mutatja. Ezért a sablonban nem kell azonosítót megadni.

A blokkok stílusát a JetStyleManager bővítménnyel állíthatod.

Csúszka beállítása termékoldal-sablonban

A vízszintes és a függőleges csúszka is elkészíthető egy Elementorban szerkesztett egy-termékes sablonban (a blokkszerkesztőben ugyanígy megy). Előfeltétel az ingyenes Elementor vagy a blokkszerkesztő.

1. Nyisd meg a sablont, keresd meg a Galéria-diavetítés elemet a keresőben, és húzd a helyére.
2. Az Általános résznél válaszd a WooCommerce-termékek forrást.
3. A Diavetítés résznél állítsd be az Irányt: vízszintes vagy függőleges.
4. A lapozónál kapcsold be a Bekapcsolás kapcsolót, és a típus legyen bélyegképek. Vízszintes csúszkánál a bélyegképek a nagy kép alatt jelennek meg. Függőlegesnél a bélyegképek Pozícióját is megadhatod: elöl vagy hátul.
5. Kattints a Közzététel vagy Frissítés gombra, majd nyiss meg egy tetszőleges terméket a weboldalon. A csúszkával az adott termék képei között lapozhatsz.