# Jelvény a profil kitöltöttsége szerint

> Figyelmeztető jelvények a felhasználó fiókoldalán aszerint, hogy minden szükséges profilmező ki van-e töltve, a Custom Visibility Conditions kiegészítővel.

Ez a példa azt mutatja meg a felhasználónak, mennyire teljes a profilja: a profilmezők kitöltöttségétől függően sikeres vagy hibát jelző jelvény látszik.

Előfeltételek:

- Elementor (az ingyenes változat elég);
- aktív JetEngine, beállított felhasználói profiloldallal (a fiókoldalhoz sablon van rendelve) és létrehozott felhasználói metaboxszal, mezőkkel;
- a **Custom Visibility Conditions** kiegészítő telepítve és aktiválva;
- JetFormBuilder, benne olyan űrlappal, amellyel a felhasználó adatot adhat a profiljához.

## A kiegészítő telepítése

1. Töltsd le a **Custom Visibility Conditions** kiegészítőt a Crocoblock DevTools oldalról a **Download** gombbal.
2. A **Bővítmények → Új bővítmény hozzáadása** oldalon kattints a **Bővítmény feltöltése** gombra, válaszd ki a letöltött fájlt, és kattints a **Telepítés most** gombra.
3. Kapcsold be a kiegészítőt.

## A dinamikus láthatóság bekapcsolása

A **JetEngine → JetEngine → Modulok** fülön győződj meg arról, hogy a **Dinamikus láthatóság** modul be van kapcsolva. A példában a **Profilkészítő** modul is aktív. Kattints a **Mentés** gombra.

## A fiókoldal sablonjának szerkesztése

1. Nyisd meg azt az Elementor-sablont (**Sablonok → Mentett sablonok**), amelyet a Profile Builder beállításainál a fiókoldalhoz rendeltél.
2. Add hozzá a JetFormBuilder widgetet, amely a felhasználó szerkesztésére szolgáló űrlapot mutatja.
3. Keress olyan widgetet, amely támogatja a **Dynamic Visibility** funkciót. A példában az **Alert** widgetet használjuk. Húzd az oldal kívánt helyére.

### A siker-jelvény

1. Az **Alert** widget **Content** fülén a **Type** értéke legyen **Success**, a **Title** és a **Description** mezőt írd át a megfelelő szövegre. Add meg, hogy a **Dismiss Icon** látszik-e, és válaszd ki az ikont, ha megtartod.
2. A **Haladó** fülön nyisd meg a **Dynamic Visibility** szakaszt, és kapcsold be az **Enable** kapcsolót.
3. A láthatósági feltétel típusa legyen **Show element if condition met**.
4. Az első listában válaszd a **User has required fields** feltételt, és a **Fields list** mezőbe írd be a szükséges metamezők kulcsait.
5. A **User context** maradjon az alapértelmezett **Current user**.

### A hibajelvény

1. Adj hozzá még egy **Alert** widgetet az előző alá, amely akkor jelenik meg, ha a felhasználó nem töltött ki minden mezőt. A **Type** értéke legyen **Danger** (világospiros jelvény). Módosítsd a **Title** és **Description** szövegét, szükség szerint a **Dismiss Icon** és az **Icon** mezőt is.
2. A **Dynamic Visibility** szakaszban ismételd meg ugyanezeket a lépéseket, de a feltétel típusa most **Hide element if condition met** legyen.
3. Kattints a **Frissítés** gombra.

## Az eredmény

Nyisd meg a fiókoldalt a frontenden. Ha minden szükséges mező ki van töltve, a sikert jelző jelvény látszik. Ha törlöd például a profilképet, a hibajelvény jelenik meg helyette.