ELHAGYOTT KOSARAK KEZELÉSE

Átírás

1 ELHAGYOTT KOSARAK KEZELÉSE TÉNYEK: A webshopokban a vásárlók 70%-a továbbáll anélkül, hogy a megkezdett vásárlást befejezné. Ez a közelítő szám majdnem konstans, független a fizetési és szállítási módtól, az árazástól, a nyelvtől és az országtól. Ha a vásárlások arányát 3%-kal sikerül megemelni, az neked 10%-os bevétel növekedést jelent! A MÓDSZER: A cart recovery bevezetéséhez a webpush.hu -n két dolgot kell tenni: Néhány kódot az oldalba építeni és a rendszert beállítani Az elhagyott kosarak kezelése az autoreszponderek speciális alkalmazásával valósul meg. A rendszerben létrehoztunk két új Tag -et. (Ez rendszer adminisztrátori lehetőség) Eddig a Kampányok/Új kampány menüpont alatt a Tag szűrésnél két objektumot találhattál: Ország Város Ezeket a tag -eket automatikusan elmentettük a feliratkozóhoz. Most két újabb Tag -et is talász itt: Kosárban Vásárolt Ezek a Tag -ek két értéket vehetnek fel: 1 és 0 (Ha majd látni szeretnéd a tageket, akkor az Eszközök/Eszközök kezelése képernyőn a lista megjelenés opciók megnyitásával bejelölheted a Tag-ek megjelenését. Bejelölés után mentés.) Nézzük a működést. Mit és milyen sorrendben érdemes elkészíteni. WebPush.hu

2 A TAGEK BEÉPÍTÉSE A WEBLAPBA. Ahhoz, hogy egy feliratkozóhoz Taget tudjunk elmenteni az szükséges, hogy egy adott oldal meglátogatásakor lefuttassunk egy rövid javascript kódot. Első lépésben keresd meg a weblapod (webshopod) kosár oldalát. Jobb esetben ez akkor jelenik meg a látogatónak, ha valamit kosárba rakott. Az URL-ben nagy valószínűséggel benne lesz a cart, vagy checkout kifejezés. Ellenőrizd, hogy a kosár oldalban benne van-e az integrációs kód. Ha valamiért nincs benne illeszd be, lehetőleg a head tagek közé. Az oldalad forráskódjába a </body> záró tag elé pedig illeszd be ezt a kódot: <script>webpushsavetag("incart", 1)</script> Ezek után, ha egy feliratkozott eszköz meglátogatja ezt az oldalt (kosárba rakott valamit) akkor elmentjük hozzá a Tag -et. Ebből tudja a rendszer, hogy megkezdődött a vásárlás, de nem fejeződött még be. Most keresd meg a vásárlást megköszönő oldalt. Itt is győződj meg róla, hogy az integrációs kód megvan-e. A </body> Tag elé építsd be a következő javascript kódot: <script>webpushsavetag("incart", 0)</script> <script>webpushsavetag("purchased", 1)</script> Az első sor megváltoztatja a Kosárban állapotot, a második pedig egy Vásárolt Taget ment el. Az utóbbi kiváló arra, hogy ezeknek a feliratkozóknak bátrabb üzenetet küldhess, hiszen ők az elégedett vásárlóid közé tartoznak. Sajnos nagyon sok olyan webshop rendszer van ami nem így működik. Ha a látogató megnyomja a Kosárba gombot, nem kerül a kosár oldalra, legföljebb egy popup jelenik meg neki, vagy még az sem és a kosár oldalt külön meg kell keresnie. Ez azt jelenti, hogy a gomb megnyomásával nem kerül mentésre a Kosárban Tag és a rendszer sem fog így működni. Ekkor a Tag mentés beépítésére más módszert kell választanunk. Erről az anyag végén részletesen írok. 2

3 A TAGEK HASZNÁLATA A RENDSZERBEN Cart recovery Ettől kezdve a feladat már nem bonyolult. Létre kell hoznunk egy olyan autoreszponder szekvenciát, melyet a Kosárban taggel rendelkezők kapnak meg. Pontosabban azok akiknél a Kosárban Tag értéke: 1. Az érték akkor változik 1-re, amikor megnézték a kosár oldalt. És amikor végzett a vásárlással thankyou paget látja az érték 0-ra változik. 3

4 Állítsuk össze az autoreszpondert 1. Kampányok/Új kampány 2. Autoreszponder 3. Időzítés: Itt állítjuk be, hogy az üzenet mennyi idő után kövesse az előző üzenetet. A sorozatban az első üzenetnél tartunk. Itt az időzítést a Kosárban tageléshez képest állítjuk be. Azaz az üzenet ennyi idővel később kerül kiküldésre a kosár oldal megtekintéséhez képest. Javaslom a perces beállítást. Feltételezhető, hogy ez elég idő a vásárlás befejezéséhez és ha ez megtörtént, az üzenetek nem lesznek kiküldve. Amennyiben a vásárlást nem fejezte be ennyi időn belül, a ciklus megindul és a vásárló még emlékszik rá, hogy mi történt fél órával ez előtt. 4. Eszközök (böngészők) kiválasztása: a példában az összes böngészőt kiválasztottam. Előnyösebb, ha itt csak a Firefoxot, Operát és a Samsung Browsert választod ki, és a Chromenak külön üzenetet készítesz hasonló beállításokkal, de a Rich Push előnyeit kihasználva. 4

