Widżet mapy dla Shopify

Dlaczego sekcja motywu jest lepsza niż aplikacja Shopify

Większość ofert „aplikacji z mapą” wymaga instalacji, uprawnień do danych Twojego sklepu i miesięcznej opłaty — a ostatecznie chodzi o jeden iframe. To uczciwa alternatywa: pojedynczy plik Liquid, który leży w Twoim własnym motywie. Nie prosi o żadne uprawnienia do sklepu, nie dodaje skryptów do Twoich stron, niczego nie wysyła na zewnątrz i nic nie kosztuje. Jedyne zewnętrzne żądania Twoich odwiedzających to sandboxowany iframe mapy z whatismylocation.ai i jego kafelki OpenStreetMap — bez ciasteczek Google i bez bagażu banerów zgody. Gdyby usługa kiedyś była niedostępna, iframe po prostu nic nie pokaże i nie zepsuje strony. Usuń plik sekcji, a nie zostanie po niej żaden ślad.

Pobierz whatismylocation-shopify-sections.zip — obie sekcje plus plik README, kilka kilobajtów. Potem wykonaj poniższe kroki instalacji.

Instalacja w około dwie minuty

Dwie części: raz wklejasz plik, a potem używasz go jak każdej wbudowanej sekcji.

Wklej plik: panel Shopify ▸ Sklep online ▸ Szablony ▸ ⋯ ▸ Edytuj kod. W lewym pasku bocznym w katalogu Sections kliknij Dodaj nową sekcję, nazwij ją whatismylocation-map, usuń przykładową zawartość i wklej całą zawartość pliku whatismylocation-map.liquid — blok {% schema %} na dole buduje Twój panel ustawień, więc musi trafić tam razem z resztą. Zapisz.

Użyj jej: otwórz edytor motywu (Dostosuj), przejdź na stronę kontaktową (lub dowolną inną), naciśnij Dodaj sekcję i wybierz WhatIsMyLocation Map. Panel ustawień pojawi się po lewej. Dopóki nie wpiszesz współrzędnych, sekcja pokazuje przyjazny komunikat zastępczy z informacją, czego dokładnie potrzebuje.

Współrzędne weź z kreatora osadzania mapy — wpisz swój adres, a potem przeciągnij pinezkę na swoje wejście, zanim je skopiujesz. Sekcja zapisuje Twoje ostateczne współrzędne, więc pinezka nie może się później przesunąć.

Oddziały to bloki

Sklepy z wieloma lokalizacjami dostają tu najlepszą część: w edytorze motywu każdy oddział to blok — naciśnij Dodaj oddział, wpisz szerokość i długość geograficzną, nazwę oraz adres, a kolejność zmienisz przeciąganiem (do 10 oddziałów). Mapa sama dopasowuje widok do wszystkich oddziałów, pinezki są numerowane zgodnie z listą, a odwiedzający dostają panel lokalizacji — akordeon obok mapy na komputerze, przesuwany pasek kart na telefonie, z trasą dojazdu do każdego oddziału i opcjonalnymi ikonami „Otwórz w Google Maps / Apple Maps”. Układ panelu (auto, z boku, na dole, brak) i animacja przełączania (płynna, przenikanie, żywa, brak — odwiedzający z włączonym ograniczeniem ruchu zawsze dostają wersję natychmiastową) to listy rozwijane w tym samym panelu.

Wszystkie ustawienia po kolei

To samo archiwum zip zawiera whatismylocation-widget.liquid — widżet znajdź moją lokalizację jako drugą sekcję (motyw kolorystyczny, tryb kompaktowy lub pełny, wysokość), do stron dostaw i wyszukiwarek sklepów.

Rozwiązywanie problemów

Sekcja nie pojawia się pod Dodaj sekcję. Plik musi leżeć w katalogu Sections (nie Snippets ani Assets), a wklejona treść musi obejmować cały plik — jeśli blok {% schema %} został ucięty, Shopify odrzuci lub ukryje sekcję. Wklej cały plik ponownie i zapisz.

Błąd „Invalid schema” przy zapisie. To niepełne wklejenie — najczęściej brakuje zamykającego nawiasu klamrowego, bo zaznaczenie skończyło się wiersz przed końcem pliku. Wklej kompletny plik jeszcze raz. Nie edytuj schematu ręcznie, jeśli nie znasz Liquid.

Mapa jest szara. Kafelki mapy pochodzą z tile.openstreetmap.org; agresywna blokada reklam albo sieć firmowa mogą je blokować. Sprawdź na telefonie w sieci komórkowej — Twoi klienci prawie na pewno widzą mapę poprawnie.

Pinezka nie stoi przy moich drzwiach. Zbuduj współrzędne od nowa w kreatorze, przeciągnij pinezkę na swoje wejście i wklej nowe wartości w ustawieniach sekcji.

Zmian nie widać w działającym sklepie. Edytowałeś wersję roboczą lub nieopublikowany motyw — wprowadź zmianę w opublikowanym motywie albo opublikuj ten, który edytowałeś. Sam widżet nie ma nic do zbuforowania.