# Dinamikus tartalomcímke a blokkszerkesztőben

> A Dynamic Content Tag használata a Bekezdés, Címsor, Gombok és Borító blokkokon: adatforrás, adatkörnyezet, dinamikus függvény és kimenetszűrő, listázási sablon blokkokból.

A tartalom kitöltése egyszerűbb, ha az adatok automatikusan érkeznek, és nem kell kézzel feltölteni őket. A blokkszerkesztőben (Gutenberg) erre a JetEngine **Dynamic Content Tag** funkciója való. Segítségével egy meglévő, statikus blokk egyes argumentumaihoz dinamikus értéket rendelhetsz.

A funkció jelenleg a következő WordPress-blokkokkal használható: **Bekezdés** (Paragraph), **Címsor** (Heading), **Gombok** (Buttons) és **Borító** (Cover). A blokkszerkesztővel és a Dinamikus tartalomcímkékkel a szükségleteidnek megfelelő listázásokat készíthetsz.

Követelmény: a blokkszerkesztő, valamint az aktív JetEngine.

## A listázási sablon létrehozása

A példa egy bejegyzéslistázást készít a címkékkel.

1. Nyisd meg a **JetEngine → Listázások/komponensek** oldalt, és kattints az **Új hozzáadása** gombra.
2. Töltsd ki a mezőket:
   - **Listing source** (listázás forrása): a hozzáadott listázás forrása;
   - **From post type**: a bejegyzéstípus, amelyből a tartalmat veszi. Nem csak az alap bejegyzések, hanem egyedi bejegyzéstípusok is lehetnek;
   - **Listing item name**: a listázás neve;
   - **Listing view**: állítsd **Blocks (Gutenberg)** értékre, hogy a blokkok által támogatott Dinamikus tartalomcímkékkel dolgozhass.
3. Kattints a **Create Listing Item** gombra.

## Borító blokk

Add hozzá a **Borító** blokkot a szerkesztőhöz. Fölötte megjelenik a **Dynamic Content Tag** gomb. Kattints rá: az **Image URL** és az **Image Alt** opciók szabhatók testre.

### Image URL

Az **Image URL** első füle a **Data Source**, amelyben az **Image Source** lista is megvan. Válaszd ki a szükséges forrást.

A **Data Context** fül azt az objektumot választja ki, amelyből a dinamikus adat jön:

| Érték | Jelentése |
|---|---|
| **Current User (global)** | Az a felhasználó, akinek az oldalt létrehozták. |
| **Current User (for current scope)** | Az éppen feldolgozott felhasználó. |
| **Queried User** | A bejelentkezett felhasználó, vagy akinek az azonosítója az URL-ben szerepel. |
| **Current Post Author** | A megnyitott bejegyzés szerzője. |

A **Data Context** fül minden szóba jövő blokknál elérhető, a lehetőségek ugyanezek.

### Image Alt

Az **Image Alt** első füle is a **Data Source**, de itt más lehetőségek vannak:

