# Video Player widget: áttekintés, fedőkép és stílus

> A Video Player widget bekapcsolása, a forrás kiválasztása, a ragadós videó, a fedőkép vagy ikon és a stílusbeállítások.

A **Video Player** widget YouTube-os, Vimeós vagy a saját médiatárból feltöltött videót tesz az oldalra. A videó elé fedőképet vagy lejátszó ikont lehet tenni, a videó felugró ablakban is megnyitható, és a lejátszó formázható (keret, árnyék, szűrők, maszk).

A widget a The Plus Addons alapbővítményének része, ezért az Elementoron kívül más nem kell hozzá.

## Bekapcsolás

1. Nyisd meg: **The Plus Addons → Widgets**.
2. Keress rá a **Video Player** névre.
3. Kapcsold be a kapcsolóját.

Az Elementor szerkesztőjében a panelen keress rá a **Video Player** névre, és húzd az oldalra.

## A Video szakasz

A **Source** legördülőben választod ki, honnan jön a videó. A választástól függően más mezők jelennek meg.

| Forrás | Mit kell megadnod | Részletek |
|---|---|---|
| **Youtube** | a videó azonosítója a **YouTube Id** mezőben | [Videó forrásai és beállításai](https://hub.hellowp.io/hu/plugins/theplus_elementor_addon/kepek-media-video-forrasok/) |
| **Vimeo** | a videó azonosítója a **Vimeo Id** mezőben | [Videó forrásai és beállításai](https://hub.hellowp.io/hu/plugins/theplus_elementor_addon/kepek-media-video-forrasok/) |
| **Self Hosted** | egy mp4 fájl a **Mp4 Video Link** mezőben | [Videó forrásai és beállításai](https://hub.hellowp.io/hu/plugins/theplus_elementor_addon/kepek-media-video-forrasok/) |

![A Video szakasz a YouTube forrással](./kepek/kepek-media-video-forras-youtube.webp)

*A Video szakasz a YouTube forrással* (https://minta-bolt.hu/wp-admin/post.php?post=64&action=elementor)

A képen a **Source** mező **Youtube** értékkel és a **YouTube Id** mező látszik.

### Ragadós videó (Sticky Video)

A **Sticky Video** kapcsolóval a videó a képernyő egy sarkában marad, amikor a látogató legörgeti a widget mellett. A bekapcsolás után megjelenik a **Position** legördülő, amelyben a sarkot választod ki:

| Érték | Hol jelenik meg a videó, ha a widget már kicsúszott a képből |
|---|---|
| **Bottom Left** | bal alsó sarok |
| **Bottom Right** | jobb alsó sarok |
| **Top Right** | jobb felső sarok |
| **Top Left** | bal felső sarok |

## Video Options

Ebben a szakaszban a lejátszás viselkedését állítod. A kapcsolók a kiválasztott forrástól függnek, a részletes listát a [Videó forrásai és beállításai](https://hub.hellowp.io/hu/plugins/theplus_elementor_addon/kepek-media-video-forrasok/) fejezet tartalmazza.

## Image/Icon

Itt döntöd el, hogy a videó helyén fedőkép vagy ikon látszik-e, amelyre kattintva indul a lejátszás.

![Az Image/Icon szakasz Banner Image beállítással](./kepek/kepek-media-video-kep-ikon.webp)

*Az Image/Icon szakasz Banner Image beállítással* (https://minta-bolt.hu/wp-admin/post.php?post=67&action=elementor)

A képen a **Banner Image** beállítás mezői látszanak: a fedőkép, az ikon, a cím és a leírás.

A **Only Icon / Full Banner** legördülőben két lehetőség van:

| Érték | Mit jelent |
|---|---|
| **Only Icon image** | csak egy ikon látszik a videó helyén, a videó felugró ablakban nyílik meg |
| **Banner Image** | fedőkép és ikon együtt; a videó felugró ablakban is nyitható (lásd lent) |

Az **Only Icon image** esetén a **Choose Image** mezővel tölthetsz fel képet ikonként.

A **Banner Image** esetén:

1. Kapcsold be a **Banner Image** kapcsolót.
2. Az **Image Upload** mezőben válaszd ki a fedőképet. A **Képfelbontás** legördülővel a méretét állíthatod.
3. Az **Icon Upload** mezőben tölts fel egy lejátszás ikont, ha szeretnél ikont a fedőkép fölé. Ennek is van **Képfelbontás** legördülője.
4. A **Title of Video** mezőbe írd a videó címét, a **Video Description** mezőbe a rövid leírást.

A cím és a leírás csak akkor jelenik meg, ha a **Banner Image** be van kapcsolva. A videó felugró ablakban való megnyitását a [Videó felugró ablak, maszk és szűrők](https://hub.hellowp.io/hu/plugins/theplus_elementor_addon/kepek-media-video-effektek/) fejezet írja le.

## Stílus fül

A Video Player kinézetét a **Stílus** fülön állítod.

![A Stílus fül a Video Styling szakasszal](./kepek/kepek-media-video-stilus.webp)

*A Stílus fül a Video Styling szakasszal* (https://minta-bolt.hu/wp-admin/post.php?post=67&action=elementor)

A képen a **Video Styling** szakasz látszik a **Normal** és a **Hover** lappal.

| Szakasz | Mit állíthatsz benne |
|---|---|
| **Video Title** | a videó címének tipográfiáját, színét és háttérszínét; csak akkor látszik, ha az **Image/Icon** szakaszban be van kapcsolva a **Banner Image** |
| **Video Description** | a leírás tipográfiáját és színét; ez is csak a **Banner Image** bekapcsolásakor látszik |
| **Video Styling** | szegély, lekerekítés, **Box Shadow**, **Transform Effect** (egyedi CSS átalakítás, pl. `rotate(2deg) skew(50deg)`) és **CSS Filters**, mindegyik külön a **Normal** és a **Hover** állapotra; itt van a **Video On Popup** kapcsoló is |
| **Icon Setting** | a videón lévő ikon formázása; itt kapcsolhatod be a folyamatos animációt (**Continuous Animation**, **Animation Effect**) és a rámutatásos animációt (**Hover Animation**) |
| **Mask Image** | képmaszk a videóra |
| **On Scroll View Animation** | a bővítmény közös kiterjesztése, görgetéskor lép be az elem |

A **Haladó** fül ugyanaz, mint a bővítmény többi widgetjénél.

## Kapcsolódó fejezetek

- [Videó forrásai és beállításai](https://hub.hellowp.io/hu/plugins/theplus_elementor_addon/kepek-media-video-forrasok/): YouTube, Vimeo és saját videó.
- [Videó felugró ablak, maszk és szűrők](https://hub.hellowp.io/hu/plugins/theplus_elementor_addon/kepek-media-video-effektek/)