Jeśli korzystasz z usługi takiej jak Mapy Googlewystarczy wybrać lokalizację i umieścić mapę w swojej witrynie. Nie możesz jednak edytować map w locie, podobnie jak Twoi współpracownicy - co jest często konieczne w przypadku projektów współpracy.

Tutaj wkraczają interaktywne mapy. Umożliwiają one umieszczanie ruchomych znaczników, które każdy członek zespołu może edytować. 

W tym samouczku porozmawiamy o tym, kiedy ten typ karty będzie przydatny. Dodatkowo pokażemy Ci, jak dodać je na dwa sposoby do WordPress.

Ale zanim zaczniesz, nie spiesz się Jak zainstalować WordPressIlu wtyczki należy zainstalować na WordPress.

Następnie mchodźmy do pracy!

Co to jest mapa interaktywna (i kiedy z niej korzystać?)

Dodanie mapy do witryny internetowej jest dość proste. Narzędzia takie jak Mapy Google umożliwiają osadzanie map na stronach w ciągu kilku minut. Zaletą tego podejścia jest to, że odwiedzający mogą poruszać się po mapach, powiększać, pomniejszać itp.

Tego typu mapy są bardziej interaktywne niż tylko obrazy, ale nie pozwalają na wprowadzanie żadnych zmian po dodaniu ich do witryny.

Z drugiej strony, interaktywne mapy pozwalają (aw niektórych przypadkach także Twoim współpracownikom) dodawać nowe znaczniki, ikony, teksty i nie tylko. Wyobraź sobie na przykład, że planujesz spotkanie dla członków swojej witryny internetowej. Możesz skonfigurować mapę z wieloma pinezkami, aby zasugerować lokalizacje.

Odkryj przy okazji Wtyczki 5 WordPress, aby dodać geolokalizację do swojego bloga

Możesz także użyć interaktywnej mapy, aby użytkownicy mogli udostępniać swoje lokalizacje lub nawigować do miejsc, które chcą odwiedzić. Mówiąc dokładniej, są to zastosowania niszowe. Jednak interaktywne mapy  peuvent  przydać się w wielu różnych sytuacjach. 

Ponadto niekoniecznie są trudniejsze do dodania niż ich odpowiedniki.

Jak dodać interaktywne mapy do swojej witryny WordPress

Jeśli chodzi o mapy interaktywne, możesz je osadzić w swojej witrynie lub skorzystać z wtyczki, która Ci w tym pomoże. Pierwsze podejście jest prostsze, ale wtyczki często zawierają znacznie więcej funkcji, jak można się spodziewać. Przyjrzyjmy się podejściu wtyczki, aby pokazać, jakie są te funkcje.

1. Użyj wtyczki Maps Marker Pro

Użyj Kreatora map Pro

Wtyczka Maps Marker Pro to kompleksowe rozwiązanie premium do dodawania map do WordPress. Oferuje dziesiątki zaawansowanych funkcji, takich jak te, które umożliwiają przeglądanie map z wielu działów oraz dodawanie praktycznie nieograniczonej liczby znaczników do map i ich organizowanie. Ponadto odwiedzający mogą filtrować typy znaczników, które chcą widzieć na Twoich mapach.

Inne fajne rzeczy, które możesz zrobić za pomocą tej wtyczki, to dodawanie informacji o odległości i trasie między znacznikami. Możesz nawet udostępniać swoją lokalizację w czasie rzeczywistym za pośrednictwem mapy witryny, jeśli masz na to ochotę. Skonfigurowanie wtyczki może zająć trochę czasu, biorąc pod uwagę bogactwo oferowanych przez nią funkcji. 

Jednak nie jest to tak trudne, jak można sobie wyobrazić. 

Aby rozpocząć, skonfiguruj i aktywuj wtyczkę, tak jak każdą inną. Jeśli nie znasz WordPressa, dowiedz się Jak zainstalować wtyczkę w WordPress

Gdy wtyczka jest gotowa, musisz dodać nową mapę lub warstwę, co możesz zrobić z zakładki Maps Marker Pro> Dodaj nową warstwę. Tutaj ustaw nazwę, którą możesz rozpoznać dla swojej warstwy, i wprowadź lokalizację, którą chcesz wyświetlić, tak jak w przypadku każdego innego narzędzia do mapowania online:

