Háttérvideó az atomikus szerkesztőben

Háttérvideót az atomikus szerkesztőben úgy adsz az oldalhoz, hogy az elempanelről a vászonra húzod a Háttérvideó tárolóelemet. Az Általános fülön kiválasztod a videó forrását, beállítod a lejátszási opciókat, és testre szabhatod a Lejátszás és Szüneteltetés állapotok vezérlőit.

Mi a Háttérvideó elem?

A Háttérvideó rugalmas elrendezési tároló, nem egyszerű CSS háttértulajdonság. Beépített, beágyazott tartalomterülete van a fölé tett elemeknek (szöveg, gombok, flex tárolók), és állapottárolói a lejátszás és szüneteltetés gombok testreszabásához.

Ha egy meglévő tárolón kívül, a vászon nyitott részére ejted, az Elementor automatikusan egy szülő Flexbox tárolóba teszi.

Követelmények

Elementor 4.3.0 vagy újabb és WordPress 6.8 vagy újabb.

Háttérvideó hozzáadása

Példa: hős szakaszt építesz végtelenített háttérvideóval, rajta címsorral és gombbal.

1. Nyisd meg az Elementor szerkesztőt az oldalon vagy sablonon.
2. A bal oldali panelen az Atomikus elemek csoportban keresd meg a Háttérvideó elemet.
3. Húzd a vászonra. Ha egy meglévő tárolón kívülre ejted, az Elementor magától Flexbox tárolóba teszi.
4. Jelöld ki a Háttérvideó tárolót, hogy megnyíljon a panelje.
5. A Videó mezőnél válaszd ki a forrást: Videó kiválasztása, Feltöltés vagy Beszúrás URL-ről.
6. Állítsd be a lejátszási opciókat: Kezdés időpontja, Befejezési idő, Automatikus lejátszás, Némítás és Ismétlés.

https://minta-bolt.hu/wp-admin/post.php?post=10&action=elementor

A képen az Általános fül Tartalom szakasza látszik a videó helyével, az időpontokkal (másodpercben), a négy kapcsolóval és az Állapotok váltóval (Lejátszás, Szüneteltetés).

Tipp

A modern böngészők szigorú szabályokat alkalmaznak az automatikus lejátszásra. Hogy a háttérvideó minden eszközön megbízhatóan elinduljon, az Automatikus lejátszás mellett kapcsold be a Némítás kapcsolót is.

Vezérlők és állapotok

1. Vezérlők megjelenítése: bekapcsolva a webhelyen megjelennek a lejátszásvezérlő gombok, kikapcsolva nem.
2. Lejátszás és Szüneteltetés állapot: ha a vezérlők be vannak kapcsolva, az Állapotok váltóval átkapcsolhatsz a Lejátszás és a Szüneteltetés állapot között, és külön-külön stílusozhatod őket.
3. Vezérlőelemek beágyazása: húzz egyéni ikont, képet vagy bekezdést közvetlenül a lejátszás és szüneteltetés gombok tárolójába, így saját kezelőgombokat tervezhetsz.
4. Tartalom a videó fölött: húzz bármilyen atomikus elemet (címsort, szövegblokkot, gombot, többoszlopos flex tárolót) a fő videótartalom-területre, így tisztán a videó fölött jelenik meg.

A Beállítások szakaszban megadhatod a tároló HTML-címkéjét (alapértéke Div), az ID-t, az Attribútumokat és a Megjelenítési feltételeket.

Mire használhatod?

• Hős szakaszok: nagy hatású fejlécek háttérben futó, ismétlődő videóval, beágyazott szöveggel és gombokkal.
• Interaktív médiatárolók: promóciós szakaszok egyéni lejátszás/szüneteltetés vezérlőkkel, amelyek a látogató kattintására más szöveget vagy ikont mutatnak.
• Funkciókártyák: finom mozgó háttér egyes kártyák és tartalomblokkok mögött, nehéz külső videólejátszó beágyazása nélkül.

Gyakori kérdések

Hogyan működnek az egyéni Lejátszás és Szüneteltetés vezérlők? A kapcsoló állapottárolóként működik: bekapcsolva a panelen átkapcsolhatsz a két állapot között, és mindegyikbe külön beágyazhatsz tetszőleges elemet (ikont, képet, szöveget).

Tehetek szöveget vagy gombot közvetlenül a videó fölé? Igen. A Háttérvideó elemnek külön beágyazott tartalomterülete van, ide bármilyen tároló vagy atomikus elem kerülhet.

Mi történik, ha a Háttérvideó elemet a vászon gyökerébe ejtem? Automatikusan egy szülő Flexbox tárolóba kerül, hogy az elrendezés rendezett maradjon, és könnyen húzhasd.