MagyarmagyarHaladó térkép és Google Maps API-kulcs
A Google Maps API-kulcs létrehozása, a térképszolgáltatók beállítása, és a Haladó térkép widget használata.
A Haladó térkép (Advanced Map) widget térképet tesz az oldalra. Alapértelmezésben a Google Maps szolgáltatást használja, amelyhez saját API-kulcs kell. A kulcs egy azonosító: megmondja a Google-nek, melyik projekt kéri a térképet.
Követelmények
Szekció neve “Követelmények”- Elementor és JetElements.
- Egy Google-fiók, a Google Cloud Console-ban létrehozott projekt és API-kulcs. A Google a regisztrációnál számlázási adatokat és bankkártyát kér.
A Google Maps API-kulcs létrehozása
Szekció neve “A Google Maps API-kulcs létrehozása”- Nyisd meg a Google Cloud Console-t, és kattints a Get started for free gombra.
- Az 1. lépésben (Step 1 of 2) válaszd ki a Google-fiókodat és az országodat, majd kattints az Agree & continue gombra.
- A 2. lépés a számlázási oldal: töltsd ki az összes kötelező mezőt (az irányítószámot is), a Payment method részben add meg a kártyaadataidat, és kattints a Start free gombra.
- Válaszolj a rövid kérdőív két kérdésére, majd kattints a Next gombra.
- A keresőbe írd be: „Google Maps Platform”.
- Az API-kulcs elkészül. Másold ki, és kattints a Go to Google Maps Platform gombra.
- Nyisd meg az APIs & Services részt, keresd meg a Geocoding API szolgáltatást, és győződj meg róla, hogy be van kapcsolva.
- Ugyanígy kapcsold be a Maps JavaScript API szolgáltatást is.
A kulcs megadása a bővítményben
Szekció neve “A kulcs megadása a bővítményben”- Nyisd meg a Crocoblock → JetPlugins Settings oldalt, a JetElements csoportot, azon belül az Integrations aloldalt.
- A Google Maps blokkban illeszd be a kulcsot a Google Map API-kulcs mezőbe.
A kép tetején a Google Maps blokk látszik: a Map Provider, a kulcs mezője, a JS-fájl letiltásának kapcsolója, a Geocoding Provider és a külön geokódoló kulcs kapcsolója.
További beállítások ugyanebben a blokkban:
| Beállítás | Mit csinál |
|---|---|
| Map Provider | A térképszolgáltató: Google Maps, Leaflet vagy Mapbox |
| A Google Maps API JS fájl letiltása | Kapcsold be, ha a Google Maps JS-fájlt már betölti egy másik bővítmény vagy a sablon |
| Geocoding Provider | A címeket koordinátává alakító szolgáltatás: Google, OpenStreetMap, Photon vagy Bing |
| Separate Geocoding API key | Bekapcsolva külön kulcsot adhatsz meg a geokódoláshoz, így pontosabban korlátozhatod a kulcs használatát |
A Haladó térkép widget az oldalon
Szekció neve “A Haladó térkép widget az oldalon”- Nyisd meg az oldalt az Elementorral, és húzd a Haladó térkép widgetet a kívánt helyre.
- A Tartalom fül Térkép beállításai blokkjában válaszd ki a Térkép középpontjának típusa értékét, és add meg a Térkép középpontjának címe mezőben a címet. Az alapérték a London Eye.
- Állítsd be a többi beállítást, és szabd testre az oldalt.
- Kattints a Közzététel gombra.
A panel tetején a kulcs beállítására mutató megjegyzés van; alatta a középpont típusa és címe, a kezdeti nagyítás és a vezérlők.
| Beállítás | Mit csinál |
|---|---|
| Térkép középpontjának típusa | Koordináták, Cím vagy DMS Format of Coordinates |
| Térkép középpontjának címe | A térkép középpontja (cím megadásakor) |
| Kezdeti nagyítás | A térkép kezdeti nagyítási szintje (alapérték: 11) |
| Nagyítás az egér görgőjével | Az egérgörgővel nagyíthat-e a látogató (alapból Letiltva) |
| Nagyítási vezérlők | A nagyítógombok megjelenítése vagy elrejtése |
| Teljes képernyős vezérlő | A teljes képernyős gomb megjelenítése vagy elrejtése |
| Street View-vezérlők | A Street View gomb megjelenítése vagy elrejtése |
| Térképtípus-vezérlők (Térkép/Műhold) | A térkép és a műhold nézet közti váltó |
| Mozgatható a térkép? | A látogató húzással mozgathatja-e a térképet (alapból Igen) |
A widgetnek további blokkjai is vannak: Térkép stílusa és Jelölők.
Az eredmény ellenőrzése
Szekció neve “Az eredmény ellenőrzése”Nyisd meg a kész oldalt a nyilvános felületen: a térkép a megadott címet mutatja középpontként.
Készült: