Hoe Google-routes aan uw site toe te voegen

Als IT-expert laat ik je zien hoe je Google Routes toevoegt aan je website. Hierdoor kunnen uw bezoekers een routebeschrijving naar uw locatie krijgen, waar ze ook zijn. Eerst moet u een Google Maps API-sleutel maken. U kunt dit doen door naar de Google Developers Console te gaan en een nieuw project te maken. Nadat u een project heeft gemaakt, klikt u op de link 'API's inschakelen en beheren' en zoekt u vervolgens de 'Maps Embed API' en schakelt u deze in. Vervolgens heb je de code voor de Google Routes-widget nodig. U kunt deze code vinden door naar de Google Maps Embed API-pagina te gaan en de knop 'Code ophalen' te selecteren. Kopieer de code en plak deze in de HTML van uw website. Ten slotte moet u de volgende code aan uw website toevoegen om de widget weer te geven: Vervang 'YOUR_API_KEY' door de API-sleutel die je eerder hebt aangemaakt en 'Your+Destination' door het adres van je locatie. Sla je wijzigingen op en je bent klaar! Uw bezoekers kunnen nu overal ter wereld een routebeschrijving naar uw locatie opvragen.

Als je het wilt weten hoe u Google-routebeschrijvingen aan uw website kunt toevoegen lees dan dit bericht. Google Maps is het populairst digitale kaartservice Wereldwijd. Het gebruikt real-time verkeersinformatie om de beste route naar een bepaalde bestemming te vinden. Een Google-kaart insluiten naar uw blog of website helpt uw bezoekers uw locatie op een wereldkaart te zien, uw adres te zien en recensies te lezen (indien van toepassing). Hoewel u eenvoudig een kaart op uw website kunt insluiten met behulp van de unieke insluitcodegenerator van Google Maps, kunt u deze kaart niet gebruiken als navigatiehulpmiddel om uw bezoekers te helpen de weg naar uw locatie te vinden. In dit bericht laten we u zien hoe u Google Maps kunt gebruiken om een routebeschrijving aan uw bezoekers te tonen.

We zullen de volgende 2 methoden bekijken waarmee u kunt Google-routebeschrijving toevoegen aan uw website :

Voeg statische google map in en gebruik html-formulier om de kaartroute weer te geven
Gebruik de iFrame-kaartgenerator

Laten we deze methoden in detail bekijken.

1] Voeg een statische Google-kaart in en gebruik een HTML-formulier om de route van de kaart weer te geven.

Deze methode bestaat uit 2 stappen. Stap 1 - Inbedden statisch Google-kaart die uw exacte locatie aangeeft. Stap 2 is het toevoegen van een HTML-formulier dat de locatie van de gebruiker accepteert en een routekaart voor hen genereert op Google Maps. Laten we eens kijken hoe dit kan worden gedaan.

A] Google-kaart insluiten op uw website

Start uw browser.
open Google Maps in een nieuw browsertabblad.
Voer uw adres in de zoekbalk van Google Maps in de linkerbovenhoek in.
Selecteer een locatie in de lijst met resultaten die wordt weergegeven.
Opmerking: Als u uw adres niet kunt vinden, zoom dan in op Google Maps om het te volgen. U kunt Google Maps Street View-panorama's gebruiken om uw locatie op een kaart te markeren. Zodra u deze heeft gevonden, kunt u uw juiste adresgegevens invoeren met behulp van de opties 'Ontbrekende locatie toevoegen' of 'Uw bedrijf toevoegen' en vervolgens uw locatie ter verificatie indienen bij Google. Het wordt binnen enkele uren na het indienen van het verzoek toegevoegd.
Wanneer Google Maps verschijnt om uw exacte locatie te bepalen, klikt u op het pictogram Deel icoon.
Overschakelen naar Sluit een kaart in tabblad
druk op HTML kopiëren link om de kaartcode naar uw klembord te kopiëren. U kunt beslissen hoe groot of klein u de kaart op uw website wilt laten verschijnen door een vooraf gedefinieerd formaat te kiezen (klein, medium, groot) of door een aangepast formaat in te voeren.
Ga vervolgens naar het beheerderspaneel van uw site.
Open de webpagina waarop u de kaart wilt insluiten.
Schakel over naar de weergave van de code-editor.
Plak de code.
Verlaat de code-editor. U krijgt een voorbeeld van Google Maps te zien.