5 5. Pontosan úgy állítsd be ahogy látod! Tag szűrés: VAGY Attributum: legördülő listából Kosárban (ez mentés után incart -ra változik) Jel választás: = Érték: 1 6. Egyelőre ne engedélyezd. Majd akkor engedélyezzük, ha az összes üzenet elkészült. 7. Kattints a Kampány Üzenet gombra 8. A már ismert módon elkészítjük az üzenetet. Legyen feltűnő, tartalmazzon CTA-t! A Link mezőbe a webshopod kosár URL-jét illeszd. Ide akarod küldeni a vásárlót, mert itt találja a cuccait. 5

6 9. Ha az üzenet kész kattints a Mentés és végrehajtás gombon. Gratulálok, megvan a Cart Recovery szekvenciád első üzenete. Gondold végig milyen üzeneteket, mennyit és milyen időzítéssel szeretnél küldeni. Aztán írd meg az összeset. Tippek: Az első perc és csak egy figyelem felhívás következő +3-4 óra kicsit sürgetőbb, pl: Lehet, hogy hiányzik valami? +10 óra Kedvezmény, vagy kupon +12 óra figyelmeztetés, hogy nagyon viszik +24 óra utolsó lehetőség Ezek csak tippek, próbálni kell, hogy mi működik igazán. Próbálj psziho kapcsolókat beépíteni, ami beindítja a hiány érzését. 6

7 Ha megírtad az összes üzenetet, kattints a Kampányok/Autoreszponder gombra Valami ilyesmi jelenik meg. Az elnevezéseket és adatokat a képen ne vedd komolyan, ez csak teszt céllal készült, ezért a suta elnevezések és rövid időzítések. Első lépésben az Id oszlophoz nem tartoznak számok. Ez baj, így nem fog működni, nem ismeri a sorrendet. Csinálj egy két átrendezést (akár oda vissza) és frissítsd az oldalt. Ha megjelennek a számok rendben vagy. Most még az összes üzenetet engedélyezned kell. Minden sorban az utolsó gombon a lehulló menüből a Szerkeszt -et kell választani. Ha megnyílt az üzenet, az Eng. Status -t zöldre állítjuk és a Mentés és végrehajtás gombon kattintunk. VÉGE!! Lehet elég bonyolultnak tűnik és gondolkodtunk is, ezt a módszert válasszuk, vagy egy egyszerűbbet. Pl.: Be kell írni egy URL-t amikor indul a szekvencia és egyet amikor megálljon. 7

8 Kétség kívül az egyszerűbb, nem kell a weblap kódjában turkálni. Ebben az esetben viszont nem lett volna lehetőség a következőre, ami még egy kicsit bonyolítja a képet, de sokkal jobbá teszi a rendszert!! GOMBRA KATTINTÁS ELHAGYOTT KOSÁR Mint korábban írtam a webshop motorok jó részénél a kosárba rakás gomb megnyomása után nem jelenik meg automatikusan a kosár oldal. Ezért a script nem fut le, csak akkor, ha a vásárló megkeresi a kosár oldalt. Ezt nagyon sok esetben nem teszik meg. Ezért bemutatok egy rövid módszert amivel a Tag mentést nem a kosár oldal betöltéséhez kötjük, hanem a kosár gomb megnyomásához. Ha megnyomja a gombot, már el is mentettük a Kosárban állapotot és indul a ciklus. Ehhez egy esemény kezelőt illesztünk be és ha a klikkelési esemény bekövetkezett, a kód lefut. A Kosárba tesz gomb kód részletére lesz szükségünk a használatához. Sok motor két félét alkalmaz. Egyet a kategória oldalon, ahol sok termék van és innen is kosárba rakhatunk, egy másikat pedig a termék oldalon. A Böngésző developer eszközeit használva megnéztük a kódot egy shoprenteres oldalon, ami így néz ki: <div class="snapshot-list-item list_addtocart"> <input name="quantity" value="1" type="hidden"><a rel="nofollow, noindex" href=" ity=1" data-product-id="xxxx" data-name="xxxxxxxxx" data-price="xxx" data-price-withoutcurrency="xxxxx" data-currency="huf" class="button btn btn-primary button-add-tocart"><span>kosárba</span></a></div> Az érzékeny adatokat x-ekkel helyettesítettem. 8

9 A kódból minket az <a rel= nofollow kezdetű érdekel, ez a link, amit kattintanak. A kódban a linkhez ID-t (azonosítót nem találtam) de egyéni osztályt (class igen) class="button btn btn-primary button-add-to-cart" Ennek segítségével írjuk meg a scriptet, méghozzá azt, hogy ha erre az osztályú linkre kattintanak, futtassa le a tag mentését. a script, amit az oldalakba be kell illeszteni: SHOPRENTERES PÉLDA script kezdete <script> var classname = document.getelementsbyclassname("button btn btn-primary button-add-tocart"); for(i=0;i<classname.length;i++){ classname[i].addeventlistener('click', function(){ webpushsavetag("incart", 1); } );} </script> script vége Ha olyan motorod van, ahol a kosár gomb (vagy link) kódjában nem találsz id-t, ott nyugodtan alkalmazd ezt a módszert csak a getelementsbyclassname(" utáni kódot cseréld le a tiédre! Ha találsz id-t, tedd a következőt. A gomb (vagy link) kódja ilyesmi lesz: <button class= akarmi id= cartbutton >Kosárba</button> Ebből minket az id= cartbutton (illetve ami van) érdekel. 9

10 És a beépítendő javascript: script kezdete <script> var button = document.getelementbyid('cartbutton'); button.addeventlistener('click', function() { webpushsavetag("incart", 1); } ); </script> script vége A scriptet a </body> záró tag elé kell beilleszteni. A kódot Google Tag Manageren keresztül is beépíthetjük. Ha kérdésed, vagy kétséged van, keress minket bátran. Fizető ügyfeleinknek ingyenes tanácsadást biztosítunk. 10