# Borítókép blokk

> Háttérszín, kép vagy videó szöveges átfedéssel: hozzáadás, kiemelt kép, eszköztár, beállítások, szín, szűrők.

A **Borítókép** blokk háttérszínt, képet vagy videót tesz az oldalra, rajta szöveges átfedéssel. Jól használható fejlécekhez, szalagszerű kiemelésekhez, felhívásokhoz és hasonlókhoz.

## A blokk hozzáadása

Kattints a **+** (blokkbeszúró) gombra, keress rá a **Borítókép** blokkra, és kattints a blokk ikonjára. Gyorsabb, ha egy üres sorban a `/` jel után beírod a blokk nevét, és entert nyomsz.

### Kezdő lehetőségek

Az új Borítókép blokkban a következőket teheted:

- Tölts fel képet vagy videót a gépedről.
- Válaszd a **Médiatár** lehetőséget egy már feltöltött kép vagy videó kiválasztásához.
- Használd a bejegyzés vagy oldal kiemelt képét a borítókép hátterének.
- Válassz háttérszínt a paletta egyik körére kattintva. Később a blokk beállításaiban másikra is válthatsz.
- Húzd le vagy fel a blokk alsó szélét az átméretezéshez.

### A blokk átméretezése

A blokk alatt húzás közben megjelenik egy átméretező fogantyú. A húzással a blokk magasságát változtatod, ami a **Minimális magasság** értékét állítja be a blokkbeállításokban; a számot ott közvetlenül is átírhatod.

### Kiemelt kép megjelenítése

Az oldal vagy bejegyzés kiemelt képét is beállíthatod a Borítókép blokk hátterének. Ez jól kombinálható az oldalcím blokkkal.

![A Borítókép blokk kijelölve: eszköztár, fókuszpont és a helyettesítő szöveg a Beállítások fülön](./kepek/blokkok-borito-szerkeszto.webp)