Dodaj nową warstwę

Teraz możesz dostosować rozmiar i poziom powiększenia, które chcesz ustawić jako domyślne, używając lewego menu. Istnieje również opcja o nazwie Klastrowanie znaczników , co spowoduje wyświetlenie ikony z liczbą znaczników w obszarze, jeśli powiększysz za bardzo, jak w poniższym przykładzie:

Wyświetl znacznik

opcja Szukaj znaczników, z drugiej strony jest dość wyraźne. Może być przydatny, jeśli chcesz dołączyć dodatkowe informacje o swoich znacznikach:

Lista markerów

Teraz przewiń w dół i znajdź opcję « Dodaj nowy znacznik na tej warstwie« . Na następnym ekranie będziesz mógł określić nazwę i lokalizację swojego znacznika, używając tej samej mapy, co poprzednia.

Odkryj też Jak do kompresji i rozmiar zdjęć na WordPressie

Możesz także wybrać ikonę i ustawić wyskakujący tekst dla znacznika. Pojawi się, gdy odwiedzający klikną sam znacznik lub wybierzesz go z listy, jeśli zdecydujesz się go uwzględnić.

W każdym razie nie zapomnij nacisnąć przycisku publikować po zakończeniu. Po dodaniu kilku markerów Twoja początkowa warstwa powinna wyglądać następująco:

Przykład warstwy na bloku

Kiedy jesteś gotowy, aby dodać nową interaktywną mapę do jednej ze swoich stron, powinieneś użyć pliku krótki kod. Przewiń do góry karty Edytuj warstwę  i poszukaj jego odpowiedniego identyfikatora:

Zapisz identyfikatory kart

Teraz umieść shortcode [mapsmarker layer = "X"] w swoim poście lub na stronie. Nie zapomnij zastąpić symbolu zastępczego  jednak z wyprzedzeniem podając identyfikator swojej „warstwy”.

Twoja karta powinna teraz działać w Twojej witrynie! Co ważniejsze, ty lub ktokolwiek z twojego zespołu możesz edytować i dodawać nowe znaczniki w dowolnym momencie, bez opuszczania pulpitu nawigacyjnego.

2. Korzystanie z wbudowanej funkcji osadzania programu Google Map

Mapy Google naprawdę nie wymaga wprowadzenia - jest to usługa, która umożliwia wyodrębnianie map z całego świata w celu udostępniania miejsc innym osobom, znajdowania adresów, a nawet udostępniania informacji o tym, gdzie się znajdujesz. Jeśli chodzi o witryny internetowe, istnieje wiele sposobów umieszczania Map Google na swoich stronach. Zapisz mapy za pomocą mapy google

Jednak większość kart oferuje ograniczoną interaktywność. Umożliwiają one poruszanie się po nich, przybliżanie, oddalanie i zmianę widoku, ale nic więcej.

Faktem jest, że Mapy Google oferują znacznie więcej funkcji niż proste mapowanie. Możesz na przykład dodawać wiele znaczników, mierzyć odległości i uwzględniać wskazówki na mapach. Aby wypróbować te funkcje, przejdź do Google Moje mapy a następnie kliknij przycisk  + Utwórz nową mapę  :

Utwórz mapę na mapie Google

Na następnym ekranie ustaw tytuł mapy i jej pierwszą warstwę, na której będziemy budować. Teraz znajdź lokalizację, którą chcesz udostępnić, korzystając z paska wyszukiwania Map Google u góry ekranu:

Nowa mapa i lokalizacja mapy google

Podczas powiększania możesz użyć symbolu znacznika u góry ekranu, aby rozpocząć wyróżnianie lokalizacji na mapie. Po prostu kliknij miejsce, w którym chcesz umieścić znacznik, a następnie ustaw dla niego nazwę i ikonę:

Dodaj znacznik do nowej mapy.

Gdy masz wiele znaczników, możesz narysować między nimi linie, aby wyświetlić odległości:

Wyświetl odległość między dwoma punktami na mapie

