W przypadku kawiarni, gabinetu, studia czy stoiska targowego strona dostępna z linku w profilu ma przede wszystkim pomóc klientom dotrzeć na miejsce. Mapę można dodać do strony Digily Link na 3 sposoby. Wybór zależy od planu oraz od tego, czy chcesz pokazać mapę, czy udostępnić przycisk uruchamiający nawigację.
Sposób 1. Przycisk otwierający trasę w aplikacji map
To rozwiązanie działa w każdym planie, także Free, i właśnie tego najczęściej potrzebują odwiedzający. Na telefonie mało kto przesuwa i powiększa mapę. Użytkownik zwykle wybiera "Wyznacz trasę" i oczekuje, że nawigacja uruchomi się od razu.
- Otwórz Mapy Google, znajdź swoją firmę, wybierz opcję udostępniania i skopiuj link.
- W panelu utwórz krótki link prowadzący pod ten adres i włącz "auto open app on mobile". Digily Link rozpoznaje linki do Google Maps i Waze, więc na telefonie z zainstalowaną aplikacją krótki link otworzy nawigację bezpośrednio. Poradnik o deep linkingu wyjaśnia, dlaczego ma to znaczenie.
- Dodaj do strony blok linku, wklej krótki link i nadaj mu nazwę "Wyznacz trasę".
Ponieważ przycisk prowadzi przez krótki link, jego kliknięcia są zliczane w statystykach. Jeśli zmienisz lokalizację, możesz też podmienić adres docelowy.
Sposób 2. Osadzona mapa w bloku iframe
Blok iframe jest dostępny w planach Starter i Pro. Pozwala wyświetlić mapę bezpośrednio na stronie.
- Znajdź miejsce w Mapach Google, otwórz opcję udostępniania i przejdź do karty "Umieszczanie mapy".
- Skopiuj kod HTML wyświetlony przez Google. Potrzebujesz tylko adresu znajdującego się w src="...", który zaczyna się od https://www.google.com/maps/embed. Jeśli łatwiej Ci będzie w ten sposób wyodrębnić adres, wklej cały fragment do narzędzia Parser URL.
- Dodaj do strony blok iframe, wklej ten adres jako URL i ustaw wysokość na około 300 pikseli.
Bezpośrednio pod mapą umieść przycisk wyznaczania trasy opisany w sposobie 1. Mapa pokaże lokalizację, a przycisk pomoże do niej dotrzeć.
Sposób 3. Responsywna mapa we własnym HTML
Blok własnego HTML jest dostępny w planie Pro i daje pełną kontrolę, w tym możliwość utworzenia mapy zachowującej proporcje na ekranie o dowolnym rozmiarze. Wklej do bloku poniższy kod i zastąp YOUR_EMBED_URL adresem z karty "Umieszczanie mapy".
<div style="position:relative;padding-bottom:56.25%;height:0;overflow:hidden;border-radius:12px"><iframe src="YOUR_EMBED_URL" style="position:absolute;top:0;left:0;width:100%;height:100%;border:0" loading="lazy" allowfullscreen referrerpolicy="no-referrer-when-downgrade"></iframe></div>
Wartość padding-bottom określa kształt mapy. 56,25% daje prostokąt o proporcjach 16:9, 75% bardziej zbliżoną do kwadratu mapę 4:3, a 100% kwadrat. Atrybut loading="lazy" sprawia, że mapa nie spowalnia strony, zanim odwiedzający do niej przewinie. Jeśli wklejasz kod z innego źródła, najpierw uporządkuj go za pomocą narzędzia Minifikator HTML, aby przypadkowe złamanie wiersza nie uszkodziło bloku.
Który sposób wybrać
| Czego potrzebujesz | Rozwiązanie | Plan |
|---|---|---|
| Uruchomienie nawigacji jednym dotknięciem | Przycisk wyznaczania trasy z otwieraniem aplikacji | Free i wyższe |
| Mapa widoczna na stronie | Blok iframe | Starter i Pro |
| Mapa o własnym kształcie i wyglądzie | Blok własnego HTML | Pro |
| Kilka lokalizacji | Jeden nagłówek i jeden przycisk wyznaczania trasy dla każdej lokalizacji albo własna mapa Google My Maps osadzona sposobem 2 lub 3 | Zależy od użytych bloków |
Wskazówki dla lokalnych firm
- W bloku akapitu nad mapą podaj kod pocztowy dla osób, które wolą wpisać go we własnej aplikacji.
- Dodaj blok godzin otwarcia, dostępny w planie Free, aby odwiedzający wiedział, czy warto już wyruszyć.
- Umieszczaj tylko 1 mapę na stronie. Dwie osadzone mapy podwajają czas ładowania, nie dając w zamian większych korzyści.
- Wydrukuj kod QR prowadzący do strony i umieść go w witrynie oraz na ulotkach. Przykładowy układ strony lokalu znajdziesz w poradniku o linku w bio dla małych firm.
- Przetestuj przycisk wyznaczania trasy w aplikacji Instagram na telefonie iPhone oraz z systemem Android. Narzędzie Sprawdzanie przekierowań URL pokaże, jak krótki link działa na komputerze.
Sklepy tymczasowe, targi i wydarzenia
Stoisko, które co weekend działa w innym miejscu, nie wymaga ciągłego tworzenia nowej mapy. Przycisk wyznaczania trasy powinien prowadzić przez krótki link, którego adres docelowy zmienisz w piątek na lokalizację aktualnego stoiska. Adres strony, kod QR na banerze i link w profilu pozostaną bez zmian. W planach Starter i Pro możesz również zaplanować zmianę krótkiego linku. Dzięki temu o północy lokalizacja sobotnia automatycznie zmieni się na niedzielną i nikt nie będzie musiał o tym pamiętać. Dodaj też blok akapitu z datami i kodem pocztowym dla osób, które wolą zaplanować wizytę wcześniej.
Apple Maps i Waze
Funkcja otwierania aplikacji rozpoznaje adresy Google Maps i Waze. Użytkownikom iPhone'ów, którzy wolą Apple Maps, możesz udostępnić zwykły link do maps.apple.com zawierający adres. Na iPhonie otworzy on Apple Maps, a na innych urządzeniach mapę internetową, ponieważ linki Apple działają w ten sposób bez dodatkowej konfiguracji. Dwa przyciski, "Google Maps" i "Apple Maps", obsłużą niemal każdy telefon w Polsce, a liczba kliknięć pokaże, z którego rozwiązania faktycznie korzystają odwiedzający.
Najczęstsze pytania
Czy potrzebuję klucza API Google Maps?
Nie. Kod z opcji "Umieszczanie mapy" i link do udostępniania są bezpłatne i nie wymagają klucza. Klucz API jest potrzebny tylko programistom tworzącym własną aplikację z mapami.
Czy mogę pokazać na mapie kilka punktów?
Utwórz własną mapę w Google My Maps ze wszystkimi lokalizacjami, udostępnij ją publicznie, a następnie użyj jej adresu do osadzania w bloku iframe lub własnego HTML.
Czy osadzona mapa spowalnia stronę?
Nieco, dlatego powyższy kod ładuje ją dopiero wtedy, gdy jest potrzebna. Na stronie, która ma pomóc ludziom dotrzeć na miejsce, przycisk wyznaczania trasy jest ważniejszy niż widok mapy.
Czy mogę dodać mapę w planie Free?
Tak, jeśli chodzi o przycisk wyznaczania trasy. Blok iframe wymaga planu Starter, a blok własnego HTML planu Pro. Strona planów zawiera pełną listę ich możliwości.
Co zrobić po zmianie siedziby firmy?
Zmień adres docelowy krótkiego linku przypisanego do przycisku wyznaczania trasy i zastąp adres osadzonej mapy. Nie trzeba zmieniać żadnych wydrukowanych materiałów.
Kontrola przed publikacją
- Przycisk wyznaczania trasy otwiera aplikację map na telefonie, a stronę z mapą na komputerze.
- Osadzona mapa pokazuje właściwy punkt i na telefonie dopasowuje się do szerokości strony.
- Na stronie znajdują się kod pocztowy i godziny otwarcia.
- Na stronie jest tylko 1 mapa.
- Strona została przetestowana w aplikacji Instagram, a nie tylko w przeglądarce.