# Modern galéria és horgonyalapú navigáció

> A Modern galéria szabad elrendezése és a Galéria horgonyalapú navigáció görgethető képsora.

## Modern galéria

A **Modern galéria** elem a termék képeit egyedi elrendezésben mutatja: egy nagy kép és több kisebb, váltakozó arányú és igazítású. Egyedi termékoldalra készült, amelyen egy fő és több másodlagos kép van.

1. Nyisd meg az oldalt az Elementorban, és húzd be a **Modern galéria** elemet.
2. Az **Általános** szekcióban válaszd ki a forrást: „WooCommerce-termékek”, „Bejegyzéstípusok” vagy „Kézi választás”. Termékforrásnál add meg a **Termék ID**t.
3. A **Képek** szekcióban állítsd be a képméretet.
4. Szükség szerint kapcsold be a videót, a nagyítást és a galériát (lightbox).
5. A **Stílus** fülön képenként megadhatod az arányt és az igazítást; ettől lesz egyedi az elrendezés. Külön formázható a lightbox indítógombja, a videó előugró ablakának gombja és a lejátszógomb.
6. Mentsd az oldalt.

![Modern galéria: nagy és kisebb képek váltakozó elrendezésben](./kepek/galeria-modern-front.webp)

*Modern galéria: nagy és kisebb képek váltakozó elrendezésben* (https://minta-bolt.hu/galeria-modern/)

A képen az első kép teljes szélességben látszik, alatta a többi kép eltérő méretben és igazítással követi.

Bejegyzéstípus-forrásnál a blokk stílusában külön állítható a képek aránya és a függőleges igazítás, a szegély és a háttérszín. A háttérszín csak átlátszó hátterű PNG-képeknél, vagy megadott belső margó (padding) mellett látszik.

## Galéria horgonyalapú navigáció

A **Galéria horgonyalapú navigáció** elem görgethető képsort készít. A képek egymás alatt jelennek meg, mellettük (vagy alattuk) horgonyos lapozó van, amellyel a látogató az adott képre ugrik. Termékekből, bejegyzéstípus-mezőből vagy kézzel választott képekből dolgozik, megadható hozzá kiemelt videó, és minden részéhez van stílusbeállítás.

1. Nyisd meg az oldalt vagy a termékoldal-sablont az Elementorban, és húzd be az elemet.
2. Az **Általános** szekcióban válaszd ki a forrást. Termékforrásnál add meg a **Termék ID**t.
3. A **Galéria bekapcsolása** kapcsolóval a lightbox és a hozzá tartozó **Galéria** szekció kapcsolható be (lásd [Nagyítás és lightbox](https://hub.hellowp.io/hu/plugins/jet-woo-product-gallery/nagyitas-es-lightbox/)).
4. A **Képek** részen állítsd be a képméretet és a bélyegképek méretét.
5. A navigáció részen megadhatod a navigáció típusát (pontok vagy bélyegképek) és helyét: a képek előtt vagy után, a lapozó igazítását és helyzetét.
6. Ha a termékhez videót adtál, a **Videó** szekcióban a megjelenítését is beállíthatod ([Videó](https://hub.hellowp.io/hu/plugins/jet-woo-product-gallery/video/)).
7. A **Stílus** fülön formázd az elemet, és mentsd az oldalt.

![Galéria horgonyalapú navigációval: egymás alatti képek és oldalt pontok](./kepek/galeria-horgony-front.webp)

*Galéria horgonyalapú navigációval: egymás alatti képek és oldalt pontok* (https://minta-bolt.hu/galeria-horgony/)

A képen a képek egymás alatt görgethetők, bal oldalon pontok jelzik az egyes képeket.