- **Current object property**: az aktuális objektumhoz kapcsolódó adatot mutat. A **Property** listában az alap bejegyzés-, kifejezés- és felhasználóadatok közül választhatsz, valamint további forrásokból, például a WooCommerce attribútumaiból, ha boltot építesz.
- **Custom data**: a megadott opciók által hívott adatot jeleníti meg. A **Select data to show** listában szereplő lehetőségeket a [Makrók útmutatója](https://hub.hellowp.io/hu/plugins/jet-engine/dinamikus-tartalom-makrok/) írja le.
- **Dynamic function**: egy meghatározott függvény alapján számított értéket mutat.

A **Dynamic function** forrásnál a **Function** lista elemei:

| Függvény | Mit számol |
|---|---|
| **Summed value** | A megadott metamezők értékeinek összege. |
| **Average value** | Az összes beírt érték átlaga. |
| **Count** | Hány bejegyzésnek, kifejezésnek vagy felhasználónak van kitöltve a mezője. |
| **Maximum value** | A legnagyobb érték. |
| **Minimum value** | A legkisebb érték. |
| **SQL query results** | SQL-lekérdezéssel dolgozik, és az adatát mutatja. |

A következő lista a **Data Source**, ahol a **Post**, **Term** és **User Meta** közül választhatsz. A **Post Meta** választásánál megjelenik a **Field Name** mező: ide a metamező kulcsát írd, amelyet a mező létrehozásakor adtál meg.

A **Data Context** lista:

| Érték | Jelentése |
|---|---|
| **All posts** | Az adat az összes bejegyzésből jön. |
| **Posts from current term** | Csak a megadott taxonómia bejegyzéseiből. |
| **Posts by current user** | A metamező értékei az aktuális felhasználó bejegyzéseiből. |
| **Posts by queried user** | A lekérdezett felhasználó bejegyzéseiből. |
| **Related posts for current post** | A beállított kapcsolat kapcsolt bejegyzéseiből; a **Relation** lista a választás után jelenik meg. |

Ezután jönnek a **Query by posts with status** (a lekérdezhető bejegyzésállapotok) és a **Query by posts with types** (a webhely bejegyzéstípusai, köztük az egyedi bejegyzéstípusok és más bővítmények típusai) listák.

A következő mezők nem látszanak, ha a **Function** listában a **Count** értéket választottad:

- **Decimals Point**: a tizedesjel;
- **Thousands separator**: az ezreselválasztó;
- **Decimals Count**: a tizedesjegyek száma.

### Data Filter

A **Data Filter** fül tovább szűri a dinamikus adatot. Kapcsold be a **Filter output** kapcsolót, ha szükséges. Ekkor megjelenik a **Callback** lista, amely a **Dynamic Field** widget kimenetszűrőihez hasonló: többféle opció közül választhatsz. A leírásukat a [Dynamic Field](https://hub.hellowp.io/hu/plugins/jet-engine/dinamikus-tartalom-dinamikus-mezo/) fejezetben találod.

## Címsor blokk

A **Címsor** blokk hozzáadása után kattints a **Dynamic Content Field** gombra, és válaszd ki az egyetlen **Content** fület. A testreszabható beállítások ugyanazok, mint a Borító blokkoknál.

**Fontos:** ha a szerkesztőben a kiválasztott értékek helyett `%%content%%` szöveget látsz, az rendben van. Ez azért van így, hogy a szerkesztőfelületet ne terhelje le a sok kérés. Az adat a frontenden jelenik meg.

## Bekezdés blokk

A **Bekezdés** blokk **Dynamic Content Field** beállításai ugyanolyanok, mint a Címsor blokké. Hozd létre a szükséges mezőket, és válaszd ki az értékeket. Egyedi bejegyzéstípus listázásánál ide a **JetEngine meta field** opció való, de azt jelenítheted meg, amit szeretnél.

Ha statikus információt is hozzá akarsz adni a blokkhoz, a szöveget a `%%content%%` érték elé vagy mögé írd.

## Gombok blokk

A **Gombok** blokknál a **Dynamic Content Tag** ikonra kattintva két fület látsz: **Text** és **URL**. A szerkesztési lehetőségeik megegyeznek a szöveggel megjeleníthető más értékekével. Itt is írhatsz extra szöveget a dinamikus értékek elé vagy mögé.

Miután az összes blokkot beállítottad, kattints a **Publish** gombra.

## Az eredmény ellenőrzése

A létrehozott listázást megjelenítheted egy a blokkszerkesztővel szerkesztett oldalon:

1. Nyisd meg a **Oldalak → Új oldal** menüpontot.
2. Add hozzá a **Listing Grid** blokkot, és válaszd ki az imént létrehozott listázást.
3. Tedd közzé az oldalt, és nézd meg a frontenden.

A dinamikus adatok megjelennek az oldalon.