*A Borítókép blokk kijelölve: eszköztár, fókuszpont és a helyettesítő szöveg a Beállítások fülön* (https://minta-bolt.hu/wp-admin/post.php?post=8&action=edit)

A képen a Borítókép blokk eszköztára és a **Beállítások** fül látszik: **Fix háttér**, **Ismétlődő háttér**, **Fókuszpont** és **Helyettesítő szöveg**.

## Eszköztár

A kijelölt blokk fölött az eszköztár gombjai: **Borítókép** (átalakítás), **Húzás**, **Mozgatás fel**, **Mozgatás le**, **Igazít**, **A duotone szűrő alkalmazása**, **Tartalom helyzetének megváltoztatása**, **Teljes magasság**, **Háttérkép méretre vágása**, **Csere** és **Beállítások**.

### Átalakítás

A Borítókép blokkot átalakíthatod Oszlopok, Részletek, Csoport, Média és szöveg, Kép vagy Videó blokká.

### Mozgatás

A **Mozgatás fel** és **Mozgatás le** nyilakkal a blokk egy lépést mozog, a hat pontos **Húzás** fogantyúval szabadon áthelyezheted.

### Igazít

| Beállítás | Mit csinál |
| --- | --- |
| Nincs | A blokk a jelenlegi méretén marad. |
| Széles | A blokk szélesebb lesz a tartalomnál. |
| Teljes szélesség | A blokk a képernyő teljes szélességét kitölti. |
| Balra igazítás | A blokk balra kerül. |
| Középre igazítás | A blokk középre kerül. |
| Jobbra igazítás | A blokk jobbra kerül. |

### Tartalom helyzetének megváltoztatása

Ezzel a gombbal a blokkon belüli szöveg helyét állíthatod: a bal felső saroktól a jobb alsóig kilenc helyzet közül választhatsz.

### Teljes magasság

A **Teljes magasság** a blokkot az olvasó képernyőjének teljes magasságára nyújtja, így magával ragadóbb hatást kelt.

### Média hozzáadása és csere

Az új, még médiát nem tartalmazó Borítókép blokk eszköztárán a **Média hozzáadása** gombbal megnyithatod a médiatárat, feltölthetsz fájlt, használhatod a kiemelt képet, vagy beágyazhatsz egy videót URL-ből. Ha a blokkban már van háttérkép vagy háttérvideó, a **Csere** gombbal másik képet vagy videót választhatsz.

### Körbevágás

A **Háttérkép méretre vágása** gomb megnyitja a médiaszerkesztőt, ahol részletesen szerkesztheted a háttérképet közvetlenül a szerkesztőben. A szerkesztőnek két füle van: **Vágás** és **Részletek**.

**Vágás fül:**

- Húzd a fogantyúkat szabadkézi kijelöléshez, vagy válassz képarány-előbeállítást (szabad, négyzet 1:1 és több más).
- A nagyítással (+/−) finomabban állíthatod a kijelölést.
- A forgatással balra vagy jobbra fordíthatod a képet, vagy a vonalzót húzva fokonként egyenesítheted.
- A tükrözéssel vízszintesen vagy függőlegesen tükrözheted a képet.
- A vágókeret a kép képpontjaihoz illeszkedik.

**Részletek fül:** helyettesítő szöveg (írd le a kép tartalmát, vagy hagyd üresen díszítőkép esetén), felirat és leírás, valamint csak olvasható adatok: a feltöltés dátuma, a feltöltő, a fájlnév, a fájltípus, a méret és a képméret.

A módosítások elfogadásához kattints a mentésre, az elvetésükhöz a mégsemre. A WordPress a szerkesztett képet új fájlként menti, az eredeti kép a médiatárban megmarad.

### Beállítások (három pont)

A menüben többek között másolhatod, megkettőzheted vagy HTML-ként szerkesztheted a blokkot.

## Blokkbeállítások

Az oldalsáv megnyitásához kattints a **Közzététel** melletti beállítások gombra, és válaszd a **Blokk** fület. A panel két fülre oszlik: **Beállítások** és **Stílusok** (az ikonjukról ismered fel őket).

### Beállítások fül

- **Fix háttér:** látványos gördülési hatást ad. Bekapcsolva a háttérkép a helyén marad, miközben az oldal tartalma csúszik fölötte. Kikapcsolva a kép a szöveggel együtt gördül.
- **Ismétlődő háttér:** a képet mintaként megismétli a blokkon belül. Hasznos, ha kicsi a kép, és többször szeretnéd egymás mellé tenni. A **Fix háttér** bekapcsolásával együtt is használható, de nem kötelező együtt.
- **Fókuszpont:** ha a fix háttér ki van kapcsolva, a fókuszpont-választó megmutatja a kép fő érdekes pontját. Húzd a pontot a kívánt helyre, vagy a **Bal** és **Fent** mezőkben százalékban add meg.
- **Poszterkép (videónál):** videó feltöltése után megadhatsz egy előnézeti (poszter) képet, ami lassú internetkapcsolatnál vagy mobilon segít a hozzáférhetőségben.
- **Felbontás:** kiemelt kép, médiatárbeli vagy újonnan feltöltött kép esetén legördülő menüből választhatsz képméretet (Bélyegkép, Közepes, Nagy, Teljes méret), így optimalizálhatod a teljesítményt és a képminőséget.
- **Helyettesítő szöveg:** írj leírást a háttérképhez, hogy a képernyőolvasót használó látogatók is megértsék a tartalmát. Díszítőképnél hagyd üresen.

### Stílusok fül

![A Borítókép blokk Stílusok füle: betűméret, borítás színe, átfedés átlátszósága, szűrők, elrendezés](./kepek/blokkok-borito-stilusok.webp)

*A Borítókép blokk Stílusok füle: betűméret, borítás színe, átfedés átlátszósága, szűrők, elrendezés* (https://minta-bolt.hu/wp-admin/post.php?post=8&action=edit)

A képen a **Betűkészlet**, a **Szín** (a **Borítás** színével és az **Átfedés átlátszósága** csúszkával), a **Szűrők** és az **Elrendezés** panel látszik.

- **Elrendezés:** a **A belső blokkok a tartalom szélességét használják** kapcsolóval a beágyazott blokkok a tartalom szélességét követik (teljes és széles szélességgel). A tartalom szélességét is megadhatod, ez a középső vagy széles oszlopba igazított elemekre vonatkozik.
- **Szín:** szöveg-, háttér- és linkszínt adhatsz a blokknak; a kínálat a témától függ. Színátmenetet így tehetsz a blokkra: alakítsd a blokkot Média és szöveg blokká, kattints a háttér lehetőségre, válaszd a színátmenet fület, válassz színt, majd alakítsd vissza a blokkot Borítókép blokká.
- **Szűrők:** a **A duotone szűrő alkalmazása** lehetőség a blokkbeállításokból is bekapcsolható.
- **Betűkészlet:** a blokk szövegének betűcsaládja, mérete, stílusa és betűköze.
- **Méretek:** belső és külső margó, blokkköz, képarány és minimális magasság.
- **Keret és árnyék:** keretszín, vastagság, lekerekítés és árnyék.
- **Haladó:** HTML-horgony, további CSS-osztály(ok), további CSS, HTML-elem, stílusok és engedélyezett blokkok (itt szabályozhatod, milyen blokkok kerülhetnek a Borítókép blokkba).