# Dinamikus widgetek és blokkok, a Dynamic Field

> A JetEngine dinamikus elemei Elementorban, a blokkszerkesztőben és Bricksben, és a Dynamic Field forrásai, elrendezése, kimenetszűrői (callbackjei) és környezete.

A JetEngine dinamikus elemei az oldalszerkesztőben megjelenítik a bejegyzések, kifejezések, felhasználók és egyéb objektumok adatait. Ugyanaz az elem három szerkesztőben is megvan, a nevük kicsit eltér:

| Elem | Elementor | Blokkszerkesztő | Bricks |
|---|---|---|---|
| Meta- és objektumadatok szövegként | **Dynamic Field** widget | **Dynamic Field** blokk | **Dynamic Field** elem |
| Dinamikus kép | **Dynamic Image** widget | **Dynamic Image** blokk | **Dynamic Image** elem |
| Dinamikus hivatkozás | **Dynamic Link** widget | **Dynamic Link** blokk | **Dynamic Link** elem |
| Dátum, szerző, hozzászólások száma | **Dynamic Meta** widget | **Dynamic Meta** blokk | **Meta Data** elem |
| Ismétlő mező tételei | **Dynamic Repeater** widget | **Dynamic Repeater** blokk | **Dynamic Repeater** elem |
| Bejegyzéshez rendelt kifejezések | **Dynamic Terms** widget | **Dynamic Terms** blokk | **Dynamic Terms** elem |

Használhatod őket közönséges oldalakon és bejegyzéseken, a JetEngine listázási sablonjaiban, témasablonokban és előugró ablakokban is.

