Egyedi termékoldal WooCommerce-alapú foglaláshoz

WooCommerce-alapú módban a foglalható termék oldalát kétféleképpen alakíthatod egyedivé: a JetWooBuilder egyoldalas sablonjával, vagy a JetThemeCore és a JetEngine elemeivel. Mindkét módhoz Elementor, WooCommerce és JetBooking kell, a beállítását előbb végezd el (WooCommerce-alapú mód).

1. módszer: JetWooBuilder és JetProductGallery

Szükséges még: JetWooBuilder és JetProductGallery.

Az egytermékes elemek bekapcsolása

1. Nyisd meg a Crocoblock → JetPlugins beállításai → JetWooBuilder → Widgets oldalt.
2. A Single Product Widgets blokkban kapcsold be azokat az elemeket, amelyeket a sablonban használni fogsz.

A sablon létrehozása

1. Nyisd meg a Crocoblock → Woo Page Builder oldalt, és kattints a Create New Template gombra.
2. A This Template For mezőben válaszd a „Single” értéket, add meg a sablon nevét, és ha szeretnél, válassz elrendezés-előbeállítást (különben nulláról építkezel).
3. Kattints a Create Template gombra.

A termék adatait az alábbi elemekkel írhatod ki:

Adat	Elem
Cím	Single Title
Kép	Single Images
Ár	Single Price
Kivonat, kategóriák, értékelés	Single Excerpt, Single Meta, Single Rating
Kosárba tétel	Single Add to Cart
Egyéni mezők (metaboxok)	JetEngine Dynamic Field

A galériához a JetProductGallery elemei közül választhatsz: Anchor Navigation (a képeket kézzel, a WooCommerce galériából vagy dinamikus címkével adhatod meg), Gallery Grid, Gallery Modern vagy Gallery Slider.

Ha kész, kattints a Publish gombra.

A sablon hozzárendelése

1. Nyisd meg a WooCommerce → Beállítások oldalt, és a JetWooBuilder fület.
2. A Single Product szakaszban jelöld be az Enable custom product single page beállítást.
3. A Single Product Template listából válaszd ki az új sablont.
4. Kattints a Módosítások mentése gombra.

Nyiss meg egy terméket a frontenden: az új sablon jelenik meg.

2. módszer: JetThemeCore és JetEngine

Szükséges még: JetEngine és JetThemeCore.

A sablon létrehozása

1. Nyisd meg a Crocoblock → Theme Builder oldalt, görgess a „Single Product” szakaszhoz, és kattints a plusz ikonra.
2. A feltételeknél válaszd az „Include”, „WooCommerce” és „Single Product” értékeket, a Select mezőbe pedig írd: „All”.
3. Kattints a Create gombra.
4. Írd be a sablon nevét, kattints az Overwrite theme body melletti „+” ikonra, és válaszd a Create Template lehetőséget.
5. Válaszd ki a tartalom típusát („Elementor”), add meg a nevet, és kattints a Create gombra.

A termék adatainak kiírása

Mit jelenítesz meg	Elem és beállítás
Cím	Dynamic Field, Source: „Post/Term/User/Object”, az Object Field listában a WooCommerce csoportból a „Title”
Ár	Dynamic Field, az Object Field listában a WooCommerce csoportból a „Plain Regular Price”
Készletállapot, cikkszám	Dynamic Field, WooCommerce csoport: „Stock Status”, „SKU”
Egyéni mező	Dynamic Field, Source: „Meta Data”, a mezőt a listából választod
Termékleírás	Heading vagy Headline elem Dynamic Tag-gel
Kép	Dynamic Image (alapból a kiemelt kép)
Kategóriák	Dynamic Terms, a Text before terms list mezőbe fix szöveget írhatsz

Fix szöveget a Customize field output kapcsolóval fűzhetsz a mezőhöz, a %s helyére kerül a mező értéke.

A foglalási űrlap

Az űrlapot a JetForm elemmel teheted a sablonba (a Choose Form mezőben választod ki, lásd Foglalási űrlap WooCommerce-integrációval). Ha gombnyomásra felugró ablakban szeretnéd megjeleníteni:

1. Tedd közzé a sablont, és készítsd el az űrlapot.
2. A JetPopup → All Popups oldalon kattints a Create New Popup gombra, válaszd ki a tartalom típusát, add meg a nevet és az előbeállítást, és kattints a Create gombra.
3. Tedd bele a JetForm elemet a foglalási űrlappal, és tedd közzé.
4. Állítsd be a megjelenítési feltételeket, és kattints a Save Conditions gombra. Feltételek nélkül az ablak nem jelenik meg.
5. A termékoldal-sablon Button elemén, a Haladó fül JetPopup szakaszában válaszd ki az Attached Popup értékét, a Trigger Type legyen „Click on Widget”.

Kapcsolódó termékek

1. Készíts listázási sablont a WooCommerce-termékekhez a JetEngine dinamikus elemeivel, és tedd közzé.
2. A JetEngine → Lekérdezéskészítő oldalon kattints az Új hozzáadása gombra, add meg a nevet, és a lekérdezés típusa legyen „WC Product Query”. Az Általános fülön a Product Status értéke legyen „Published (publish)”. A Tax Query fülön állítsd be, hogy az aktuális termék kifejezéseivel azonos kifejezésű termékeket kérje le. Mentsd a lekérdezést.
3. A sablonban add hozzá a Listing Grid elemet, válaszd ki a listázási sablont, a Custom Query fülön kapcsold be a kapcsolót, és válaszd ki a lekérdezést.

Tedd közzé a sablont, és nyiss meg egy terméket a frontenden.