B] Gebruik een HTML-formulier om een navigatieroute op Google Maps te maken.

Keer terug naar de weergave van de code-editor.
Voeg de code uit de volgende afbeelding toe onder de Google Map-code:
Vervang de bestemmingsadreswaarde die in de afbeelding is gemarkeerd door het adres van uw locatie.
Verlaat de weergave van de code-editor.
Bekijk een voorbeeld van de code en controleer of deze werkt door een adres toe te voegen in het veld 'Voer een adres in' en op de knop te klikken Laat me de richting zien die ik moet gaan knop.
De bovenstaande stappen moeten traject weergeven van het ingevoerde adres naar uw locatie op Google Maps.
Als alles in orde is, dan kan dat Publiceren de code.

2] Gebruik de iFrame Map Generator

Start uw browser.
open Gratis HTML-kaartgenerator in een nieuw browsertabblad.
Voer uw adres in Voer uw adres in zoekveld in het linkerdeelvenster.
Uw locatie wordt weergegeven op Google Maps aan de rechterkant van het scherm. U kunt het kaarttype, de zoomafstand, de breedte of de hoogte instellen. U kunt de kaart ook responsief maken door op de schakelknop naast te klikken Maak de kaart responsief keuze.
Klik op HTML-code genereren knop hieronder.
De code verschijnt. druk op Kopieer de code naar het klembord knop.
Log in op het beheerderspaneel van uw site.
Open de pagina waar u de kaart wilt plaatsen.
Schakel over naar de weergave van de code-editor.
Plak de code.
Verlaat de code-editor.
Klik op Voorbeeld knop. Het kaartvoorbeeld verschijnt.
Klik op Routebeschrijving icoon.
Google Maps wordt geopend met uw adres vooraf ingevuld als uw bestemming.
Voer het startadres in. Je kan ook gebruiken Jouw locatie optie om Google Maps toe te staan uw huidige locatie te gebruiken.
De routekaart verschijnt.
Als alles goed werkt, Publiceren bladzijde.

Op deze manier kunnen uw bezoekers uw locatie bekijken op Google Maps die is ingesloten in uw website en een routebeschrijving van hun locatie naar die van u vinden. Ik hoop dat je dit bericht nuttig vindt. Laat het ons weten in de comments als je vragen hebt.

Lees ook: Beste Google Maps-alternatieven voor dagelijks gebruik.

Kan ik Google Maps aan mijn website toevoegen?

Ja, u kunt Google Maps toevoegen aan uw website of blog. met behulp van de Google Embed Code Generator of de gratis Google HTML Map Generator. . Met beide opties kunt u een Google-kaart insluiten die uw adres aangeeft met een rode bal, hoewel er een klein verschil is tussen beide. Terwijl u met de eerste een statische kaart kunt insluiten waarmee uw bezoekers uw exacte locatie, bezienswaardigheden in de buurt, enz. Kunnen zien, biedt de laatste Routebeschrijving een functie die een volledige routekaart maakt die ze kunnen gebruiken om een routebeschrijving naar uw locatie te vinden. Afhankelijk van uw behoeften kunt u elk van deze opties gebruiken om Google Maps aan uw website of blog toe te voegen.

Hoe kan ik de insluitcode van Google Maps krijgen?

De insluitcode van Google Maps verkrijgen is vrij eenvoudig. Open gewoon Google Maps in een nieuw tabblad in uw browservenster en voer uw adres in de beschikbare zoekbalk in. Wanneer Maps uw adres selecteert en weergeeft, klikt u op het pictogram Deel icoon. Klik in het deelvenster op de knop Sluit een kaart in tabblad Klik vervolgens op HTML kopiëren de link wordt weergegeven in de rechterbovenhoek. Dat is alles! U kunt ook op het menu (hamburgerpictogram) van Google Maps klikken en op het pictogram klikken Deel of sluit een kaart in keuze. Een andere manier om deze code te krijgen is via de gratis HTML Maps Generator (Maps iFrame Generator) zoals beschreven in methode 2 in het bericht hierboven.

Lees verder: De beste tips en trucs voor Google Maps om van u een professional te maken.