# Carousel Anything: összekötés a Távoli carouselrel, a Folyamat/lépésekkel és az Információs dobozzal

> A Carousel Anything karusszel vezérlése külön gombokkal és pontokkal (Távoli carousel), a Folyamat/lépések lépéseivel, illetve az Információs doboz elemeivel egyező azonosítóval.

A [Carousel Anything](https://hub.hellowp.io/hu/plugins/theplus_elementor_addon/karuszell-navigacio-carousel-anything-attekintes/) karusszel vezérelhető más widgetekből. Mindegyik összekötés ugyanazon az elven működik: a karusszel kap egy azonosítót, a vezérlő widget pedig ugyanazt az azonosítót kapja, és a diák sorszám szerint illeszkednek.

A vezérlő oldal mindegyiknél Pro funkció. A Carousel Anything és az **Egyedi carousel-ID** mező az ingyenes bővítményben is megvan.

## 1. lépés: azonosító a karusszelnek

1. Jelöld ki a Carousel Anything widgetet.
2. A **Tartalom → Extra opciók** szakaszban írj egy azonosítót az **Egyedi carousel-ID** mezőbe, például `csomagok`. Betűt, számot, kötőjelet vagy aláhúzást használj, szóköz nélkül.

![Az Extra opciók szakasz az Egyedi carousel-ID mezővel](./kepek/karuszell-navigacio-panel-carousel-extra.webp)

*Az Extra opciók szakasz az Egyedi carousel-ID mezővel* (https://minta-bolt.hu/wp-admin/post.php?post=19&action=elementor)

A képen az **Egyedi carousel-ID** mező látszik, ide kerül az azonosító.

## Összekötés a Távoli carouselrel

A **Távoli carousel** widget a karusszelnek külön Következő/Előző gombokat és pontokat ad, amelyeket bárhová tehetsz az oldalon: címsor alá, szöveges oszlop mellé vagy oldalsávba. A két widgetet az azonos azonosító köti össze. Előfeltétel, hogy a Carousel Anything és a **Távoli carousel** widget is be legyen kapcsolva a **The Plus Addons → Widgets** oldalon.

1. Húzd a **Távoli carousel** widgetet arra a helyre, ahol a vezérlőknek lenniük kell.
2. A **Tartalom** szakaszban írd be ugyanazt az azonosítót az **Egyedi kapcsolati ID** mezőbe.
3. A **Távoli vezérlés típusa** maradjon **Körhinta**.

![A Távoli carousel Tartalom szakasza az Egyedi kapcsolati ID mezővel](./kepek/karuszell-navigacio-1-remote-panel.webp)

*A Távoli carousel Tartalom szakasza az Egyedi kapcsolati ID mezővel* (https://minta-bolt.hu/wp-admin/post.php?post=46&action=elementor)

A képen az **Egyedi kapcsolati ID** mező látszik, ugyanazzal az azonosítóval, mint a karusszelben.

4. Az **Előző/következő** szakaszban a **Következő/előző gomb** alapból be van kapcsolva, és Előző és Következő gombot mutat. Itt cserélheted a gombok szövegét és ikonjait.
5. A **Pontok** szakaszban kapcsold be a **Pontok** beállítást, és vegyél fel egy pontot minden diához, a diák sorrendjében.

![A Pontok szakasz a pontok listájával](./kepek/karuszell-navigacio-1-remote-panel-pontok.webp)

*A Pontok szakasz a pontok listájával* (https://minta-bolt.hu/wp-admin/post.php?post=46&action=elementor)

A képen a **Pontok** szakasz látszik, a diákhoz tartozó pontok elemeivel.

Tedd közzé az oldalt, és próbáld ki a gombokat és a pontokat a nyilvános oldalon.

![Carousel Anything a Távoli carousel Előző és Következő gombjaival](./kepek/karuszell-navigacio-carousel-taviranyito.webp)

*Carousel Anything a Távoli carousel Előző és Következő gombjaival* (https://minta-bolt.hu/tp-kn4-car-remote/)

A képen a dia alatt az **Előző** és **Következő** gomb látszik, amelyek a karusszelt léptetik.

- A **Következő** és az **Előző** egy lépéssel mozgatja a karusszelt.
- A pontra kattintva a karusszel a vele azonos sorszámú diára ugrik, és az a pont aktív lesz. Fordítva is működik: ha a karusszel másik diára lép, a hozzá tartozó pont lesz aktív.
- Csak az egyező azonosítójú karusszel reagál. Egy másik, eltérő azonosítójú Carousel Anything ugyanazon az oldalon a helyén marad.
- A pontok a diákhoz sorrend szerint illeszkednek. Ha kevesebb a pont, mint a dia, a többlet diáknak nincs pontja: három pontnál és négy dianál a harmadik pont aktív maradt, amikor a negyedik dia látszott. A diák sorrendjében és számban vedd fel a pontokat.
- A szóközt tartalmazó azonosító nem működik: a `csomagok terv` azonosítóval a gombok hatástalanok maradtak.

**A gombok nem csinálnak semmit.** Ellenőrizd, hogy az **Egyedi carousel-ID** és az **Egyedi kapcsolati ID** pontosan egyezik-e, és nincs-e benne szóköz. A **Távoli vezérlés típusa** **Körhinta** legyen.

**Egy pont rossz diát nyit.** A pontok elemei ugyanolyan sorrendben legyenek, mint a diák, és minden diához egy pont tartozzon.

## Összekötés a Folyamat/lépések widgettel

Egy lépéses folyamatot könnyebb követni, ha minden lépés mellett kép vagy rövid bemutató van. A **Folyamat/lépések** widget a Carousel Anythinghez köthető: egy lépésre rámutatva vagy kattintva a karusszel a hozzá tartozó diát mutatja, a karusszel mozgatásakor pedig a megfelelő lépés lesz aktív. Előfeltétel, hogy a **Folyamat/lépések** widget is be legyen kapcsolva, és a karusszelben diánként egy elem legyen.

1. Adj azonosítót a karusszelnek (lásd fent).
2. Add hozzá a **Folyamat/lépések** widgetet, és vegyél fel annyi lépést, ahány dia van, ugyanabban a sorrendben.
3. A **Tartalom** szakaszban kapcsold be a **Carousel Anything-kapcsolat** beállítást.
4. A **Kapcsolódó carousel ID-ja** mezőbe írd be ugyanazt az azonosítót.
5. A **Hatás erre** értéke **Rámutatás** (alapérték) vagy **Kattintás**.

Tedd közzé az oldalt, és próbáld ki a lépéseket a nyilvános oldalon.

![A Folyamat/lépések widget harmadik lépése kiválasztva, alatta a karusszel a harmadik diát mutatja](./kepek/karuszell-navigacio-5-lepesek-carousel.webp)

*A Folyamat/lépések widget harmadik lépése kiválasztva, alatta a karusszel a harmadik diát mutatja* (https://minta-bolt.hu/tp-kn5-ps/)

A képen a harmadik lépés (**Prémium csomag**) kattintás után aktív, és a karusszel a harmadik diára lépett.

- **Kattintás** esetén a harmadik lépésre kattintva a karusszel a harmadik diára lép, és a lépés kiemelt lesz. A rámutatás nem csinál semmit.
- **Rámutatás** esetén a harmadik lépésre mutatva ugyanez történik.
- Fordítva is működik: ha a karusszel a negyedik diára lép, a negyedik lépés lesz aktív.

Korlátok:

- A lépések és a diák csak pozíció szerint illeszkednek. Tartsd ugyanabban a sorrendben és számban őket.
- Az összekötés Pro funkció. Az ingyenes **Folyamat/lépések** widgetben a **Carousel Anything-kapcsolat** csak figyelmeztetést mutat.

**A lépés kiválasztása nem mozgatja a karusszelt.** Ellenőrizd, hogy a két azonosító pontosan egyezik, szóköz nélkül. Nézd meg a **Hatás erre** értéket is: **Kattintás** esetén a rámutatás nem csinál semmit.

**Rossz lépés van kiemelve.** A lépések ugyanabban a sorrendben legyenek, mint a karusszel diái.

## Összekötés az Információs dobozzal

Egy sor funkciódoboz egy nagy karusszel fölött gyakori elrendezés: a dobozok megnevezik a funkciókat, a karusszel részletesen megmutatja őket. Az **Információs doboz** widget **Körhinta** elrendezésben összeköthető a Carousel Anythinggel: egy dobozra rámutatva vagy kattintva a karusszel a megfelelő diára lép. Előfeltétel, hogy az **Információs doboz** widget is be legyen kapcsolva, és a Carousel Anythingben annyi dia legyen, ahány elem az információs dobozban.

1. Adj azonosítót a karusszelnek (lásd fent).
2. Add hozzá az **Információs doboz** widgetet, és a **Tartalom** szakaszban az **Elrendezés kiválasztása** legyen **Körhinta**.
3. Vegyél fel annyi elemet, ahány dia van, a diák sorrendjében.
4. Kapcsold be a **Carousel Anything-kapcsolat** beállítást.
5. A **Kapcsolódó carousel ID-ja** mezőbe írd be ugyanazt az azonosítót.
6. A **Hatás erre** értéke **Rámutatás** (alapérték) vagy **Kattintás**.
7. Ha szeretnél, az **Alapértelmezett aktív elem** listából kiválaszthatsz egy elemet.

![Az Információs doboz panelje: Körhinta elrendezés és a Carousel Anything-kapcsolat beállításai](./kepek/karuszell-navigacio-panel-infobox-kapcsolat.webp)

*Az Információs doboz panelje: Körhinta elrendezés és a Carousel Anything-kapcsolat beállításai* (https://minta-bolt.hu/wp-admin/post.php?post=22&action=elementor)

A képen a **Körhinta** elrendezés, a négy elem, a bekapcsolt **Carousel Anything-kapcsolat**, a **Kapcsolódó carousel ID-ja**, az **Alapértelmezett aktív elem** és a **Hatás erre** mező látszik.

Tedd közzé az oldalt, és próbáld ki az elemeket a nyilvános oldalon.

![Négy információs doboz egy összekötött Carousel Anything fölött, a harmadik doboz kiválasztva](./kepek/karuszell-navigacio-carousel-infobox.webp)

*Négy információs doboz egy összekötött Carousel Anything fölött, a harmadik doboz kiválasztva* (https://minta-bolt.hu/tp-kn4-car-infobox/)

A képen a harmadik doboz (**Prémium csomag**) kattintás után kiemelt, és a karusszel a megfelelő, harmadik diát mutatja.

- **Kattintás** esetén a harmadik elemre kattintva a karusszel a harmadik diára lép. **Rámutatás** esetén a harmadik elemre mutatva ugyanez történik.
- Ha az információs doboz egyszerre egy elemet mutat, a saját csúszkájának mozgatása a karusszelt is mozgatja, a karusszel mozgatása pedig az információs doboz csúszkáját a megfelelő elemre viszi.

Korlátok:

- Az elemek és a diák csak pozíció szerint illeszkednek. Tartsd ugyanabban a sorrendben és számban őket.
- Az összekötés csak az **Információs doboz** **Körhinta** elrendezésében érhető el, a **Lista** elrendezésben nem.
- Az ingyenes **Információs doboz** widgetben a **Carousel Anything-kapcsolat** csak figyelmeztetést mutat.

**A rámutatás vagy kattintás nem mozgatja a karusszelt.** Ellenőrizd, hogy mindkét azonosító pontosan egyezik, szóköz nélkül. Nézd meg a **Hatás erre** értéket is: **Kattintás** esetén a rámutatás nem csinál semmit. Az **Elrendezés kiválasztása** értéke **Körhinta** legyen.

**A karusszel rossz diát mutat.** Az információs doboz elemei ugyanabban a sorrendben legyenek, mint a karusszel diái.