Kosár widget

Adjon lehetőséget vásárlóinak, hogy közvetlenül a kosárban válasszák ki a csomagátvételi pontot — még mielőtt a pénztárhoz lépnének. A Globe kosár widget egy szállítási választót ad a kosár oldalhoz vagy a kosár fiókhoz, így a vásárlók választhatnak a házhozszállítás és a csomagátvételi pont között anélkül, hogy elhagynák a kosarat.

Hogyan működik

A widget két kártyastílusú lehetőséget ad a kosárhoz:

Házhozszállítás — a vásárló standard szállítást kér a saját címére. Ennek kiválasztása törli a korábban mentett csomagátvételi pontot.
Csomagátvételi pontok — a vásárló csomagátvételi ponton szeretné átvenni a csomagot. Erre a kártyára kattintva megnyílik egy interaktív térkép és lista, amelyet a Leaflet és az OpenStreetMap működtet (nem szükséges Google Maps API kulcs).

A térképen a vásárlók cím szerint kereshetnek, használhatják a tartózkodási helyüket, és böngészhetik az összes közeli csomagátvételi pont jelölőit. A pont kiválasztása után a kártya frissül, és megjeleníti a kiválasztott pont nevét és címét, valamint egy Módosítás gombot.

A kiválasztás elmentésre kerül a kosárba, és automatikusan átkerül a rendelésbe.

A vásárlók közvetlenül a kosárban választanak a házhozszállítás és a csomagátvételi pontok között.

Beállítás

Győződjön meg arról, hogy legalább egy szállító be van állítva a Globe-ban. Ha még nem tette meg, lásd: Csomagátvételi pont szállítók hozzáadása.
Engedélyezze a widgetet a Shopify témájában:
- A Shopify adminisztrációban lépjen az Online Store → Témák → Testreszabás menüpontba.
- Nyissa meg az App beágyazások menüpontot a bal panelen.
- Keresse meg a Cart pickup points elemet, és kapcsolja be.
- Kattintson a Mentés gombra.
A téma szerkesztőt közvetlenül a Globe-ból is megnyithatja — lépjen a Beállítások → Kosár widget menüpontba, és kattintson a Téma szerkesztő megnyitása gombra.

Engedélyezze a Cart pickup points app beágyazást a témájában.
A Globe alkalmazásban lépjen a Beállítások → Kosár widget menüpontba, és állítsa be az elhelyezést (lásd alább).

Elhelyezés

A widget az Ön által megadott CSS-szelektor alapján szúrja be magát a kosárba. A különböző témák eltérő HTML struktúrákat használnak, ezért a widgetet a téma megfelelő elemére kell irányítani.

Általános szelektorok:

Téma típusa	Kipróbálandó szelektor
Teljes kosár oldal	`.cart__footer`
Kosár fiók	`.cart-drawer__summary`
Általános	`#cart-totals`

Nem biztos, hogy melyik szelektor illik a témájához? Kattintson a Segítség gombra a CSS-szelektor mező mellett a Globe-ban — végigvezeti a megfelelő szelektor megtalálásán a böngésző DevTools segítségével. Kapcsolatba léphet a támogatással is, és mi azonosítjuk azt Önnek.

Több elhelyezési célpontot is hozzáadhat, ha a témája teljes kosár oldalt és kosár fiókot is tartalmaz — a widget mindkettőben megjelenik.

Konfigurálja a CSS-szelektort és az elrendezést minden elhelyezési célponthoz.

Testreszabás

Fordítások

Testreszabhatja a vásárlók által látott négy feliratot: a fejlécet, a „Házhozszállítás”, a „Csomagátvételi pontok” és a „Módosítás” gombot. A fordítások nyelvenként állíthatók be — a widget automatikusan felismeri a vásárló böngészőjének nyelvét, és a megfelelő szöveget jeleníti meg. Az alkalmazás csak a Shopify áruházában közzétett nyelveket mutatja.

Színek

Nyolc színbeállítás teszi lehetővé, hogy a widgetet áruháza arculatához igazítsa: fejléc színe, szöveg színe, kártya háttere, kártya szegélye (normál), kártya szegélye (kiválasztott), ikon színe, gomb háttere és gomb szövegének színe.

Elrendezés

Válasszon a vízszintes (a két kártya egymás mellett) vagy a függőleges (a kártyák egymás alatt) elrendezés között. A vízszintes jól működik széles kosár elrendezéseknél; a függőleges jobban illik a keskeny kosár fiókokhoz.

Pénztár cím előkitöltés

Amikor egy vásárló kiválaszt egy csomagátvételi pontot a kosárban, a Globe automatikusan kitöltheti a pénztár szállítási cím űrlapját az adott csomagátvételi pont címével. Ez megkíméli a vásárlót a cím újbóli megadásától.

Engedélyezze ezt a Beállítások → Kosár widget → Pénztár cím előkitöltés menüpontban.

Ha a témája nem szabványos pénztár gombot használ, adja meg a gomb CSS-szelektorát az Egyéni pénztár gomb szelektor mezőben (vesszővel elválasztott több szelektor is megadható, pl. .cart__checkout-button, #checkout).

Előfeltételek

Telepített Globe alkalmazás aktív előfizetéssel
Legalább egy csomagátvételi pont szállító beállítva a Globe-ban
A Cart pickup points app beágyazás bekapcsolva a téma szerkesztőben