# Elementor: Course Carousel és Course List

> A kurzuskarusszel és a kurzuslista widget elrendezési, lekérdezési, lapozási és stílusbeállításai.

A két widget a webhely kurzusait jeleníti meg: a **Course Carousel** karusszelként, a **Course List** rácsos listaként. A közös beállítások (Typography, Border Type, Border Radius, Box Shadow, Padding) leírását az [Elementor: első lépések és kurzus-widgetek](https://hub.hellowp.io/hu/plugins/tutor-pro/integraciok-elementor/) fejezet tartalmazza. A „reszponzív” beállítást eszközönként külön is megadhatod, az eszköz ikonjára kattintva.

## Közös elrendezési beállítások (Content → Layout)

| Beállítás | Mit csinál |
|---|---|
| **Skin** | A megjelenés: **Classic**, **Card**, **Stacked** vagy **Overlayed**. |
| **Hover Animation** | A kártya fölé húzott egér animációja be- és kikapcsolható. |
| **Show Image** | A kurzus kiemelt képének megjelenítése. |
| **Image Size** | A kép mérete. A listánál az előre megadott méretek mellett a **Custom** is választható. |
| **Meta Data** | A metaadatok megjelenítése. |
| **Rating** | A kurzus értékelése. |
| **Avatar** | Az oktató avatarja. |
| **Difficulty Level** | A kurzus nehézségi szintje. |
| **Category** | A kurzus kategóriája. |
| **Wishlist** | Kívánságlista-gomb (könyvjelző ikon) a kártya sarkában. |
| **Footer** | A kártya lábléce, amely a beiratkozás (Enroll Now) gombot tartalmazza. |

Csak a karusszelnél: **Slides to Show** (hány kártya látszik egyszerre, eszközönként), **Image Ratio** (a kép képaránya). Csak a listánál: **Columns** (oszlopok száma), **Courses Per Page** (kurzusok száma oldalanként), **Author** (a szerző megjelenítése) és **Pagination** (lapozás be- és kikapcsolása).

## Közös lekérdezés (Content → Query)

A lekérdezésben külön adhatod meg, mit vegyen bele és mit hagyjon ki a widget (Include és Exclude):

| Beállítás | Mit csinál |
|---|---|
| **Categories** | A beleveendő vagy kihagyandó kategóriák. |
| **Authors** | A beleveendő vagy kihagyandó szerzők. |
| **Order By** | Rendezés dátum vagy cím szerint. |
| **Order** | Növekvő vagy csökkenő sorrend. |
| **Limit** | (Csak a karusszelnél.) Hány kurzus jelenjen meg; beírhatod vagy a nyilakkal állíthatod. |

## Course Carousel: karusszel-beállítások (Content → Carousel Settings)

| Beállítás | Mit csinál |
|---|---|
| **Arrows** | Nyilas navigáció. |
| **Dots** | Pontos navigáció. |
| **Transition Duration** | Az átmenet hossza másodpercben. |
| **Centered Slides** | Középre igazított diák. |
| **Smooth Scrolling** | Finom görgetés. |
| **Autoplay** | Automatikus lapozás. |
| **Autoplay Speed** | Az automatikus lapozás sebessége. |
| **Infinite Loop** | Az utolsó dia után újra az első jön, körbe. |
| **Pause on Hover** | A lapozás szünetel, amíg az egér a karusszel fölött van. |
| **Pause on Interaction** | A lapozás szünetel, ha a látogató használja a karusszelt. |

## Course List: lapozás (Content → Pagination)

| Beállítás | Mit csinál |
|---|---|
| **Previous/Next** | A lapozó típusa: **Previous/Next**, **Previous/Next + Numbers** vagy **Numbers**. |
| **Page Limit** | A lapok számának korlátja. |
| **Previous Label** | Az előző gomb felirata. |
| **Next Label** | A következő gomb felirata. |
| **Alignment** | Balra, középre vagy jobbra igazítás. |

## Stílusbeállítások (Style fül)

### Layout (csak a listánál)

**Columns Gap** (oszlopok közti távolság), **Rows Gap** (sorok közti távolság), **Alignment** (balra, középre, jobbra).

### Card

| Beállítás | Mit csinál |
|---|---|
| **Background Color** | A kártya háttérszíne. |
| **Border Type**, **Border Radius**, **Box Shadow**, **Padding** | A **Normal** és **Hover** állapotra külön. A **Box Shadow** a szerkesztő ikonnal állítható: szín, vízszintes és függőleges eltolás, elmosás, szórás. |
| **Footer Separator Color** | A lábléc elválasztójának színe. |
| **Footer Separator Width** | Az elválasztó vastagsága. |

### Image

| Beállítás | Mit csinál |
|---|---|
| **Background Type** | **Classic** (egyszínű vagy képes háttér) vagy **Gradient** (kétszínű átmenet; megadható a helye, a típusa lineáris vagy sugaras, és a szöge). A **Normal** és **Hover** állapotra külön. |
| **CSS Filters** | **Blur**, **Brightness**, **Saturation**, **Hue**. |
| **Avatar → Size** | Az oktató avatarjának mérete. |
| **Avatar → Border Radius** | Az avatar lekerekítése, a lánc ikonnal a sarkok külön is. |

### Content

| Rész | Beállítások |
|---|---|
| **Title** | **Color**, **Typography**, **Space**. |
| **Meta → Author** | **Key Color**, **Value Color**, **Typography**. |
| **Meta → Category** | Karusszelnél csak a **Key Color**; listánál a **Key Color**, **Value Color** és **Typography**. |

### Rating

**Star Color**, **Star Size**, **Typography**, **Text Color**, **Gap** (a csillagok közti távolság, eszközönként).

### Footer

| Beállítás | Mit csinál |
|---|---|
| **Background Color** | A lábléc háttérszíne. |
| **Padding** | Négy oldal, a lánc ikonnal külön is, eszközönként. |
| **Price** | Az ár **Typography** és **Text Color** értéke. |
| **Cart Button** | **Typography**, **Text Shadow** (szín, elmosás, vízszintes és függőleges eltolás); **Normal** és **Hover** állapotra külön: **Background Color**, **Text Color**, **Icon Color**. |
| **Border Type**, **Border Radius** | A lábléc szegélye és lekerekítése. |
| **Box Shadow** | Szín, vízszintes és függőleges eltolás, elmosás, szórás, kívül (outline) vagy belül (inset). |

### Pagination (csak a listánál)

| Beállítás | Mit csinál |
|---|---|
| **Typography** | A lapozó szövegének betűstílusa. |
| **Colors** | A **Normal**, **Hover** és **Active** állapotra külön: **Text Color**, **Background Color**. |
| **Border Type**, **Box Shadow**, **Border Radius** | A lapozó szegélye, árnyéka (szín, eltolások, elmosás, szórás, outline vagy inset) és lekerekítése. |
| **Padding** | Négy oldal, eszközönként. |
| **Space Between** | Az előző és a következő gomb közti távolság. |

### Arrows (csak a karusszelnél)

| Beállítás | Mit csinál |
|---|---|
| **Arrow Style** | A nyilak stílusa. |
| **Position** | A nyilak helye. |
| **Icon Size** | Az ikon mérete. |
| **Arrow Color**, **Shadow** | A **Normal** és **Hover** állapotra külön. Az árnyék: szín, eltolások, elmosás, szórás, outline vagy inset. |

### Dots (csak a karusszelnél)

| Beállítás | Mit csinál |
|---|---|
| **Position** | **Outside** (kívül) vagy **Inside** (belül). |
| **Size** | A pontok mérete. |
| **Alignment** | Balra, középre vagy jobbra. |
| **Gap** | A pontok függőleges távolsága. |
| **Space Between** | A pontok közti távolság. |
| **Fill Color** | A pontok kitöltőszíne, **Normal** és **Hover** állapotra külön. |