Gdy Twoja karta będzie gotowa, kliknij przycisk Udział w menu po lewej stronie. Tam zmień ustawienia dostępu  de prywatnie  à publiczny :

Zdefiniuj dostęp do karty

Możesz także zaprosić członków zespołu do korzystania z ich e-maili, aby mogli natychmiast uzyskać dostęp do mapy:

Mapa do współpracy z partnerami

W każdym razie powinieneś zawsze umieścić nową kartę w swojej witrynie. Możesz to zrobić, klikając ikonę trzech kropek obok tytułu mapy i klikając opcję Osadź tę mapę  :

Osadź mapęTeraz możesz skopiować i wkleić kod osadzania na swoich stronach. Twoja nowa karta pojawi się wszędzie tam, gdzie ją umieścisz. Ponadto Twoi współpracownicy będą mogli go edytować i dodawać nowe znaczniki za pośrednictwem Google Maps, jeśli to konieczne.

Odkryj także niektóre wtyczki premium WordPress  

Możesz użyć innych WordPress wtyczki aby nadać nowoczesny wygląd i zoptymalizować obsługę Twojego bloga lub strony internetowej.

Oferujemy tutaj kilka premium wtyczek WordPress, które pomogą Ci to zrobić.

1. Ultimate Math Captcha

Ultimate Math Captcha to WordPress Plugin 100% skuteczna premia captcha. Pozwala dodać matematyczną captcha na formularze Logowanie WordPress, rejestracja, odzyskiwanie hasła, komentarze, WooCommerce, Easy Digital Downloads i aux formularze z bbPress.Ostateczna wtyczka matematyczna captcha wordpress

Jego funkcje obejmują: łatwą instalację i konfigurację, dodawanie captcha do wielu formularze, obsługa wielu captcha matematycznych na tej samej stronie, dostosowywanie komunikatów o błędach i wiele innych.

Pobierz | Demohosting

2. PayPal Standard Payment Gateway for Ninja Forms

PayPal Standard Gateway for Ninja Forms umożliwia tworzenie formularzy, które bezproblemowo integrują się z bramką płatności PayPal. Będziesz mógł tworzyć spersonalizowane formularze zamówień i otrzymywać płatności za pomocą standardowych kont Paypal.

Standardowa bramka płatności Paypal dla formularzy ninja

Jego główne cechy to: łatwa i szybka integracja, integracja IPN, możliwość aktywacji / dezaktywacji bramki PayPal na poszczególnych formularzach, obsługa regularnych płatności itp.

Pobierz | Demo |  hosting

3. Formy grawitacyjne - Lista i edycja

Z tym WordPress Plugin premium, istnieje możliwość modyfikacji lub usunięcia wpisów zgłoszonych w formularzach Twojej witryny. Funkcja, której bardzo brakuje we wtyczce Gravity Forms, dlatego właśnie utworzono to rozszerzenie.Lista formularzy grawitacyjnych edytuj wtyczki wordpress wstaw tabele strony graficznej formularz bloga

Wśród jego funkcji wymienimy między innymi: medycja i zapisywanie zarejestrowanych danych,uppression wprowadzonych danych,modyfikacja i usuwanie artykułów już opublikowanych, iDoskonała integracja z wtyczkami jQuery Datatables i Gravity-Forms, theobsługa logiki warunkowej, sprosty i szybki w instalacji i wiele więcej.

Pobierz Demo | hosting

Polecane zasoby

Dowiedz się o innych zalecanych zasobach, które pomogą Ci zbudować witrynę i zarządzać nią.

Wnioski

Tutaj! To wszystko w tym samouczku, mam nadzieję, że pozwoli ci on stworzyć interaktywne mapy w WordPress. Nie wahaj się udostępnij znajomym w swoich ulubionych sieciach społecznościowych

Możesz jednak również skonsultować się nasze zasoby, jeśli potrzebujesz więcej elementów do realizacji projektów tworzenia stron internetowych, zapoznaj się z naszym przewodnikiem na temat Tworzenie bloga WordPress.

Jeśli masz sugestie lub uwagi, zostaw je w naszej sekcji commentaires.

...