Pålitliga WordPress-handledningar, när du behöver dem som mest.
Nybörjarguide till WordPress
WPB Cup
25 miljoner+
Webbplatser som använder våra plugins
16+
År av WordPress-erfarenhet
3000+
WordPress-handledningar
av experter

Hur man lägger till Google Maps i WordPress (PÅ RÄTT SÄTT)

Det finns inget mer frustrerande för potentiella kunder än att vilja besöka ditt företag men inte kunna ta reda på var du finns. Vi har sett alltför många lokala företag förlora försäljning bara för att deras webbplats inte gjorde det enkelt för folk att hitta dem.

Därför bör varje lokal företagswebbplats inkludera en korrekt inbäddad Google Maps.

Vi har upptäckt att Google Maps kan göra en stor skillnad för hur dina besökare hittar ditt lokala företag. Det gör det mycket enklare för dem att lokalisera dig, och det kan verkligen förbättra den totala användarupplevelsen.

Vi kommer att visa dig det rätta sättet att lägga till Google Maps på din WordPress-webbplats. Det handlar inte bara om att släppa in någon gammal karta. Vi lär dig hur du gör det på rätt sätt så att den laddas snabbt, ser professionell ut och faktiskt hjälper ditt företag att hittas.

Lägg till Google Maps i WordPress

Varför lägga till Google Maps i WordPress?

Visste du att Google Maps är den mest populära navigeringsappen på alla plattformar?

Om du har en kontors- eller fysisk butiksadress, gör det att lägga till Google Maps på din WordPress-webbplats det enkelt för användare att snabbt hitta dina fysiska butiker, restauranger eller detaljhandelsbutiker. Detta hjälper dig att attrahera fler kunder och generera mer affärer.

Inte nog med det, men att bädda in Google Maps kan också förbättra din WordPress SEO. Enligt Google är 46% av alla sökningar lokala. Att lägga till Google Maps i WordPress kan förbättra din lokala SEO och öka din synlighet i lokala sökningar.

Nu finns det två sätt att bädda in Google Maps i WordPress, och vi visar båda.

Fördelen med den andra metoden är att den följer alla lokala SEO-bästa praxis, så om du använder den kommer Google att börja inkludera din plats på Google Maps. Den kommer också att visa din företagsinformation som namn, logotyp, adress, telefonnummer och öppettider i lokala sökresultat.

