Så här bäddar du in Google Maps på din webbplats – 3 enkla steg

Att bädda in Google Maps på din webbplats gör det enkelt för användare att få tillgång till platsinformation, visa en platsmarkör för en specifik adress och navigera med funktioner som vägbeskrivningar och gatuvy. Det stärker också din lokala SEO.

Bädda in Google Maps Manuellt via Kod

Följ stegen nedan för att bädda in Google Maps antingen manuellt eller via WordPress-widgetar. Så här fungerar det:

1. Öppna Google Maps
2. Klicka på Dela och Bädda in en karta och Kopiera inbäddningskoden
3. Klistra in inbäddningskoden i din webbplats HTML-kod

Steg 1: Öppna Google Maps

Gå till Inget översättbart innehåll i inmatningen. Sök efter din önskade plats i sökfältet. Du kan markera din företagsadress, visa en destination eller växla till satellitvy för mer detaljer.

Steg 2: Generera inbäddningskoden

1. Klicka på Dela ikon i kartgränssnittet.
2. I den Dela Fönster, välj fliken ”Infoga en karta”.
3. Kopiera det som tillhandahålls. Inbäddningskod (iframe).

Steg 3: Klistra in inbäddningskoden i din webbplats HTML-kod

1. Öppna din HTML-kod Redigera filen med valfri kodredigerare eller öppna din WordPress-sida och välj en HTML-widget.
2. Hitta det avsnitt där kartan ska visas och klistra in iframe-koden.
3. Spara ändringarna och uppdatera din webbsida för att se den inbäddade kartan.

Exempel på iframe-inbäddningskod:

Kopiera kodKopieratAnvänd en annan webbläsare<code id="dm-code-raw" class=" no-wrap language-markup"><iframe src="https://www.google.com/maps/embed?..." width="600" height="450" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe></code>

Gör kartan responsiv

För att säkerställa att kartan ser bra ut på alla skärmstorlekar kan du omsluta iframe-elementet i en behållare med CSS:

Kopiera kodKopieratAnvänd en annan webbläsare<code id="dm-code-raw" class=" no-wrap language-markup"><div style="position:relative; padding-bottom:56.25%; height:0; overflow:hidden;"> <iframe src="https://www.google.com/maps/embed?..." style="position:absolute; top:0; left:0; width:100%; height:100%; border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe> </div></code>

Infoga Google Maps med WordPress-sidbyggare

De flesta WordPress-sidbyggare, som Elementor, Divi eller WPBakery, inkluderar en Google Maps widget. Denna metod förenklar processen och eliminerar behovet av manuell kodning. Widgetar erbjuder ofta anpassningsalternativ som zoomnivåer, karttyp (standard, satellitvy osv.) och anpassning av markörer.

Till exempel i Elementor kan du bädda in en Google-karta genom:

1. Söker efter den Kartor widget
2. Dragningen av Kartor widget på din sida
3. Skriv in namnet på din verksamhetsplats

Som WordPress-användare kanske du också vill lära dig mer om Så här gör du SEO i WordPress!

Vanliga problem och felsökning

• Kartan visas inte: Dubbelkolla att iframe-koden har kopierats och klistrats in korrekt.
• API-nyckelproblem: Vissa avancerade funktioner kan kräva en API-nyckel för integration.
• Webbläsarbegränsningar: Se till att din webbplats tillåter iframes och inte har några konfliktande plugins eller skript.

Vanliga frågor

Kan jag bädda in Google Maps på min webbplats gratis?Ja, du kan bädda in Google Maps gratis med iframe-inbäddningskoden som tillhandahålls av Google Maps.

Påverkar inbäddningen av Google Maps din SEO?Ja, att bädda in Google Maps kan förbättra lokal sökmotoroptimering genom att tillhandahålla tydlig platsinformation och förbättra användarupplevelsen.

Slutsats

Att bädda in Google Maps är ett enkelt sätt att förbättra din webbplats. Oavsett om du väljer manuell kodning eller ett WordPress-widget ger du dina besökare värdefull platsinformation och förbättrar din webbplats funktionalitet. För WordPress-användare finns vår länkade handledning med steg-för-steg-instruktioner om hur man använder Google Maps-widgetar.

About the Author

Jonas Lindemann

I’m an experienced SEO professional with over a decade of helping over 100 businesses rank higher online, especially local businesses, e-commerce stores and SaaS. As the co-founder of LPagery, I specialize in practical, proven strategies for regular SEO and Local SEO success.

Detta inlägg kan innehålla affiliatelänkar som vi tjänar en provision på när en viss produkt köps.