# Termék elem: saját boltod termékei a popupban Canonical URL: https://support.optimonk.com/hu/articles/product-element Az OptiMonk közvetlenül beillesztheti a popupjaidba a saját boltod termékeit – azok képeit, nevét és árát –, így valódi termékek köré tervezhetsz ajánlatot, anélkül hogy egyenként kellene feltöltened őket. Ez a **termékajánló**, és ez hajtja az upsell, cross-sell és cart-abandonment popupokat. --- ## 1. Kérj egy termékeket tartalmazó popupot Már nem kell egy "Increase sales" sablont választanod, és egy Product elemet ráhúznod. Egyszerűen leírod az ajánlatot. 1. Kattints az **Új kampány** gombra a bal oldali menüben. 2. Írd le, mit szeretnél – például *"egy cart-abandonment popup a yourstore.com számára, amely három terméket jelenít meg a látogató kosarából, egy 10%-os kóddal"*. 3. Az asszisztens feltesz néhány tisztázó kérdést, majd megjelenít négy koncepciót, mindegyikhez egy képpel. 4. Nyisd meg azt, amelyik tetszik, és kövesd a fejlécében található lépéseket: **Tovább: célzás**, majd **Elkészítés**. *💡 A briefben mondd meg, hány terméket szeretnél. A termékkártyák száma a designból származik, és utólag nem módosítható a panelen – a panel csak jelzi ezt: például „3 termékkártya – a designból”.* --- ## 2. Nyisd meg a termékbeállításokat 1. Nyisd meg a **Kampányok** menüpontot a bal oldali menüben, majd kattints a kampányodra. 2. Nyisd meg a variánst, és kattints a **Drag & drop editor** gombra. Kattints a termék sorra a vászonon. A jobb oldali panel megnyílik a **Vizuális** fülön, a **Termékajánló** fejléccel. A panel a legfontosabb szabállyal nyílik meg: > *Ez az OM termékkomponens. A kártyáit a rendszer futásidőben, megjelenítéskor tölti fel (dinamikus módban közvetlenül a boltból), így ha a vászonon felülírnál egy termék nevet, árat vagy képet, azt a rendszer csendben elvetné – szerkessz egy kártyát rákattintással, vagy az alábbi listából. A kártyák száma a designból származik; itt nem módosítható.* --- ## 3. Válaszd ki a Mód beállítást A **Mód** legördülő menü dönti el, honnan érkeznek a termékek: - **Kézi (fix termékek)** – te választod ki pontosan a kívánt termékeket. - **Legtöbbet nézett** – a legtöbbet nézett termékeid. - **Utoljára megnézett** – azok a termékek, amelyeket ez a látogató megnézett. - **Kosárban lévő termékek** – amit ez a látogató jelenleg a kosarában tart. - **Okos ajánló** – egy személyre szabott ajánlás. A négy dinamikus mód működéséhez a boltodnak csatlakoznia kell. Kapcsolat nélkül szürkén jelennek meg, egy **bolt kell** jelzéssel, és a panel elmagyarázza, miért: > *A dinamikus módok működéséhez a boltodnak csatlakoznia kell az OptiMonk-hoz.* Kattints a **Miért?** gombra a teljes válaszért: > *A Most viewed, Last visited, Products in the cart és Smart recommendation mind élőben, a boltod saját adataiból választják ki a termékeket. Kapcsolat nélkül a popupnak nem lenne mivel feltöltenie a kártyákat, így az OptiMonk inkább elrejti az egész kampányt, mint hogy üres kártyákat jelenítsen meg.* **Manual** mindig működik, boltkapcsolattal vagy nélküle is. ### A bolt csatlakoztatása > *Csatlakoztasd a boltod az OptiMonk admin felületén, a Beállítások → Kód beillesztése menüpont alatt: válaszd ki ott a platformodat (Shopify, Shoprenter, WooCommerce, Unas, Gomag, MerchantPro), és fejezd be a csatlakozást – Shopify esetén ez az OptiMonk app telepítésével történik. A különálló Integrációk oldal az e-mail/marketing eszközökhöz tartozik, nem a bolthoz.* Néhány platform egy **API kulcs** kulcsot kér a csatlakozás során (Unas és Gomag esetén egyetlen kulcsot, MerchantPro esetén egy API felhasználót és jelszót). A kulcs mentése után ezt látod: *Csatlakoztatva – szinkronban tudjuk tartani a termékkatalógusodat.* Amint a bolt csatlakoztatva van, a dinamikus módok itt kiválaszthatóvá válnak, és a kártyák magukat töltik fel. --- ## 4. Válassz termékeket kézzel A Mode legördülő menü alatt minden kártya listázva van a bélyegképével, nevével és árával. Kattints egyre a megnyitásához. **A bolt katalógusából** a kártyaszerkesztő tetején található: keress a *Termék keresése…* mezővel, majd kattints egy termékre, hogy egy lépésben feltöltsd a kártyát. Ha a domainhez nincs gyorsítótárazott katalógus, a szerkesztő ezt jelzi – *Nincs gyorsítótárazott katalógus ehhez a domainhez – töltsd ki a kártya mezőit kézzel lent* – és az értékeket kézzel írod be. Alatta a kártya minden mezője: | Mező | What it is (Mi ez) | | --- | --- | | Név | A termék neve | | Ár | Az aktuális ár | | Eredeti ár | Az áthúzott ár, ha megjelenítesz ilyet | | Cikkszám | A termék SKU-ja | | Gombfelirat | A kártya gombján megjelenő szöveg | | Kép URL | A termék képe | | Termékoldal URL | Ide navigálja a látogatót a kártya gombja | Az a mező, amelyet a design nem tartalmaz, letiltva van, és így van jelölve: *a dizájn nem rakta ki* – az adott kártya egyszerűen nem jeleníti meg. Kattints a **Mentés** gombra a változások megtartásához, a **Mégse** gombra pedig az elvetésükhöz. *💡 **A termék új lapon nyíljon** egy kapcsoló a fő panelen, a kártyalista felett: minden kártyára vonatkozik.* --- ## 5. Formázd a kártya gombját A kártya gombjának saját **Gomb (CTA)** szekciója van a panelen: - **Szélesség** — *Automatikus*, *Teljes szélesség* vagy *Fix* (egy **Width (px) (Szélesség (px))** értékkel) - **Magasság (0 = automatikus)**, **Betűméret**, **Betűtípus** vagy egy a szerkesztő betűtípusai közül) - **Szövegszín**, **Háttér**, **Hover háttér**, **Hover szövegszín** - **Vízszintes padding**, **Függőleges padding**, **Sarok lekerekítés** Minden más, ami a kártyák megjelenését illeti – elrendezés, keretek, térköz – a designból származik. Ezeket az **AI** fülön kérheted: *"legyen a termékkártyák elrendezése kétoszlopos"*. --- ## 6. Jó, ha tudod - **Mentés kilépés előtt.** Kattints a **Mentés és kilépés** gombra a szerkesztő felső sávjában. Addig semmi nem jut el a látogatóidhoz. - **Figyelj a kártyaszám figyelmeztetésre.** Ha a design és a tárolt beállítások nem egyeznek, a panel figyelmeztet: *„A beállítások 3 terméket határoznak meg, de a sor 4 terméket tartalmaz. A build a következő módosításkor visszaírja a valódi számot; az eltérés elrejtené a kampányt.”* - **Bolt nélkül is végezhetsz upsellt.** Használd a **Manual** módot, és töltsd ki kézzel az egyes kártyákat – név, ár, kép, link. Ez néhány perccel tovább tart, mint egy szinkronizált katalógus esetén, de bármely platformon működik. ### Segítségre van szükséged? Ha további kérdéseid vannak, vagy bármilyen segítségre van szükséged, szólj nekünk, szívesen segítünk :)