Kép blokk

A Kép blokkal egyetlen képet teszel az oldalra vagy a bejegyzésbe.

A blokk hozzáadása

Kattints a bal felső sarokban a + (blokkbeszúró) gombra, keress rá a Kép blokkra, és kattints rá. Gyorsabb, ha egy üres sorban a / jel után beírod a blokk nevét, és entert nyomsz.

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

A képen az eszköztár a kép fölött, az oldalsávban pedig a kép fájlneve és a Helyettesítő szöveg mező látszik.

Kezdő lehetőségek

Az új, még üres Kép blokkban háromféleképpen adhatsz meg képet:

• Feltöltés: tölts fel képet (vagy videót) a gépedről.
• Médiatár: válassz egy már feltöltött képet.
• Beszúrás URL-ből: illeszd be a kép webcímét, és nyomj entert.

Ha URL-ből szúrsz be képet, az eszköztáron a Feltöltés a médiatárba gombbal (felfelé mutató nyíl) másolatot menthetsz a képről a saját oldaladra. Ha nem teszed meg, a kép később eltűnhet az oldalról, ha az eredeti fájlt áthelyezik, törlik vagy nem osztják meg tovább. A módszer nem működik minden képnél, mert egyes oldalak tiltják a beágyazást és a másolást. Csak olyan képet használj, amelyhez van jogod.

További módok kép hozzáadására

• Húzás: húzz egy képet a gépedről egy üres oldalra vagy egy üres Bekezdés blokkba.
• Média fül a blokkbeszúróban: nyisd meg a + gombot, válaszd a Média fület, és kattints egy képre a médiatárból. Ha a témád támogatja az Openverse-t, onnan is választhatsz szabadon használható képet; ha nem, ez a lehetőség nem jelenik meg. Az Openverse-ből beszúrt kép automatikusan a médiatárba kerül. Meglévő kép cseréjéhez húzz egy képet a Média fülről a már az oldalon lévő képre.
• Másolás dokumentumból: képet beilleszthetsz más programból, például Wordből vagy Google Dokumentumokból. Előfordulhat, hogy a WordPress ezeket automatikusan feltölti. Ellenőrizd: jelöld ki a képet, és nézd meg, látszik-e az eszköztáron a Feltöltés a médiatárba gomb. Ha igen, kattints rá, hogy ne törjön el a kép később.

A kép adatai

A feltöltés után a médiatárban megadhatod a kép címét, feliratát, helyettesítő szövegét és leírását. Ezek a keresőoptimalizálásban és a hozzáférhetőségben segítenek, és a médiatárban is könnyebben megtalálod velük a fájlt. Ha a képnek van felirata, a WordPress automatikusan megjeleníti; az eszköztáron elrejtheted vagy megmutathatod.

Átméretezés

A kijelölt képen húzható fogantyúk jelennek meg. Húzd őket a kívánt méretig. A méretet az oldalsávban is megadhatod (lásd lent).

Eszköztár

Az eszköztár a kijelölt kép fölött látható, a gombok:

• Kép (átalakítás)
• Húzás, Mozgatás fel, Mozgatás le
• Igazít
• A duotone szűrő alkalmazása
• Link
• Körbevágás
• Kép fölötti szöveg hozzáadása
• Felirat (hozzáadása vagy eltávolítása)
• Csere
• Beállítások (három pont)

Átalakítás

A Kép gombbal a blokkot átalakíthatod Oszlopok, Csoport, Galéria, Borítókép, Részletek, Fájl vagy Média és szöveg blokká. A téma által kínált stílusok is itt érhetők el.

Mozgatás

A hat pontos Húzás fogantyúval húzd a képet az új helyére; kék vonal mutatja, hova kerül. A Mozgatás fel és Mozgatás le nyilak egy lépéssel viszik feljebb vagy lejjebb.

Igazítás

Az Igazít gombbal választhatsz:

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

A Széles és a Teljes szélesség csak akkor jelenik meg, ha a témád támogatja.

Szöveg körbefuttatása a kép körül

Ha azt szeretnéd, hogy a szöveg a kép mellett folytatódjon:

1. Tedd a képet közvetlenül a bekezdés fölé.
2. Jelöld ki a képet.
3. Kicsinyítsd le a képet.
4. Az eszköztáron válaszd a balra vagy a jobbra igazítást.
5. A bekezdés szövege körbefutja a képet.

Kisebb képeknél működik jól: a nagy kép nehezen olvashatóvá teheti a szöveget, főleg mobilon.

Duotone

A A duotone szűrő alkalmazása gomb két színnel átszínezi a képet. A választható színek a témától függnek.

Link

A Link gombbal a kép hivatkozást kap. A lehetőségek:

• Keresőmező: illessz be egy webcímet, vagy keress a saját oldalad tartalmára (oldal, bejegyzés).
• Kép fájljára hivatkozás: a kép a képfájlra mutat, új böngészőablakban nyílik.
• Csatolmányoldalra hivatkozás: a kép a WordPress csatolmányoldalára mutat.
• Nagyítás kattintásra: a látogató nagyobb nézetben (úgynevezett lightboxban) nyithatja meg a képet anélkül, hogy elhagyná az oldalt.

Körbevágás