A **Dynamic Image** és a **Dynamic Link** beállításait a [Dynamic Image és Dynamic Link](https://hub.hellowp.io/hu/plugins/jet-engine/dinamikus-tartalom-kep-es-link/) fejezet írja le. Ez a fejezet a **Dynamic Field** elemmel foglalkozik.

## A Dynamic Field blokk megkeresése

1. Nyiss meg egy oldalt a blokkszerkesztőben.
2. Kattints a **Blokk beszúrása** (+) gombra, és keress rá: „Dynamic Field”.
3. A beszúrt blokk beállításai a jobb oldali sávban, a **Blokk** fülön vannak. A stílusbeállítások a **Blokkstílus** füleken találhatók.

![A Dynamic Field blokk beállításai a blokkszerkesztő oldalsávjában](./kepek/dinamikus-tartalom-1-mezo-blokk.webp)

*A Dynamic Field blokk beállításai a blokkszerkesztő oldalsávjában* (https://minta-bolt.hu/wp-admin/post.php?post=22&action=edit)

A képen a blokk **Általános** szakasza látszik: a **FORRÁS** listában a „Bejegyzés/kifejezés/felhasználó/objektum adatai” van kiválasztva, a **POST OBJECT** listában a „Cím”. Az oldal szerkesztővásznán a blokk máris a bejegyzés címét mutatja.

## Milyen mezőtípusokat jeleníthet meg?

A Dynamic Field a következő mezőtípusok értékét tudja kiírni: szöveg (Text), dátum (Date), idő (Time), dátum és idő (Datetime), szövegdoboz (Textarea), vizuális szerkesztő (WYSIWYG), kapcsoló (Switcher), jelölőnégyzetek (Checkbox), ikonválasztó (Iconpicker), média (Media), galéria (Gallery), rádiógomb (Radio), választólista (Select), szám (Number), színválasztó (Colorpicker) és bejegyzések (Posts). Elementorban emellett az ismétlő mező (Repeater), a HTML és a térkép (Map) mezők is kiírhatók.

## Általános beállítások

A **FORRÁS** listából azt választod ki, honnan jön az adat:

| Forrás | Mit csinál |
|---|---|
| **Bejegyzés/kifejezés/felhasználó/objektum adatai** | A bejegyzés, kifejezés, felhasználó vagy más objektum alapmezőit adja vissza, például az azonosítót, a címet, a szerzőt vagy a dátumot. A konkrét mezőt a **POST OBJECT** (kifejezésnél, felhasználónál a megfelelő) listában választod ki. |
| **Metaadat** | A JetEngine eszközeivel létrehozott metamezők értékét adja. A mezőt a listából választod ki, vagy a nevét (ismétlő mezőnél a kulcsát) beírhatod az **OBJECT FIELD / META FIELD / REPEATER KEY / COMPONENT PROP / API PROPERTY PATH** mezőbe. |
| **Lekérdezési változó** | A kérésben szereplő változó értékét írja ki. A **Variable Name** (változó neve) mezőbe írd be a nevét. Így jeleníthetsz meg adatot például a keresési találatok oldalán (a változó neve ilyenkor „s”), vagy egy köszönőoldalon az elküldött űrlap mezőit (lásd: [Beküldött adatok a köszönőoldalon](https://hub.hellowp.io/hu/plugins/jet-engine/dinamikus-tartalom-koszonooldal/)). |
| **Beállítások** | A beállítóoldalakon (Options page) létrehozott mezők értékét adja. |
| **Kapcsolatok hierarchiája** | A jelenlegihez kapcsolódó bejegyzések mezőiből veszi az adatot. Kiválasztod, hogy milyen kapcsolt elemeket kérsz, és milyen bejegyzéstípusból. |
| **Relation Meta Data** | A kapcsolatokhoz létrehozott metamezők értékét adja. |
| **API Data** | Az **Async Listing** modul bekapcsolása után jelenik meg. A JSON-válaszból veszi az értékeket, így csökkenthető a kiszolgálói oldali megjelenítés. |

A blokk **FORRÁS** listájában a helyi telepítésen ezek szerepeltek: „Bejegyzés/kifejezés/felhasználó/objektum adatai”, „Metaadat”, „Lekérdezési változó”, „Beállítások”, „Kapcsolatok hierarchiája”, „API Data”.

## Elrendezés

| Beállítás | Mit csinál |
|---|---|
| **EXPECTED DISPLAY (INLINE/MULTILINE)** | **Inline**: a szöveg egy sorban jelenik meg. **Multiline**: több sorban. |
| **Field Icon/Image** | Ikon vagy kép a mező elé. A **Select Image** gomb megnyitja a médiatárat, ahová SVG-t vagy képet is feltölthetsz. |
| **FIELD TAG** | Az HTML-címke, amibe a mező kerül: **DIV** (konténer), **H1** és **H6** között bármelyik (címsor), **P** (bekezdés) vagy **SPAN** (sorközi elem). |
| **Hide if value is empty** | Elrejti a mezőt, ha nincs benne érték. |
| **FALLBACK** | Az a szöveg, amelyet üres mező helyett mutat a rendszer. |
| **Filter field output** | A kimenet átalakítása egy kiválasztott callbackkel (lásd lent). |
| **Customize field output** | Szöveg az érték elé és mögé. A `%s` helyére kerül a lekért érték. Ha ugyanazt az értéket többször akarod beszúrni, használd a `%1$s` jelölést. Makrókat is írhatsz bele. |
| **CONTEXT** | Melyik objektum adatait olvassa a mező (lásd lent). |

## A kontextus (CONTEXT)

A kontextus a **FORRÁS**-sal együtt határozza meg, honnan jön az érték. A listában a következők szerepelnek:

| Kontextus | Mit ad |
|---|---|
| **Alapértelmezett objektum** | Az aktuális oldal vagy listázási elem adatait. |
| **Aktuális felhasználó (globális)** | Annak a felhasználónak az adatait, akinek az oldalt létrehozták. |
| **Aktuális felhasználó (aktuális hatókör)** | A listában éppen feldolgozott felhasználó adatait. Ha például egy felhasználólista elemeire kattintva a szerzők bejegyzéseit látod, ez a rákattintott felhasználó mezőjét adja, nem a belépettét. |
| **Lekérdezett felhasználó** | A belépett felhasználó adatait, vagy annak a felhasználónak az adatait, akinek az azonosítója az URL-ben szerepel. |
| **Aktuális bejegyzés szerzője** | A megnyitott bejegyzés szerzőjének mezőit. |
| **Alapértelmezett WordPress-objektum (az aktuális oldalhoz)** | Mindig a WordPress által az oldalhoz rendelt globális objektumot. Egyedi oldalon ez mindig az aktuális bejegyzés, akkor is, ha egy ide beillesztett listázás belsejében vagy. |
| **Szülő objektum** | A szülő objektum adatait. |
| **Aktuális CCT tétel szerzője** | A megnyitott egyedi tartalomtípus-tétel szerzőjének mezőjét. A CCT listázási sablonjában használható a tétel szerzőjének megjelenítésére. |
| **Kapcsolódó elemek innen …** | Az adott kapcsolat kapcsolódó elemeinek adatait. A helyi telepítésben például a „Kapcsolódó elemek innen Országok és túrák” sor jelenik meg. |

## A kimenet szűrése (Filter field output)

Egyes mezők nyers értéke nem alkalmas közvetlen megjelenítésre. Egy jelölőnégyzet-mező például értéktömböt ad, egy képmező képazonosítót, egy dátum időbélyeget. A **Filter field output** kapcsoló bekapcsolása után a **CALLBACK** listából választasz átalakítót.

![A Filter field output kapcsoló bekapcsolva, alatta a Callback lista](./kepek/dinamikus-tartalom-1-mezo-szuro.webp)

*A Filter field output kapcsoló bekapcsolva, alatta a Callback lista* (https://minta-bolt.hu/wp-admin/post.php?post=22&action=edit)

A képen a kapcsoló be van kapcsolva, alatta a **CALLBACK** lista látszik, még „--” (nincs szűrő) értékkel. Egyes callbackek további beállításokat nyitnak meg.

A helyi telepítésen a lista így néz ki: Dátum formázása, Dátum formázása (régi), Dátum formázása lokalizáltan. Régi, Szám formázása, URL-séma hozzáadása, Bejegyzés/oldal címének lekérése, Bejegyzés/oldal URL-jének lekérése, Bejegyzés/oldal hivatkozásának lekérése, Bejegyzés/oldal bélyegképének lekérése, Kifejezés nevének lekérése, Kifejezés URL-jének lekérése, Kifejezés hivatkozásának lekérése, Beágyazási URL, Kattinthatóvá tétel, Ikon beágyazása az Iconpickerből, Többválasztásos mező értékei, Jelölőnégyzetes mező értékei, Get option label, Bejelölt értékek listája, Kapcsolómező értékei, ACF-jelölőnégyzetes mező értékei, Bejegyzéscímek lekérése ID-k alapján, Kapcsolódó bejegyzések listája, Kapcsolódó elemek listája, Mezőértékek darabszáma, Kép lekérése ID alapján, Shortcode-ok futtatása, Emberek számára olvasható időeltérés, Bekezdéscímkék hozzáadása (wpautop), Nullákkal való feltöltés, Gyermekelem lekérése objektumból/tömbből, Feliratok lekérése a glosszárium adatai alapján, Arányos, QR-kód, Felhasználói adatok lekérése ID alapján, Haladó dátum: következő dátum lekérése, Haladó dátum: következő befejezési dátum lekérése. Az alábbiakban témánként írjuk le őket.

### Dátum, idő és dátum-idő mezők

- **Dátum formázása**: a dátum-, idő- és dátum-idő mezők adatbázisban tárolt értékét a megadott formátumban írja ki. A formátumot a **Format** mezőben adod meg.
- **Dátum formázása lokalizáltan**: ugyanez, de a dátum a webhely nyelvére lefordítva jelenik meg.
- **Emberek számára olvasható időeltérés**: a dátum és a mai nap közötti különbséget adja napokban. Az **Additional meta key** mezőbe egy másik metamező nevét is beírhatod, ekkor a két dátum közötti különbséget számolja. Így például megjelenítheted a kezdő és a záró dátum közötti napok számát.

### Bejegyzések, kifejezések, címek, hivatkozások

- **Bejegyzés/oldal címének lekérése**: ha az **Object Field** listában a „Bejegyzés ID” van kiválasztva, a bejegyzés vagy oldal címét írja ki.
- **Bejegyzés/oldal URL-jének lekérése**: valamelyik azonosító típusú objektummezőnél a bejegyzés URL-jét adja.
- **Bejegyzés/oldal hivatkozásának lekérése**: a címet kattintható hivatkozásként adja.
- **Bejegyzés/oldal bélyegképének lekérése**: a „Bejegyzés ID” mezőnél a kiemelt képet jeleníti meg. Beállíthatod a képméretet, és az **Add permalink** kapcsolóval a képre kattintva a bejegyzésre jutsz.
- **Kifejezés nevének lekérése**: a „Kifejezés ID” mezőből a kifejezés nevét adja.
- **Kifejezés URL-jének lekérése**: a kifejezés webcímét adja.
- **Kifejezés hivatkozásának lekérése**: a kifejezés nevét hivatkozásként adja. Csak kifejezés- vagy taxonómiaazonosító mezőnél használható.
- **URL-séma hozzáadása**: URL-séma (például e-mailküldéshez, `mailto:`) hozzáadása. A sémát az **URL scheme** listából választod.
- **Beágyazási URL**: az URL-t tartalmazó mező értékét beágyazza az oldalra, például egy YouTube-videót. Ha a videó konténerének magasságát módosítani akarod, jelenítsd meg HTML-kóddal.
- **Kattinthatóvá tétel**: az URL-t tartalmazó mezőt kattintható hivatkozássá alakítja, alapból ugyanis sima szövegként látszik.

### Számok

- **Szám formázása**: a szám mező megjelenését állítod be: a tizedesjelet, az ezreselválasztót és a tizedesjegyek számát.
- **Nullákkal való feltöltés**: kezdő nullákat ad a számhoz. A **Threshold** mezőben azt a számjegyszámot adod meg, ameddig a számot nullákkal kell kiegészíteni. Ha a küszöb 5, egy kétjegyű szám elé három nulla kerül, egy négyjegyű elé egy.
- **Arányos**: a mező értékét elosztja az **Osztó** (Divisor) mezőben megadott számmal és megszorozza a **Szorzó** (Multiplier) mezőben megadottal. A **Result precision** mezőben a tizedesjegyek számát adod meg. Az osztó és a szorzó mellett a **Dinamikus címkék** gombbal egy számértékű JetEngine-mezőt is választhatsz.
- **Számolt mező** (Calculated): a mező értékével elvégzett számtani műveletek. Ehhez külön kiegészítő kell, lásd: [Számolt visszahívás](https://hub.hellowp.io/hu/plugins/jet-engine/meta-mezok-szamolt-visszahivas/).
- **Telefonszám formázása**: telefonszám vagy bankkártyaszám maszkolása szám-, szöveg- vagy szövegdoboz-mezőből. Külön kiegészítő bővítményként telepíthető.

### Választólista, rádiógomb, jelölőnégyzet

- **Többválasztásos mező értékei**: a választólista több kiválasztott értékét írja ki. Add meg az elválasztót (**Delimiter**). Több érték választásához a mező beállításában (**JetEngine → Bejegyzéstípusok**, szerkesztés) kapcsold be a **Multiple** kapcsolót.
- **Jelölőnégyzetes mező értékei**: a kijelölt értékeket egy sorban, az elválasztóval tagolva adja.
- **Bejelölt értékek listája**: a kijelölt értékeket listaként jeleníti meg. Megadhatod a szójegyzéket (ha a mezőhöz van), az oszlopok számát, és bekapcsolhatod az elemek közötti elválasztóvonalat is (**Add divider between items**, **Divider color**).
- **ACF-jelölőnégyzetes mező értékei**: az ACF-fel létrehozott jelölőnégyzet-mezők kijelölt értékeit adja.
- **Gyermekelem lekérése objektumból/tömbből**: jelölőnégyzet- vagy választómezőnél azt adja vissza, hogy a megadott elem ki van-e választva. Ha a jelölőnégyzet „2” opcióját bejelölted, és a callbackben is a „2”-t adtad meg, az eredmény „true”.
- **Feliratok lekérése a glosszárium adatai alapján**: a rádió-, választó- és jelölőnégyzet-mezők értéke helyett a szójegyzék feliratát írja ki. A használni kívánt szójegyzéket külön mezőben választod ki.
- **Kapcsolómező értékei**: a kapcsoló (Switcher) mezőtípus értékét jeleníti meg.

### Média és galéria

- **Kép lekérése ID alapján**: a médiamező képazonosítója helyett magát a képet mutatja. A képméretet is kiválaszthatod.
- **Csatolmányfájlra mutató link ID alapján**: PDF, ZIP és más fájlok letöltési hivatkozását adja a média mezőből. Csak akkor szerepel a listában, ha a **Csatolmányfájlra mutató link ID alapján** külső modult bekapcsoltad (**JetEngine → Modulok → Külső modulok**). A megjelenített nevet a **Display name** listából választod: „File name” (fájlnév), „Attachment post title” (a csatolmány címe), „Current post title” (az aktuális bejegyzés címe), „Parent post title” (a szülő bejegyzés címe; ehhez a bejegyzéstípus beállításaiban be kell kapcsolni a **Hierarchical** kapcsolót, és a szülő bejegyzést a gyorsszerkesztésben kell megadni) vagy „Custom” (egyedi felirat).
- **Rácsos galéria** és **Diavetítéses galéria** callback: a galéria mező képeit rácsban vagy csúszkában jeleníti meg. Csak akkor szerepel a listában, ha a **Rácsos galéria a Dynamic Field widgethez** vagy a **Diavetítéses galéria a Dynamic Field widgethez** modult bekapcsoltad (**JetEngine → Modulok**, alapértelmezett modulok). Beállíthatod az oszlopok számát, a képméretet, és a **Use lightbox** kapcsolóval a teljes képernyős megtekintést.
- **Ikon beágyazása az Iconpickerből**: az ikonválasztó mezőnél az ikon azonosítója helyett magát az ikont mutatja.

### Szövegek

- **Bekezdéscímkék hozzáadása (wpautop)**: a szövegdoboz mező szövegét bekezdésekre tördeli.
- **Trim string by charts or words** (szöveg rövidítése): a mezők, beállítások stb. szövegét a megadott hosszúságra vágja. Csak a **Trim String visszahívás** külső modul bekapcsolása után szerepel a listában.
- **Shortcode-ok futtatása**: a mezőbe írt rövidkódot lefuttatja, ahelyett hogy szövegként kiírná.
- **QR-kód**: a mező értékét QR-kóddá alakítja, a kód mérete beállítható. Csak a **QR-kód a Dynamic Field widgethez** modul bekapcsolása után szerepel.
- **Listing’s counter** (listaszámláló): a listázási elemek sorszámozására. Külön kiegészítőként telepíthető, és egyedi lekérdezést igényel. Lásd: [Listaszámláló kiegészítő](https://hub.hellowp.io/hu/plugins/jet-engine/listazas-szamlalo-kiegeszito/).

### Bejegyzések (Posts) mező, kapcsolatok

- **Bejegyzéscímek lekérése ID-k alapján**: a bejegyzések mezőben kiválasztott bejegyzések címét írja ki az azonosítók helyett.
- **Kapcsolódó bejegyzések listája**: ugyanez listaként, nem egy sorban. A **Single value** kapcsolóval csak az első kapcsolódó bejegyzést mutatja. Hivatkozásokat is hozzáadhatsz (**Add links to related posts**), és megadhatod a lista HTML-címkéjét: **UL** (pontozott lista), **OL** (számozott lista) vagy **DIV** (egy sor). Az elválasztót is megadhatod.
- **Mezőértékek darabszáma**: a bejegyzések mezőben kiválasztott elemek számát adja.
- **Kapcsolódó elemek listája**: a kapcsolódó elemek (bejegyzések, kifejezések, CCT-elemek, felhasználók) listáját adja. Használatához a **FORRÁS** listában a „Bejegyzés/kifejezés/felhasználó/objektum adatai” értéket válaszd, az **Object Field** listában pedig a „Kapcsolódó elemek az aktuális objektumhoz” oszlop egyik elemét. A **Single value**, az **Add links to related posts** és a lista HTML-címkéje itt is beállítható.

## Stílus

A Dynamic Field megjelenését a blokkszerkesztőben a **Blokkstílus** gombbal megnyíló részben, Elementorban a **Stílus** fülön állítod be. A blokkok stílusfülei a **JetStyleManager** bővítmény megléte esetén érhetők el.

## Gyakori kérdések

**Miért nem jelenik meg adat?** Ellenőrizd, hogy a kiválasztott forrás tartalmaz-e értéket az aktuális objektumnál, és hogy a **CONTEXT** a megfelelő objektumot adja-e. Ha az érték nyers formában (számként, tömbként) jelenik meg, kapcsold be a **Filter field output** kapcsolót, és válassz a mezőtípushoz illő callbacket.