# Dynamic Device: eszközcsúszka (Speciális carousel)

> Képcsúszka készítése a Dinamikus eszköz Speciális carousel elrendezésével: típusok, csúszkabeállítások és az eszközkeret pozicionálása.

A **Dinamikus eszköz** widget **Speciális carousel** elrendezése képek halmazát csúszkává alakítja, fölötte eszközkerettel. Két dolgot érdemes előre tudni: ez az elrendezés kevesebb eszköztípust kínál, mint a normál, és a keretet kézzel kell a csúszkára igazítani. A widget és a bekapcsolása az [áttekintő fejezetben](https://hub.hellowp.io/hu/plugins/theplus_elementor_addon/kepek-media-eszkoz-attekintes/) szerepel.

## Eszköztípusok a carouselben

A **Speciális carousel** elrendezésben a **Típus** négy értéket kínál: **Mobil** (alapérték), **Laptop**, **Asztali gép** és **Egyéni**. Okosóra keret a widgetben egyáltalán nincs, tablet pedig csak a **Normál** elrendezésben van. Órához, tablethez vagy bármilyen más eszközhöz válaszd az **Egyéni** típust, és tölts fel saját keretképet. A keretnek átlátszó képernyőterületű PNG-nek kell lennie, különben eltakarja a tartalmat.

## A csúszka felépítése

1. Készítsd elő a csúszka képeit a Médiatárban.
2. Húzd a **Dinamikus eszköz** widgetet az oldalra.
3. A **Tartalom** fülön állítsd az **Elrendezés** mezőt **Speciális carousel**re. Az egyetlen eszközre vonatkozó beállítások eltűnnek, helyükre a csúszka beállításai lépnek.
4. Válassz **Típus**t. **Egyéni**nél a saját keretedet töltsd fel.
5. A megjelenő legördülőben válaszd ki a keretet. A **Mobil eszköz** ebben az elrendezésben alapból az iPhone White keret (500 × 890 px).
6. A **Több kép kiválasztása** mezőben add hozzá a csúszka képeit. A carousel ezt a galériát görgeti végig.

![A Dinamikus eszköz Tartalom füle Speciális carouselre állítva](./kepek/kepek-media-eszkoz-csuszka-tartalom.webp)

*A Dinamikus eszköz Tartalom füle Speciális carouselre állítva* (https://minta-bolt.hu/wp-admin/post.php?post=94&action=elementor)

A képen az **Elrendezés** **Speciális carousel**, a **Típus** **Mobil eszköz**, és megjelent a **Több kép kiválasztása** mező.

A carousel csak képeket fogad: a **Tartalom** legördülő, vagyis a **Sablon** és az **IFrame** a **Normál** elrendezéshez tartozik.

## Csúszkabeállítások

A csúszka viselkedése a **Stílus** fül **Carousel-opciók** szakaszában van.

![A Carousel-opciók szakasz](./kepek/kepek-media-eszkoz-csuszka-stilus.webp)

*A Carousel-opciók szakasz* (https://minta-bolt.hu/wp-admin/post.php?post=94&action=elementor)

| Beállítás | Mit csinál | Alapérték |
|---|---|---|
| **Carousel-oszlop** | az egy dia (Single Slide) egyszerre egy diát mutat, a **Többes kiválasztás** a középső dia mellett a szomszédosakat is | **Többes kiválasztás** |
| **Végtelen** | végtelenített csúszka; bekapcsolva a csúszka észrevétlenül megkettőzi a diákat a megszakítás nélküli körhöz | bekapcsolva |
| **Automatikus lejátszás** | a csúszka magától lép tovább | kikapcsolva |
| az automatikus lejátszás sebessége | egy dia megjelenési ideje ezredmásodpercben (500 és 10000 között); csak bekapcsolt automatikus lejátszásnál látszik | 4000 |
| **Dia sebessége** | a diaváltás ideje ezredmásodpercben (200 és 5000 között) | 700 |
| **Pontok** | a pontnavigáció a csúszka alatt | kikapcsolva |
| **Nyilak** | az előző és következő nyíl | kikapcsolva |

A pontok és a nyilak alapból ki vannak kapcsolva, ezért azt a navigációt, amit szeretnél, kapcsold be. A kinézetüket a **Carousel-pontok** és a **Carousel nyilai** szakaszban állíthatod.

A **Carousel-dia** szakasz a diák és a keret beállításait tartalmazza.

![A Carousel-dia szakasz](./kepek/kepek-media-eszkoz-csuszka-dia.webp)

*A Carousel-dia szakasz* (https://minta-bolt.hu/wp-admin/post.php?post=94&action=elementor)

A szakaszban ezek vannak: **Diák közötti rés/térköz**, **Lista margója**, **Diák közötti térköz beállítása**, **Carousel szélessége**, **Makett szélessége**, **Makett magassága**, **Makett eltolása**, **Z-Index**, **Box Shadow**, valamint **Dia átlátszatlansága** és **Dia méretezése** külön **Normál** és **Rámutatás** fülön.

## Az eszközkeret pozicionálása

Ez az a rész, ahol a legtöbben elakadnak. A **Speciális carousel** elrendezésben az eszközkeret külön réteg a csúszka fölött, és alapból nincs a diákhoz igazítva. Egy próbaoldalon a keret nagyjából 330 × 582 képpontos volt az elem bal szélén, a csúszka pedig kb. 1360 × 552 képpontos, és ráfestett a keretre, így az eredmény egy sima képcsúszka lett telefonkeret nélkül.

- A keretet a **Stílus → Carousel-dia** szakasz **Makett szélessége**, **Makett magassága** és **Makett eltolása** mezői, valamint a **Z-Index** helyezi el.
- Ezeknek nincs alapértékük, ezért kezdi a keret rossz helyen.
- A jó értékek a dia méretétől és a választott kerettől függenek, ezért szemre állítsd be őket: előbb méretezd a keretet a középső diához, utána told el, amíg a dia fölé nem kerül.

Ha olyan makettet szeretnél, amit nem kell hangolni, használd a **Normál** elrendezést: egy eszköz, egy kép, a keret már a helyén van.

## Hogyan viselkedik

Egy **Mobil** típusú, öt képes csúszkával, bekapcsolt pontokkal és nyilakkal:

- A csúszka elindul és körbefut. Öt képből tizenkét diacsomópont lett: az öt valódi és hét másolat, amit a **Végtelen** hoz létre az alapértékén.
- A navigáció a beállítás szerint jelent meg: öt pont, képenként egy, és két nyíl.
- A szomszédos diák látszanak, mert a **Carousel-oszlop** alapértéke a **Többes kiválasztás**. Ha egyszerre egy diát szeretnél, válaszd az egy dia értéket.
- Az alapbeállításokkal az eszközkeret nem a diák fölött áll, hanem a bal szélen, a csúszka alatt.

![A Speciális carousel öt képpel, pontokkal és nyilakkal](./kepek/kepek-media-eszkoz-csuszka.webp)

*A Speciális carousel öt képpel, pontokkal és nyilakkal* (https://minta-bolt.hu/km2-eszkoz-csuszka/)

A képen a csúszka a pontokkal és a nyilakkal látszik, a telefonkeret viszont még nincs a diák fölé igazítva.

## Hibaelhárítás

**Látom a diákat csúszni, de eszközkeret nincs.** Az alapbeállításoknál ez várt: a keret a widget bal szélén áll, és a csúszka ráfest. Nyisd meg a **Stílus → Carousel-dia** szakaszt, és állítsd be a **Makett szélessége**, **Makett magassága** és **Makett eltolása** értékét úgy, hogy a keret a középső dia fölé kerüljön.

**Nincs okosóra vagy tablet a Típus mezőben.** Okosóra keret nincs a widgetben, a tablet pedig csak a **Normál** elrendezésben érhető el. A carouselben az **Egyéni** típussal tölts fel saját keretképet, átlátszó képernyőterületű PNG-t.

**Nem találom a Carousel-opciók szakaszt.** Csak a **Speciális carousel** elrendezésnél jelenik meg a **Stílus** fülön.

**Hol vannak a pontok és a nyilak?** Alapból mindkettő ki van kapcsolva: a **Carousel-opciók** szakaszban kapcsold be őket.
