A Shoperben saját kódot tehetsz a bolt minden oldalára, és a Yaplet widgetnek csak erre van szüksége. Az, hogy hová kerül a kód, a sablonodtól függ: a régebbi sablonoknál van rá egy mező, a Storefront sablonoknál pedig saját modulként adod hozzá. Kimásolsz egy kódrészletet a Yapletből, beilleszted a Shoperbe, és megjelenik a chat gomb a boltodban.
Ez az útmutató a lengyel nyelvű Shoper admint követi, ahogy a Shoper saját súgója is mutatja. A menüpontokat pontosan úgy írjuk, ahogy a Shoper mutatja őket, zárójelben magyar fordítással.
1. Másold ki a Yaplet kódodat
A Yaplet bal oldali menüjében menj a Márka → (a márkád) → Chat widget → Telepítés útvonalra. Ha a fül megkérdezi, min fut a weboldalad, válaszd a Más weboldal lehetőséget. Storefront sablonnál (3. lépés) kapcsold ki ezt a kapcsolót is: A <script> és a </script> sorral együtt. Másold ki a kódot a kódblokk másolás gombjával.
A kimásolt kód egy <script> sorral kezdődik, vagy ha a fül nem kérdezett rá, illetve ha kikapcsoltad a sorokat, akkor így: !function (Yaplet. Hogy kellenek-e a <script> sorok, az attól függ, hová illeszted be, ahogy a lenti lépések leírják.
A Shoperben kétféle sablon van: Storefront sablonok és régebbi RWD sablonok. Kövesd a 2. vagy a 3. lépést. Ha nem tudod, melyik fajta sablont használja a boltod, kérdezd meg a Shoper ügyfélszolgálatát.
2. Régebbi (RWD) sablon: illeszd be a kódot a saját integrációk közé
- A Shoper adminban menj az Aplikacje i integracje → Własne integracje menüpontra (Alkalmazások és integrációk → Saját integrációk). A panel előző változatában ez a Dodatki i integracje → Integracje własne menüpont.
- Keresd meg a Stopka strony, przed zamknięciem </body> mezőt (Oldal lábléce, a záró </body> előtt). A Nagłówek strony - <head> mező (Oldal fejléce) is jó.
- A mező végén illeszd be a kimásolt kódot egy új sorba. A Shoper előírja, hogy az ebbe a mezőbe írt kód HTML tagek között legyen, ezért a kódnak egy
<script>sorral kell kezdődnie, és egy</script>sorral kell végződnie. Ha a kimásolt kód ehelyett így kezdődik:!function (Yaplet, írd elé egy új sorba, hogy<script>, utána pedig egy új sorba, hogy</script>. - Ha a mezőben már van más kód, ne töröld ki, hanem a Yaplet kódot tedd utána.
- Kattints a ZAPISZ gombra (Mentés).
3. Storefront sablon: add hozzá a kódot saját modulként
Storefront sablonnál a Shoper csak saját modulon keresztül enged saját JavaScriptet, és csak a Shoper Premium csomagban. Shoper Premium nélkül használd inkább a Google Tag Managert: a Shoper sablonszerkesztőjében van beépített Google Tag Manager modul.
- Menj a Wygląd i treści → Wygląd sklepu → Edycja szablonu graficznego menüpontra (Megjelenés és tartalom → A bolt megjelenése → Grafikus sablon szerkesztése), és kattints az Edytuj układ i styl szablonu gombra (Sablon elrendezésének és stílusának szerkesztése).
- A szerkesztő menüjében kattints a Dodaj (Hozzáadás), majd a + Dodaj moduł własny (Saját modul hozzáadása) lehetőségre.
- Adj nevet a modulnak, például Yaplet chat, és válassz neki kategóriát.
- A modul típusánál válaszd a Moduł integracji (Integrációs modul) lehetőséget, és állítsd be, hogy bármelyik oldalon működjön (dowolna strona).
- Illeszd be a Yaplet kódot a JS (JavaScript) mezőbe. Ez a mező csak JavaScriptet fogad, ezért a kódnak így kell kezdődnie:
!function (Yaplet. Ha a kimásolt kód egy<script>sorral kezdődik, hagyd ki ezt az első sort és az utolsó,</script>sort. A többi kódmező fejlesztőknek való; ha a Shoper kéri, hogy azokat is töltsd ki, kérdezd meg a fejlesztődet vagy a Shoper ügyfélszolgálatát. - Kattints a ZAPISZ gombra (Mentés).
- A szerkesztőben nyisd meg az Integracje (Integrációk) fület, keresd meg a modulodat, ellenőrizd, hogy be van-e pipálva az Aktywność modułu (A modul aktív), és mentsd.
4. Nézd meg a boltodat
Nyisd meg a boltodat egy új böngészőfülön, és frissítsd az oldalt. A Yaplet chat gombja megjelenik a jobb alsó sarokban. Kattints rá, és nézd meg, hogy megnyílik-e a chat.
A teljes ellenőrzőlistát itt találod: Telepítés ellenőrzése.
Ha nem jelenik meg a chat
- A kód szövegként látszik az oldalakon. A Własne integracje mezőben hiányoznak a
<script>tagek. Tedd köré őket a 2. lépés szerint, majd mentsd. - Semmi sem jelenik meg, és
<script>tageket tettél a modul JS mezőjébe. Töröld őket: ez a mező sima JavaScriptet vár. - A modul el van mentve, de nincs chat. Nézd meg a szerkesztő Integracje fülén, hogy be van-e pipálva az Aktywność modułu, és mentsd.
- Nincs + Dodaj moduł własny lehetőség. A boltod nem Shoper Premium csomagon van. Használd inkább a Google Tag Managert.
- A böngésző az oldal régi változatát mutatja. Frissítsd az oldalt, vagy nyisd meg a boltodat egy privát ablakban.
Mi a következő lépés?
Ha meg szeretnéd tudni, mit csinál a kód, és hol találod a widget azonosítóját, olvasd el ezt: A Yaplet telepítése.