Med det sagt, låt oss se hur du kan lägga till Google Maps i WordPress. Nedan finns snabblänkarna som du kan använda för att gå till den sektion du föredrar:

  1. Hur man lägger till Google Maps i WordPress utan ett plugin
  2. How to Add Google Maps to WordPress With a Local SEO Plugin
    1. Vanliga frågor om Google Maps
    2. Expertguider för att använda kartor i WordPress

    Hur man lägger till Google Maps i WordPress utan ett plugin

    Om du bara snabbt vill bädda in Google Maps i ett WordPress-inlägg eller en sida, kan du använda standardmetoden med iFrame.

    Gå bara till Google Maps webbplats och skriv in en gatunamnsadress i sökområdet.

    Hitta platsen i Google Maps och klicka på Dela för att bädda in

    Därefter behöver du klicka på Dela-ikonen, och en popup visas med alternativet att antingen skicka en platslänk eller bädda in en karta.

    Du måste välja alternativet 'Bädda in en karta'.

    Kopiera Google Maps HTML-inbäddningskod

    Därefter kopierar du bara HTML-koden för Google Maps och öppnar sedan sidan där du vill bädda in kartan.

    Inne i blockredigeraren måste du lägga till ett anpassat HTML-block.

    Välj blocket Anpassad HTML i WordPress

    Nu kan du helt enkelt klistra in inbäddningskoden du kopierade från Google Maps.

    Därefter måste du uppdatera eller publicera sidan för att förhandsgranska ändringarna.

    Google Maps iFrame-inbäddningskod i Blockredigeraren

    Den här metoden fungerar för att snabbt bädda in Google Maps, men den ger dig inte maximal SEO-fördel.

    Om du driver ett litet företag, en restaurang eller en onlinebutik med antingen en eller flera fysiska platser, rekommenderar vi att du använder nästa lösning för att maximera dina lokala SEO-rankingar eftersom den använder korrekt open graph-data för att hjälpa dig att ranka högre på Google.

    Hur man lägger till Google Maps i WordPress med ett lokalt SEO-plugin

    Det bästa sättet att lägga till Google Maps och optimera din webbplats för lokal SEO är att använda All in One SEO (AIOSEO).

    Det är det bästa SEO-pluginet för WordPress eftersom det hjälper dig att få högre SEO-rankningar utan att redigera kod eller anlita en utvecklare. Över 3 miljoner proffs använder AIOSEO för att förbättra sina sökmotorrankningar.

    AIOSEO

    För den här handledningen kommer vi att använda AIOSEO Pro-versionen eftersom den inkluderar funktionen Lokal SEO och andra kraftfulla optimeringsalternativ. Det finns också en gratisversion av AIOSEO som du kan använda för att börja optimera din webbplats för sökmotorer.

    Först måste du installera och aktivera AIOSEO-pluginet i WordPress. För mer information, se vår handledning om hur man installerar ett WordPress-plugin.

    Vid aktivering startar pluginet installationsguiden. Du kan klicka på knappen ‘Låt oss komma igång’ för att konfigurera pluginet. Om du behöver hjälp, se vår guide om hur du korrekt ställer in All in One SEO i WordPress.

    AIOSEO installationsguide

    Därefter kan du gå till Allt i ett SEO » Lokal SEO från din WordPress-instrumentpanel.

    Klicka sedan på knappen 'Aktivera Lokal SEO' för att börja konfigurera de lokala inställningarna.

    Aktivera lokal SEO

    När Local SEO-tillägget för WordPress är aktiverat kan du lägga till en enskild plats eller flera platser i AIOSEO och visa dem på Google Maps. Vi visar dig hur du lägger till båda på din webbplats.

    Lägga till en enskild plats

    För att lägga till dina platser, företagsinformation, öppettider och mer, måste du först gå till All in One SEO » Local SEO och öppna fliken 'Locations'.

    Om du har en enda fysisk plats, behåll alternativet 'Flera platser' inställt på Nej.

    Fliken Plats under lokalt SEO

    Därefter skrollar du ner till avsnittet 'Kartor' för att fästa din exakta plats.

    Ange bara din adress i fältet ‘Ange en fråga’, så visar Google Maps din plats.

    Markera din butiksplats

    När du har angett din plats, glöm inte att klicka på knappen 'Spara ändringar'.

    Lägga till flera platser

    Om du har mer än en fysisk plats måste du aktivera inställningen 'Flera platser' i fliken 'Plats' i Lokal SEO.

    Aktivera flera platser

    Därefter kommer en ny meny för Platser att visas i din WordPress-administrationspanel.

    Gå vidare och navigera till Platser och klicka sedan på knappen 'Lägg till ny'.

    Lägg till en ny plats

    När du är i WordPress-redigeraren, scrolla ner till sektionen 'Karta'.

    Här kan du ange din adress i fältet ‘Ange en fråga’.

    Lägg till flera kartplatser

    Efter att ha angett din plats på kartan och lagt till platsinformation, fortsätt och klicka på knappen 'Publicera'.

    Du kan nu upprepa detta steg och lägga till så många platser som du vill för ditt företag.

    När du har lagt till dina platser kan du gå till fliken 'Kartor' tillbaka i menyn All in One SEO » Local SEO.

    Här måste du ange en Google Maps API-nyckel.

    Ange Google Maps API-nyckel

    Nu ska vi se hur man skapar en API-nyckel för Google Maps.

    Skapa en Google Maps API-nyckel

    För att börja måste du besöka webbplatsen Google Maps Platform och klicka på knappen ‘Kom igång’.

    Google Maps-plattform

    Efter att ha loggat in med ditt Google-konto måste du konfigurera ett faktureringskonto.

    Google Maps Platform har en prissättning per användning, och de erbjuder de första 300 USD i månatlig användning gratis för alla användare. För de flesta webbplatser kommer det lätt att täcka en enkel kartinbäddning som den vi skapar i den här handledningen.

    Oroa dig inte, de kommer inte att debitera dig några avgifter om du inte manuellt uppgraderar till ett betalkonto.

    För att komma igång, klicka på knappen ‘Skapa faktureringskonto’.

    Skapa ett faktureringskonto

    Därefter kan du välja ditt land och välja det som bäst beskriver din organisation från rullgardinsmenyn.

    När du har valt denna information klickar du på kryssrutan för användarvillkor och sedan på knappen 'Fortsätt'.

    Ange personliga uppgifter för faktureringskonto

    På nästa skärm måste du ange ditt telefonnummer för verifiering.

    När du har gjort det klickar du på knappen 'Skicka kod'.

    Ange mobilnummer

    Efter att ha verifierat koden är nästa steg att ange ditt företagsnamn, betalningsmetoduppgifter och faktureringsadress.

    När du har angett dessa uppgifter klickar du på knappen ‘Starta min kostnadsfria provperiod’.

    Ange företagsnamn och betalningsuppgifter

    Därefter kommer du att få svara på en serie av 4 frågor om din organisation och hur du kommer att använda Google Maps Platform.

    Google Maps kommer att fråga om ditt primära mål för att använda plattformen, vilken bransch du tillhör, välja ett användningsfall och din företagsstorlek.

    Efter att ha besvarat dessa frågor, fortsätt och klicka på knappen 'Skicka'.

    Svara på några frågor för Google Maps

    Du kommer nu att se ett popup-fönster med din Google Maps API-nyckel.

    Du kan kopiera och spara den här nyckeln i en textfil för framtida bruk.

    Kopiera API-nyckeln

    Nu när du har skapat en Google Maps API-nyckel måste du gå tillbaka till din WordPress-instrumentpanel för att ange den i AIOSEO Local SEO-inställningar.

    Konfigurera Google Maps-inställningar i WordPress

    Du kan nu gå tillbaka till Allt i ett SEO » Lokal SEO från din WordPress-instrumentpanel och sedan navigera till fliken 'Kartor'.

    Ange din Google Maps API-nyckel i fältet 'API-nyckel'. Du kommer att se en förhandsgranskning av kartan i AIOSEO så snart du lägger till nyckeln.

    Ange API-nyckel och se kartförhandsgranskning

    Därefter kan du skrolla ner för att redigera kartinställningarna.

    AIOSEO låter dig visa Google Maps med hjälp av ett Gutenberg-block, kortkod, widget, eller PHP-kod. Det låter dig också välja olika kartstilar och lägga till en anpassad markör till din karta.

    Redigera kartinställningar

    Glöm inte att klicka på knappen 'Spara ändringar' när du är klar.

    Visa Google Maps i WordPress

    Därefter kan du lägga till Google Maps i vilket WordPress-inlägg eller sida som helst. För att börja, redigera helt enkelt eller lägg till en ny sida på din webbplats.

    När du väl är i blockredigeraren, klickar du på '+' -knappen högst upp och lägger till AIOSEO Local – Map-blocket var som helst på sidan.

    Lägg till lokal kartblock

    Därefter kommer din Google Map att läggas till på sidan.

    AIOSEO låter dig också redigera kartinställningarna från alternativen till höger. Du kan till exempel visa etiketter och ikoner, lägga till en anpassad markör och redigera kartans bredd och höjd.

    Redigera din karta i WordPress

    Om du har flera platser kan du välja vilken plats du vill markera genom att välja bland de alternativ som ges i menyn till höger.

    Klicka helt enkelt på rullgardinsmenyn 'Plats' och välj din föredragna plats att visa på din webbplats.

    Välj vilken plats som ska visas

    När du är nöjd med dina inställningar, fortsätt och publicera sidan.

    Nu kan du besöka din webbplats för att se Google Maps i praktiken.

    Förhandsgranska din karta

    Du kan också lägga till Google Maps i din webbplats widgetsektion, som sidofältet eller sidfoten.

    För att börja, gå till Utseende » Widgetar från din WordPress-adminpanel. Klicka sedan på '+'-knappen och lägg till widgetblocket 'AIOSEO Lokal – Karta' där du vill visa din plats.

    Lägg till kartwidget

    Därefter kan du redigera widgetinställningarna.

    Du kan till exempel lägga till en titel, ändra kartans bredd och höjd, välja vilken plats som ska visas om du har flera platser och redigera etiketten.

    Redigera inställningar för kartwidget

    Det var allt!

    Nu när du uppdaterar din webbplats kommer du att se Google Maps i ditt widgetområde.

    Kartförhandsgranskning i widgetområdet

    Vanliga frågor om Google Maps

    Här är några av de vanligaste frågorna vi får om att lägga till Google Maps på WordPress-webbplatser. Dessa bör hjälpa till att klargöra eventuell förvirring och ge dig självförtroende att lägga till kartor på din egen webbplats.

    1. Behöver jag en Google API-nyckel för att bädda in Google Maps i WordPress?

    Ja, Google kräver en API-nyckel för att de flesta kartinbäddningar ska fungera korrekt. Även om vissa grundläggande inbäddningar kan fungera utan en initialt, kommer du troligen att stöta på problem eller begränsningar. Att skaffa en API-nyckel är gratis för de flesta små till medelstora webbplatser, och vi visar dig hur du ställer in den i vår guide.

    2. Kommer Google Maps att sakta ner min WordPress-webbplats?

    Google Maps kan påverka din webbplats hastighet om den inte implementeras korrekt. Men när du följer de korrekta metoderna vi beskriver är påverkan minimal. De flesta moderna teman och plugins hanterar kartladdning effektivt, och du kan också använda lazy loading för att säkerställa att kartor bara laddas när besökare scrollar till den sektionen.

    3. Kan jag anpassa utseendet på min Google Map på WordPress?

    Absolut! Du kan anpassa färger, ta bort vissa element, lägga till egna markörer och till och med skapa helt egna kartstilar. Många WordPress-kartplugins erbjuder inbyggda anpassningsalternativ, eller så kan du använda Googles stylingguide för att skapa en karta som matchar ditt varumärke.

    4. Är det bättre att använda ett plugin eller bädda in Google Maps direkt?

    För de flesta WordPress-användare rekommenderar vi att använda ett dedikerat kartplugin. Plugins erbjuder fler anpassningsmöjligheter, bättre prestandaoptimering och enklare hantering. Direkt inbäddning fungerar, men plugins ger vanligtvis en mer användarvänlig upplevelse och ytterligare funktioner som flera platser och anpassad styling.

    5. Hur mycket kostar det att använda Google Maps på min WordPress-webbplats?

    Google Maps är gratis för de flesta små till medelstora webbplatser. Google erbjuder 200 USD i gratis månatlig användning, vilket täcker cirka 28 000 kartladdningar eller 40 000 vägbeskrivningsförfrågningar. De flesta lokala företagswebbplatser kommer inte att överskrida dessa gränser, vilket gör det i princip gratis att använda.

    6. Kan jag lägga till flera företagsplatser på en Google Maps?

    Ja, du kan definitivt lägga till flera platser på en enda karta. Detta är perfekt för företag med flera filialer eller serviceområden. De flesta WordPress-kartplugins gör det enkelt att lägga till flera markörer, och du kan anpassa varje plats med olika information, färger och ikoner.

    Expertguider för att använda kartor i WordPress

    Nu när du vet hur du lägger till Google Maps på din webbplats, kanske du vill se några andra guider relaterade till kartor och platser i WordPress.

    Vi hoppas att den här artikeln hjälpte dig att lära dig hur du lägger till Google Maps på din WordPress-webbplats. Du kanske också vill se våra val för de bästa Mapbox WordPress-plugins för småföretag och lära dig hur man lägger till en Google Maps butikslokalisering i WordPress.

    Om du gillade den här artikeln, prenumerera då på vår YouTube-kanal för WordPress-videoguider. Du kan också hitta oss på Twitter och Facebook.

    Upplysning: Vårt innehåll stöds av läsarna. Det innebär att om du klickar på några av våra länkar kan vi tjäna en provision. Se hur WPBeginner finansieras, varför det är viktigt och hur du kan stödja oss. Här är vår redaktionella process.

    Det ultimata WordPress-verktyget

    Få GRATIS tillgång till vår verktygslåda - en samling WordPress-relaterade produkter och resurser som alla proffs bör ha!

    Läsarnas interaktioner

    38 CommentsLeave a Reply

    1. Mycket användbart. Vid mitt första försök kunde jag lägga in min karta.
      Tack så mycket

    2. tack för den här välförklarade guiden! Jag har dock ett problem som jag behöver hjälp med. En av mina webbplatser har en mörk design eftersom det är så temat är designat och kodat. Jag använder också Google Maps ganska ofta, och jag vet att det finns en mörk version tillgänglig.

      finns det ett sätt att lägga till mörka läget-versionen av Google Maps på min webbplats istället för den vanliga versionen? Jag vill bara att kartan ska matcha min webbplats mörka tema.

      • För tillfället har vi ingen rekommenderad enkel metod för att ändra kartan till dess mörka variant i inbäddningar. Om det ändras kommer vi definitivt att dela med oss!

        Admin

    3. Det här är verkligen ett tids- och resursbesparande inlägg för mig eftersom jag letade efter ett minimalt sätt att lägga till en Google Maps-adress på en av mina kunders webbplatser och var inte säker på hur jag skulle göra det.
      Båda metoderna utan plugin och med AIOSEO är bra och uppfyller mina behov.
      Men jag skulle välja AIOSEO för att implementera den här funktionen eftersom det också hjälper till med lokal SEO.
      Tack för den här hjälpsamma guiden för att bädda in Google Maps.

    4. Hej, vet du hur man döljer det 13px vita utrymmet längst ner på den inbäddade Google Maps-kartan?
      Tack på förhand
      Melanie

    5. Jag har en Google Maps på min webbplats, men nålen som läggs till på kartan är inte klickbar. Nålen visar bara adressen men den dirigerar inte om du klickar på den. Är det möjligt att göra en klickbar ikon?

    6. Måste man inte skaffa ett API från Google innan man kan använda ett kartplugin och infoga det i pluginet? Det har varit min erfarenhet på senare tid.

      • Hej, jag försöker infoga en Google Maps på min webbplats (Wordpress), den försvinner hela tiden. Har jag rätt i att tro att Google nu vill ha 200 dollar i månaden för detta eller vad kostnaden nu är, eller kan jag fortfarande infoga en karta gratis?

        • Google tar nu betalt för storskalig användning av sitt kart-API, vilket är vad pluginet körs på. De 200 dollar du troligen såg var den kostnadsfria månatliga krediten som Google ger till dem som använder sitt API, så att mindre webbplatser inte debiteras.

          Admin

          • Ja, det stämmer, men det finns ett alternativ till Google Maps API. OSMapper är pluginet som använder Open Street Maps API som inte kräver några API-nycklar och det finns ingen gräns för användning. Du kan installera det från Wordpress.org.

          • Även om vi inte har testat det ännu, kommer vi definitivt att titta på det.

    7. Jag provade det första steget: kopiera HTML:en efter att ha gått till inbäddningsknappen och klistrat in den i textversionen av inlägget. Jag gick till den visuella och såg den inbäddade Google-kartan. Jag sparade den och webbplatsen tar bort kartan. De ändrade texterna finns kvar, men kartan försvinner hela tiden. Det upprepas varje försök. Varför händer det?

    8. Bra handledning – kort och koncis. Jag hade provat två andra plugins som min klient inte gillade. Tack för informationen om manuell inbäddning. Fungerade perfekt och snabbt.

      Tusen, tusen tack för den här handledningen.
      Sara

    9. Bästa Herr/Fru,

      Jag skulle vilja ändra Google Maps-adressen & är inte säker på var jag ska hitta den här inbäddade länken för att uppdatera WP-backend. Jag kunde inte hitta den i kontaktmenyn för att hitta den.

      Sök ditt vänliga råd om det!

      Tack!

      Rdgs,
      Denny Png

    10. Tack! Det här var precis vad jag letade efter! Perfekt för mitt reseinlägg på min blogg! Videon är jättebra och väldigt hjälpsam!

    11. Jag skulle gärna vilja göra detta men när jag går in på Google Maps och skriver in adressen finns det absolut ingen kugghjul så jag kan inte ens få en länk att kopiera för WordPress. Några idéer eller förslag?

      • Jag har exakt samma problem. Det finns ingen blomma på Google Maps längre! Så hur fungerar detta?

    12. Hej!
      Jag kan inte hitta koden.. Det finns ingen "blomsterikon" eller andra länkar längst ner till höger på kartan. Beror det på att platsen jag försöker lägga till inte har en gatuadress, utan bara koordinater?
      Tack på förhand.

    13. Finns det något sätt att få den här kartan som bakgrund till en sida med full längd, säg bredd 100% och höjd 100% något sådant??

    14. Tack så mycket! Varför skulle någon bry sig om ett plugin som kan sakta ner deras webbplats när du har gett så enkla instruktioner för att hämta koden från Google Maps?

      Förresten, om någon har problem med att hitta koden. När du ser kartan, gå till det nedre högra hörnet och klicka på blomikonen och klicka på “Dela och bädda in karta”. Klicka sedan på “Bädda in karta” och ange på din WP-sida/eller inlägg.

    15. Hej, jag undrade om det är möjligt att få Google Maps att visa platsen för grupper (Buddypress)?
      Tack för din hjälp.

    16. hej sir,

      Jag vill använda ett plugin som ger exakt plats. Kan du ge mig ett förslag? Jag använder MapPress, Leaflet Market, WP Google Maps etc. plugins men har fortfarande ingen lycka. Alla dessa plugins visar en plats som ligger långt från min exakta plats. Jag vill ha den exakta platsen där min butik ligger. Snälla hjälp mig. Eller finns det något sätt att utveckla en anpassad karta och lägga den på en WordPress-sida? Vänligen ge en steg-för-steg-procedur.

      Tack & Hälsningar,
      aamir

    17. Tack för att du tog dig tid att skriva den här artikeln. Den är mycket hjälpsam. Är det möjligt att lägga till en Google Maps som är länkad med Google Places?

    18. Mycket bra. Men när vi använder koordinater fungerar inte lightbox-kartan rätt. Den visar bara någon plats i USA. Hur kan jag fixa detta?

      Tack

    19. Tack för alla informativa WP-artiklar du publicerar.

      Är det möjligt att lägga till en Google Map på en webbplats som

      1. lägger automatiskt till platsen för alla besökare eller kommentatorer på en karta
      och
      2. tillåter att alla kunder läggs till, förmodligen manuellt, även om ett automatiskt alternativ vore bra också. Jag har en liten e-handelssida med kunder över hela världen och tänkte att det vore roligt att visa vart vi har skickat saker till.

      • Tack så mycket!

        Jag har redan grundat (MapPress Easy Google Maps) och det är en trevlig plugin.
        Och naturligtvis är din uppmärksamhet mycket trevlig support. TACK!!!
        En sak till, snälla.
        Jag skulle vilja använda dessa kartor i flikar men den enda flikens (kortkod) plugin jag har hittat hittills som visar kartor är (Jshortcode). (Jag menar att den visas i andra eller tredje fliken. De andra visas inte i andra eller tredje fliken.) Det är också en trevlig plugin men har väldigt färgglada flikar.
        Kanske skulle du vara så vänlig att ge råd om några andra plugins för att lösa detta problem.

        Tack på förhand
        Med vänliga hälsningar
        Zakaria

    Lämna ett svar

    Tack för att du väljer att lämna en kommentar. Tänk på att alla kommentarer modereras enligt vår kommentarspolicy, och din e-postadress kommer INTE att publiceras. Använd INTE nyckelord i namn fältet. Låt oss ha en personlig och meningsfull konversation.