Vil du lage et kart med flere steder i WordPress med Elementor og essensielle tillegg?

Anta at du har en bedrift som allerede har flere filialer i byen, og du vil lage et digitalt kart som viser plasseringen til disse filialene. Hvis du har et WordPress-basert nettsted, kan du enkelt lage et slikt kart. Det er en flott plugin du kan bruke til å lage et kart med flere steder: Viktige tillegg.

Viktige tillegg er et tillegg Elementor premium, så du må også installere Elementor før du kan bruke den. Du kan bruke gratisversjonen av Elementor til å lage et kort med modulen Essential Addons.

La gratis versjon av Essential Addons er også tilgjengelig. Widgeten for å lage et kart er imidlertid bare tilgjengelig på den betalte versjonen. Du kan laste ned den betalte versjonen av Essential Addons på den offesiell nettside.

Vi vil bruke Google Maps-plattformen til å lage et kart på WordPress ved å bruke Essential Addons. Før du starter, sørg for å installere Elementor og Essential Addons.

Integrer Google Maps med modulen Essential Addons

Før du kan legge til et Google Maps-kart med Essential Addons, må du først integrere dem. Du trenger en API-nøkkel for å integrere Google Maps med Essential Addons-moduler.

Først, besøk Google API-konsoll og logg på med Google-kontoen din. Opprett et nytt prosjekt ved å klikke på rullegardinmenyen øverst og klikke på NYTT PROSJEKT.

Gi ditt nye prosjekt et navn og klikk på knappen CREATE .

lag et kart med flere steder med Elementor og Essential Addons

Når ditt nye prosjekt er opprettet, velg det fra rullegardinmenyen og klikk på Bibliotek på venstre panel.

lag et kart med flere steder med Elementor og Essential Addons

Google deler Google Maps Platform API inn i 17 typer. Du kan se dem ved å klikke på lenken VIS ALLE i seksjonen Cartes. Du må aktivere APIer avhengig av hva du ønsker å oppnå.

Oppdag også: Hvordan lage en tilpasset enkeltproduktmal i WooCommerce med Elementor

I vårt tilfelle må du aktivere følgende API-er for å legge til et kart fra Google Maps ved hjelp av Essential Addons.

  • API-veiledninger
  • API for geokoding
  • Maps JavaScript API
  • API-seter

For å aktivere en API, velg en API du vil aktivere (ved å klikke på den) og klikk på knappen AKTIVER.

lag et kart med flere steder med Elementor og Essential Addons

Når du har fullført aktiveringen av de nødvendige API-ene, går du tilbake til hovedoversikten til Google API-konsollen og klikker på identifikatorer på venstre panel. Klikk på knappen Opprett legitimasjon og velg API-nøkkel. Kopier API-nøkkelen på popup-vinduet som vises.

Logg inn på WordPress-dashbordet og klikk Viktige tillegg på venstre panel. Klikk på fanen Elements og bla nedover i delen Avansert Google Map. Klikk på innstillinger og lim inn API-nøkkelen du nettopp kopierte.

Klikk på knappen LAGRE INNSTILLINGER for å bruke den nye endringen.

Begynn å lage kartet

Når Google Maps og Essential Addons er integrert, kan du begynne å lage kartet. For å gjøre dette, lag en ny side (Sider – > Legg til ) eller et nytt element (Elementer – > Legg til) og rediger den med Elementor.

lag et kart med flere steder med Elementor

Før du oppretter siden, angi layout ved å klikke på tannhjulikonet i nedre venstre hjørne for å åpne Innstillinger-panelet. Angi oppsettet fra rullegardinmenyen.

Opprett en ny seksjon ved å klikke på plussknappen i redigeringsboksen. Hvis du vil ha et bredere område for kartet, kan du velge strukturen med en enkelt kolonne. Dra widgeten EA Google Maps fra venstre panel til redigeringsområdet.

lag et kart med flere steder med Elementor og Essential Addons

Gå til venstre panel og still inn korttypen til flermarkør.

lag et kart med flere steder med Elementor og Essential Addons

