# Képek és ikonok hozzáadása

> Kép beszúrása a médiatárból, ikon választása az ikonkönyvtárból vagy saját SVG feltöltése.

A grafikai elemek lehetnek képek vagy ikonok. Tájékoztatják a látogatókat, vagy egyszerűen élénkebbé teszik az unalmas szövegrészt. Először válaszd ki, melyiket szeretnéd használni.

## Kép beszúrása

1. Kattints a grafikai mezőre.
2. Megnyílik a WordPress médiatára.
3. Ha a kép még nincs a médiatárban, töltsd fel a **Fájlok feltöltése** fülön.
4. Kattints a **Fájlok kiválasztása** gombra, és add hozzá a képet.
5. A kép feltöltődik, és megjelenik mellette a csatolmány részleteinek ablaka. Itt megadhatod a helyettesítő szöveget (alt), a címet, a feliratot és a leírást. Ezek nem kötelezők, de a helyettesítő szöveg javítja a hozzáférhetőséget, a felirat pedig a keresőoptimalizálást. A részletek között megtalálod a kép URL-jét is, amelyet könnyen másolhatsz és megoszthatsz.
6. Kattints a **Kiválasztás** gombra.

![A Média beszúrása ablak a Fájlok feltöltése füllel](./kepek/stilus-mediatar.webp)

*A Média beszúrása ablak a Fájlok feltöltése füllel* (https://minta-bolt.hu/wp-admin/post.php?post=24&action=elementor)

A képen a megnyitott médiaablak látszik: a **Fájlok feltöltése** fül mellett ott a **Médiatár** fül is.

## Ikon beszúrása

1. Kattints a grafikai mezőre.
2. Ha az Elementor könyvtárából szeretnél ikont választani, válaszd az **Ikonkönyvtár** lehetőséget. Ha saját SVG-ikont használsz, válaszd az **SVG feltöltése** lehetőséget. A könyvtár három ikonstílust tartalmaz: normál, tömör és márkaikonok. A márkaikonok között ismert márkák logói is vannak, például az Apple, az Amazon vagy az Etsy.
3. Az ikonkönyvtárból válassz egy ikont, majd kattints a **Beszúrás** gombra.
4. SVG esetén a feltöltést a médiatáron keresztül végzed.

## Az ikon megjelenése

Az **Ikon** widget **Tartalom** fülén a **Megtekintés** listában háromféle megjelenés közül választhatsz:

![Az Ikon widget Tartalom füle a Megtekintés listával](./kepek/stilus-ikon-nezet.webp)

*Az Ikon widget Tartalom füle a Megtekintés listával* (https://minta-bolt.hu/wp-admin/post.php?post=24&action=elementor)

- **Alapértelmezett:** csak az ikon, díszítés nélkül.
- **Halmozott:** az ikon egy színezett kör (vagy más alakzat) belsejében áll.
- **Keretezett:** az ikont fehér hátterű, keretes alakzat veszi körül.

A **Halmozott** és a **Keretezett** választásakor az alakzatot is megadhatod: **Négyzetes**, **Lekerekített** vagy **Kör**.