# FluentCart-modulok a Divihez

> A FluentCart Divi Modules kiegészítő telepítése, a modulok listája, a boltoldal építése, a sablonkönyvtár és a termékadatok dinamikus tartalomként.

A FluentCart Divi Modules kiegészítő a FluentCart építőelemeit a Divi szerkesztőbe hozza. Minden áruházrészhez külön modult kapsz, a termékrácstól és a körhintától a kosárig, a pénztárig és a vásárlói fiókig. Húzd be a kívánt részeket, a megszokott Divi-vezérlőkkel adj nekik stílust, és építsd fel az áruházad oldalait.

## Mi kell hozzá

1. A Divi 5.0 vagy újabb telepítve és aktív legyen a webhelyen. Ezek natív Divi 5-modulok, ezért csak a Divi 5 szerkesztőjében jelennek meg.
2. A FluentCart 1.3.4 vagy újabb legyen telepítve, és a FluentCart Pro licenced legyen ellenőrizve. Ennek menetét a [Licencelés](https://hub.hellowp.io/hu/plugins/fluent-cart-pro/licenceles/) fejezet írja le.

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

A modulok külön kiegészítőként érkeznek, ezért egyszer telepítened kell a FluentCart beállításaiból, mielőtt megjelennek a Diviben.

1. A WordPress vezérlőpultján nyisd meg a **FluentCart Pro → Beállítások → Funkciók és kiegészítők** oldalt.
2. Görgess a **Bővítmény-kiegészítők** részhez.
3. Keresd meg a **FluentCart Divi Modules** kártyát.
4. Kattints a kártyán a **Telepítés és aktiválás** gombra.

A FluentCart letölti, telepíti és aktiválja a kiegészítőt, feltöltés vagy kézi letöltés nem kell. Amikor kész, a kártya állapotjelzése **Active** lesz.

![A Funkciók és kiegészítők oldal Bővítmény-kiegészítők része a FluentCart Divi Modules kártyával](./kepek/beallitasok-funkciok.webp)

*A Funkciók és kiegészítők oldal Bővítmény-kiegészítők része a FluentCart Divi Modules kártyával* (https://minta-bolt.hu/wp-admin/admin.php?page=fluent-cart)

A kártyán a **Telepítés és aktiválás** gomb látszik. Ha szürke, vagy licencfelszólítás van helyette, a FluentCart Pro licenced nincs ellenőrizve vagy lejárt: a **Beállítások → Licencbeállítások** oldalon ellenőrizd, és a telepítő újra elérhető lesz. A telepítőről a [Funkciók és kiegészítők](https://hub.hellowp.io/hu/plugins/fluent-cart-pro/beallitasok-funkciok/) fejezetben olvashatsz.

## A modulok megkeresése a Diviben

1. Nyiss meg egy oldalt vagy Theme Builder-sablont a Divi szerkesztővel.
2. Kattints a plusz ikonra (+) az **Insert Module Or Row** ablak megnyitásához, és maradj a **New Module** fülön.
3. Írd a keresőmezőbe: `fluent`, így a lista a FluentCart-modulokra szűkül.
4. Kattints egy modulra, hogy az elrendezésbe kerüljön, majd a jobb oldali **Content**, **Design** és **Advanced** fülön adj neki stílust.

Minden modul neve **FluentCart** előtagot kap, így a Divi beépített moduljaitól első pillantásra megkülönböztethető.

## A modulok

A modulok csoportjai a funkciójuk szerint következnek.

### Böngészés és keresés

- **FluentCart Products:** termékrács, a legegyszerűbb mód a boltoldal építésére. Ez a fő modul, részletei lent, a boltoldal építésénél.
- **FluentCart Product Carousel:** a termékek csúszó körhintában, „Kiemelt” vagy „Újdonságok” sávnak jó nyitóoldalon.
- **FluentCart Product Categories List:** a termékkategóriák listája, hogy a vásárlók közvetlenül a kívánt részhez ugorhassanak.
- **FluentCart Related Products:** a megtekintett termékhez kapcsolódó termékek, jó ötlet egy második vásárlásra egytermékes elrendezésben.
- **FluentCart Product Search:** a termékekre szűkített keresőmező.
- **FluentCart Media Carousel:** termékmédia körhintája, gazdag képi tartalomhoz.
- **FluentCart Archive Header:** archívumoldalon a lekérdezett kategória vagy márka nevét és leírását mutatja, ahogy a FluentCart saját archívumoldalai. Párosítsd a **FluentCart Products** modullal egy Theme Builder-archívumelrendezésben: a termékmodul magától ugyanarra a kategóriára vagy márkára szűkül.

### Termékrészletek

Egy termék egyes részeit jelenítik meg, így egyéni termékelrendezés építőkövei:

- **FluentCart Product Card:** teljes termékösszegzés egyéni rácsokhoz és kiemelt szakaszokhoz.
- **FluentCart Product Info:** több termékadat egy modulban, például a galéria, a cím, az ár és a vásárlási vezérlők.

### Értékesítés és pénztár

Ezek a modulok viszik a pénzt:

- **FluentCart Add to Cart:** bárhová tehető kosárba gomb, egyéni felirattal.
- **FluentCart Buy Now:** a vevőt a kosarat kihagyva a pénztárhoz viszi.
- **FluentCart Mini Cart:** kompakt kosárösszegzés, fejlécbe vagy ragadós sávba való.
- **FluentCart Cart:** a teljes kosároldal tételsorokkal, mennyiséglépegetőkkel, összegekkel és a pénztár gombjával; a kosár élményét a Diviben tervezheted meg.
- **FluentCart Checkout Page:** a teljes pénztárűrlap; a pénztár élményét a Diviben tervezheted meg. A **Field Labels** azt szabályozza, hogyan mutatják a mezők a nevüket, miután a vevő beírt valamit: **Docked** (a név jobbra), **Floating** (a név az érték felett) vagy **Placeholder only**, mint a Gutenberg pénztárblokkban.

A FluentCart Próval a **Checkout Source** értékét **Custom Product** állapotra állítva a vevők az általad kiválasztott termékek közül választhatnak közvetlenül a pénztáron. Add hozzá a felkínálandó termékeket, majd a **Selection Mode** értéke legyen **Select one** (rádiógombok) vagy **Select many** (jelölőnégyzetek).

**Select many** esetén a **Maximum Selectable Items** korlátozza az egyszerre kijelölhetők számát, a **Selector Heading** a lista feletti címet adja. Ha a FluentCart Prót kikapcsolod, a Custom Product pénztár semmit nem mutat az oldalon, amíg újra be nem kapcsolod; a beállításaid megmaradnak.

- **FluentCart Receipt:** a vásárlás utáni „köszönöm” oldal, amelyre a vevő a fizetés után érkezik, a rendelés adataival.

### Áruház és fiók

- **FluentCart Store Logo:** az áruház logója, opcionálisan a nyitóoldalra hivatkozva.
- **FluentCart Customer Dashboard:** a teljes vásárlói fiók, ahol a vevők a rendeléseiket, előfizetéseiket és letöltéseiket kezelik.
- **FluentCart Customer Dashboard Button:** hivatkozás a vásárlói fiókba, fejlécbe vagy menübe.
- **FluentCart Currency Switcher:** gomb, amellyel a vevők pénznemet válthatnak. A FluentCart Pro és a bekapcsolt többvalutás értékesítés kell hozzá. A **Switcher Settings** és a **Dropdown List** leírását a [Többvalutás értékesítés](https://hub.hellowp.io/hu/plugins/fluent-cart-pro/tobbvaluta/) fejezetben találod.

### Termékértékelések

A kiegészítő hat modult ad az értékelések megjelenítéséhez és gyűjtéséhez: **FluentCart Product Reviews**, **FluentCart Review List**, **FluentCart Rating Summary with Review**, **FluentCart Review Form**, **FluentCart Write a Review** és **FluentCart Product Rating**. Mindegyiket az [Értékelési elemek](https://hub.hellowp.io/hu/plugins/fluent-cart-pro/testreszabas-ertekeles-elemek/) fejezet írja le, a **FluentCart Products** kártyákon megjelenő csillagos értékeléssel együtt.

## A boltoldal építése

A katalógus megjelenítésének legegyszerűbb módja a **FluentCart Products** modul. Add egy sorhoz, majd a **Content** fülön szabályozd, mit és hogyan mutasson. A Divi vászna élő előnézetet ad; a szűrők, a rendezés és a lapozás a közzétett oldalon működik.

A **Content** fül beállításai szakaszokra oszlanak:

- **Paginator**
  - **View:** a hosszú listákon való navigáció. A **Scroll** görgetéskor tölt be további termékeket, a **Numbers** klasszikus számozott lapozást ad.
  - **Per Page/Scroll:** hány termék töltődik be egyszerre (például 10).
- **Product Grid Option**
  - **View Mode:** az alapelrendezés: a **Grid** képcentrikus kártyaelrendezés, a **List** tágasabb, egyoszlopos.
  - **Price Format:** egyetlen **Starts From** ár, vagy alsó és felső ár közti **Range** a változatos termékeknél.
  - **Product Per Row:** hány termék áll egymás mellett rácsnézetben (például 4).
  - **Sort By:** az alapértelmezett sorrend, például **Newest first**.
- **Filter Option**
  - **Enable Filter:** vásárlói szűrő oldalsávot kapcsol be, amellyel a vevők maguk szűkíthetik a kínálatot, külön oldal nélkül minden kategóriához vagy árfokhoz.
- **Default Filter**
  - **Enable Filtering:** előre beállított szűrőt alkalmaz a modulra, hogy mindig a kínálat egy meghatározott szeletét mutassa; „Sikerlista” vagy „Akciós” szakaszhoz jó.
- **Badges:** az egyes termékkártyákon látható akciós és állapotjelvények.
- **Link:** a **Module Link URL** megadásával a modul egy választott címre hivatkozik.

A **Content** füllön kívül a **Design** és az **Advanced** fül a Divi teljes stílusvezérlését adja a térközökhöz, betűtípusokhoz, keretekhez és reszponzív viselkedéshez, így a rács illeszkedik az oldalad többi részéhez.

A Divi vászna a termékek előnézetét rajzolja. Az interaktív működés (szűrés, rendezés, lapozás) a nyilvános oldalon fut, nem a szerkesztőben, ezért mindig a nyilvános oldalon nézd meg.

## Használat Theme Builder-sablonokban

Az egytermékes modulok (például a **FluentCart Product Info** és a **FluentCart Product Card**) a Divi Theme Builderében érvényesülnek igazán. Az elrendezést egyszer építed meg egy sablonban, és minden modul a megtekintett termékből veszi a tartalmát, így minden termékoldal ugyanazt a tervet követi, termékenkénti újraépítés nélkül.

## A beépített sablonkönyvtár

A kiegészítő nyolc kész oldalelrendezést tesz a Divi saját könyvtárába, hogy kész tervből indulhass.

1. Nyisd meg a Divi szerkesztőben a **Load From Library** ablakot.
2. Váltsd át a **Your Saved Layouts** fülre.
3. A **My Library** alatt a **FluentCart** előtagú elrendezések láthatók, például a Single Product vagy a Checkout elrendezés.
4. Kattints egy elrendezésre, hogy az oldaladra töltődjön.

A kész elrendezések: Single Product, Shop, Product Category, Cart, Checkout, Thank You (a nyugtaoldal), Customer Dashboard és Campaign Landing. Mindegyik a fenti FluentCart-modulokból épül, így változtatás nélkül is használhatod, vagy kiindulópontnak, a saját szakaszaiddal.

Minden elrendezés megfelelő kategóriába is be van sorolva, így a bal oldali **Categories** jelölőnégyzetekkel szűkítheted a listát: Account, Campaign, Cart, Category, Checkout, Product, Receipt és Shop.

## Termékadat bármely szövegmezőbe

A dedikált modulokon túl a kiegészítő a FluentCart termékadatait a Divi 5 saját **Dynamic Content** választójába is bekapcsolja, ez a szöveges mezők melletti kis ikon. Így a termék címét, árát vagy leírását sima **Heading**, **Text**, **Blurb**, **Button** vagy **Image** modulba is behúzhatod, nem csak a FluentCart-modulokba.

1. Nyisd meg a mezőt egy olyan Divi-modulon, amely támogatja a Dynamic Contentet (az ikon a mező mellett van).
2. A csoportlistában válaszd a **FluentCart Product** csoportot.
3. Válassz egy tokent, például **Product Price** vagy **Product Featured Image**.

Elérhető tokenek: Product Title, Product Price, Product SKU, Product Short Description, Product Description, Product Stock Status, Product ID, Product Permalink, Product Featured Image, Product Categories és Product Brands.

A tokenek termékenként oldódnak fel, ezért egy egytermékes Theme Builder-sablonban a leghasznosabbak, ahol minden token automatikusan azt a terméket tükrözi, amelyet a vevő éppen néz.