Åpne seksjonen Kartmarkørinnstillinger og klikk på den eksisterende kartmarkøren for å redigere den. Lim inn bredde- og lengdegraden til det første stedet du vil legge til på kartet. Angi også tittelen og beskrivelsen.

lag et kart med flere steder med Elementor

For å få bredde- og lengdegraden til en plassering, åpne Google Maps og søk etter plasseringen (stedet) hvis breddegrad og lengdegrad du vil ha. Når du er funnet, klikk med høyre museklikk og venstreklikk på nummeret som vises på kontekstmenyen.

Denne handlingen lar deg derfor kopiere breddegraden (den første verdien) og lengdegraden (den andre verdien).

Når du er ferdig med å legge til breddegrad og lengdegrad for den første plasseringen, klikker du på knappen LEGG TIL ET ELEMENT for å legge til en annen plassering på kartet.

lag et kart med flere steder med Elementor

Åpne Google Maps igjen og finn den nye plasseringen du vil legge til kartet og kopier lengdegraden samt lengdegraden og lim dem inn i de respektive feltene som det ovenfor. Gjenta trinnene ovenfor for å legge til flere steder på kartet.

Les også: Slik bruker du Elementors innleggswidget

Når du er ferdig med å legge til lokasjoner, åpner du blokken Kartkontroller for å aktivere/deaktivere kommandoene du vil gi på kortet ditt. Du kan også stille inn zoomnivået her.

lag et kart med flere steder med Elementor

Du kan også åpne blokken Karttema for å velge Google Maps-temaet du vil bruke.

lag et kart med flere steder med Elementor og Essential Addons

Så langt har du laget et kart med flere steder. Du kan åpne fanen Stil for å definere høyden så vel som bredden på kartet.

lag et kart med flere steder med Elementor

Hvis du vil ha et kart i full bredde, setter du delen som inneholder kartet til full bredde. For å gjøre dette, klikk på håndtaket til delen.

lag et kart med flere steder med Elementor og Essential Addons

I fane og blokk layout sett Innholdsbredde til full bredder og kolonnegapet på Ingen avvik

lag et kart med flere steder med Elementor

Klikk på knappen PUBLISERTER nederst i venstre panel for å publisere siden din.

Bygg inn kartet i en side eller et innlegg

Hvis du av en eller annen grunn foretrekker å legge inn kartet ditt på en side/innlegg (siden/innlegget som er opprettet med standard WordPress — Gutenberg) editor, kan du bruke WordPress Plugin Elementor -blokker for Gutenberg. Dette pluginet vil konvertere en Elementor-mal til en Gutenberg-blokk.

For å lagre kartet du nettopp opprettet som en Elementor-mal, klikk på pilikonet ved siden av knappen PUBLISERE / OPPDATERE og velg Lagre som mal.

lag et kart med flere steder med Elementor og Essential Addons

Gi modellen et navn og klikk på knappen REGISTRERE.

lag et kart med flere steder med Elementor og Essential Addons

Deretter oppretter du en ny side eller et nytt innlegg (sørg for at du har installert Elementor-plugin Blokker for Gutenberg). Legg til en ny blokk og velg Elementor bibliotek og velg malen du nettopp opprettet.

lag et kart med flere steder med Elementor

Merk: Hvis du ser meldingen «Bare for utviklingsformål» når du legger til et kort, må du sørge for å aktivere Google Cloud-fakturering. De nye Google-retningslinjene krever at utviklere aktiverer faktureringskontoen (du kan fortsatt bruke Google Maps API gratis).

Skaff deg Elementor Pro nå!!!

konklusjonen

Så! Det er det for denne artikkelen som viser deg hvordan du lager et kart med flere steder med Elementor. Hvis du har noen bekymringer om hvordan du kommer deg dit, gi dem beskjed i commentaires.

Du kan imidlertid også konsultere ressursene våre, hvis du trenger flere elementer for å gjennomføre prosjektene dine med oppretting av nettsteder, ved å konsultere vår guide om WordPress blog oppretting eller den på Divi: tidenes beste WordPress-tema.

Men i mellomtiden, del denne artikkelen på de forskjellige sosiale nettverkene dine.

...