A Körbevágás gomb megnyitja a médiaszerkesztőt, ahol részletesen szerkesztheted a képet közvetlenül a szerkesztőben. 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 kép alatti 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, így pontosan állítható.

Részletek fül: a kép adatait módosíthatod, anélkül hogy elhagynád a szerkesztőt: helyettesítő szöveg (írd le a kép tartalmát, vagy hagyd üresen, ha díszítőkép), felirat és leírás. 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, így az eredeti kép a médiatárban megmarad.

Visszavonás: szerkesztés közben a médiaszerkesztő alján visszaállíthatsz, visszavonhatsz és újra is végrehajthatsz. A változtatások után a szerkesztő alján megjelenő értesítésben is van visszavonás gomb, valamint a szerkesztő bal felső sarkában a visszavonás nyíl a + gomb mellett.

Kép fölötti szöveg

A Kép fölötti szöveg hozzáadása gombra a Kép blokk azonnal Borítókép blokká alakul át egy helyőrző szöveggel; írd át a saját szövegedre. Akkor használd, ha a kép díszítőjellegű, vagy a szöveg jól olvasható marad rajta. Jobb olvashatóságért állítsd a Borítókép blokk átfedésének színét vagy átlátszóságát.

Felirat

A Felirat gombbal megjeleníthetsz vagy elrejthetsz feliratot az adott képnél:

1. Kattints a gombra az eszköztáron.
2. Írd be a feliratot a kép alatti mezőbe.
3. A felirat elrejtéséhez kattints a gombra újra.

Csere

A Csere gombbal másik képet választhatsz a médiatárból, újat tölthetsz fel, vagy visszaállíthatod a blokkot a kezdő állapotba.

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

A menüben a szokásos blokkműveletek vannak: másolás, megkettőzés, zárolás, szerkesztés HTML-ként. A Kép blokknál van egy extra: a kép beállítása Kiemelt képként a bejegyzéshez vagy oldalhoz.

Blokkbeállítások

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

Tartalom fül

• Média: kattints a kép bélyegképére vagy a fájlnevére, hogy új képet tölts fel, a médiatárból válassz, vagy visszaállítsd a blokkot. A mellette lévő három pontos menüvel visszaállíthatod a képet vagy a helyettesítő szöveget.
• Helyettesítő szöveg: írj értelmes leírást a képről, hogy a képet nem látó látogatók is megértsék. A Határozzuk meg a kép célját link döntési segédletre mutat arról, milyen szöveg kell az egyes helyzetekben. Ha itt írsz szöveget, az csak ezen az oldalon vagy bejegyzésben érvényes. A médiatárban megadott helyettesítő szöveg az alapértelmezés, amikor a képet máshol is beszúrod.
• Díszítőkép: csak akkor jelöld be, ha a kép nem ad hozzá érdemi információt, és nincs funkciója. Ilyenkor a képernyőolvasók kihagyják, nem mondanak fölösleges, zavaró szöveget.

Beállítások fül

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

• Felbontás: a kép méretét választod ki (Teljes méret, Nagy, Közepes, Bélyegkép). Hogy mi érhető el, a témától és az eredeti kép méretétől függ.
• Haladó: HTML-horgony, további CSS-osztály(ok), további CSS, Cím attribútum és stílusok. A cím attribútummal a kép szerepét írhatod le az oldalon, de sok eszköz és böngésző nem jeleníti meg.

Stílusok fül

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

A képen a Stíluslapok (a témától függ; gyakori az Alapértelmezett és a Lekerekített, ez lekerekített sarkokat ad), a Szűrők és a Méretek panel látszik.

• Stíluslapok: csak akkor jelenik meg, ha a témád egyedi képstílusokat ad.
• Szűrők: a kép megváltoztatása nélkül adhatsz szűrőhatást. A Kéttónusú (duotone) szűrő az eszköztárról is elérhető.
• Méretek: a margót állíthatod. Itt vannak a képarány, szélesség és magasság beállításai is.
• Képarány: a kép alakját változtatja meg (négyzet, álló, fekvő). Egyes arányok levághatnak a képből, hogy kitöltsék az alakot. Ez csak a megjelenést érinti, a képfájlt nem szerkeszti. Képarány választása után további beállítások jelenhetnek meg: szélesség és magasság, méretezés és fókuszpont.
• Szélesség és Magasság: a kép megjelenítési méretét adják. Legtöbbször hagyd Automatikus értéken. Átméretezéshez add meg a szélességet, a magasság követi. Százalékot csak akkor használj, ha a képnek a tárolójához képest kell méreteződnie. Fix magasságot csak akkor adj meg, ha a kialakítás megköveteli, mert nehezebben kezelhető a különböző képernyőméreteken.
• Méretezés: azt szabályozza, hogyan illeszkedik a kép a választott képarányhoz. A Kitöltés kitölti a teljes képterületet, a kép egy része levágódhat. A Befoglalás a teljes képet megmutatja, de üres hely maradhat körülötte, ha az alak eltér.
• Fókuszpont: azt jelöli ki, a kép melyik része maradjon látható, ha van beállított képarány. Leginkább Kitöltés méretezésnél hasznos, mert az levághat a képből.
• Keret és árnyék: keretszín, vastagság, lekerekítés és árnyék.