Mühelose Navigation mit umfangreichen Menüoptionen
Visuelle Produktauswahl steigert schnell den Umsatz
Personalisierte Inhalte passen sich in Echtzeit an
Nahtloser Bildlauf für besseren UX-Flow
Sofortige Vervielfältigung von Inhalten spart Zeit
Schneller Zugriff auf leistungsstarke Designelemente
Vorgefertigte Vorlagen beschleunigen die Gestaltung
Erweiterte benutzerdefinierte Felder für flexible Daten
Websites einfach und problemlos klonen
Gestochen scharfe, skalierbare Grafiken für alle Bildschirme
Rebranding von Werkzeugen für ein professionelles Aussehen
Inhalte präzise ein- und ausblenden
Fesselnde Tiefe mit sanfter Bewegung
Einfaches Hinzufügen von Notizen und Kommentaren
Hilfreiche Hinweise verbessern die Benutzerinteraktion
Elemente mit stilvollem Flair animieren
Wichtige Abschnitte immer sichtbar halten
Vollständige Kontrolle mit benutzerdefinierten Code-Optimierungen
Optimieren Sie Dateien, um die Geschwindigkeit der Website zu erhöhen
Ausgearbeitete Seitenvorlagen, die Ihnen den Einstieg in Ihre Landing Page erleichtern, indem Sie einfach ein Einstiegsdesign einfügen
Ready Blocks enthält eine Vielzahl von Layouts und Designelementen, wie Kopf- und Fußzeilen, Widgets usw.
Vorgefertigte Kopfzeilen mit lukrativen Stilen, die für verschiedene Nischenwebsites und Designvorlieben geeignet sind
Eine hilfreiche Sammlung von Fußzeilendesigns, mit denen Sie sofort eine attraktive Fußzeile für Ihre Landing Page erstellen können
Wir sind 24/7 für Sie da. Wir helfen Ihnen gerne.
Detaillierte Anleitungen für jede Funktion bei BdThemes verfügbar
Lernen Sie etwas Neues, bleiben Sie informiert über WordPress, Webdesign und mehr
Hier sind einige der wichtigsten Meilensteine in meiner Entwicklung:
Lernen Sie in unseren Videos die Verwendung von Produkten sowie Tipps und Tricks zu WordPress
Verdienen Sie saftige Provisionen, indem Sie sich an der Aktion beteiligen
Widget Idea Share ist eine gute Möglichkeit, ähnliche Widgets zu finden, die Sie verbessern können.
Gewiss! Wenn Sie sich mit uns in Verbindung setzen möchten, können Sie sich gerne an uns wenden
Erstellen Sie jedes WordPress-Formular in wenigen Minuten mit Sigma Forms.
Coming Soon & Wartungsmodus Page Builder Plugin
Websites mit One Accessibility leicht zugänglich machen
Zeigen Sie Erfahrungsberichte von Kunden an, um das Vertrauen und die Glaubwürdigkeit zu erhöhen.
Zoloblocks hilft bei der Erstellung beeindruckender Gutenberg-basierter Websites.
Der beste Slider in der Ära der Elementor Slider
Die einzigen kompatiblen Blogging-Widgets in Elementor für jeden Blog
Erstellen Sie eine WordPress-eCommerce-Website der nächsten Generation für Unternehmen
Organisieren Sie Ihre Fotos jedes Mal in einem anderen Engel mit Elementor
Steigern Sie das Engagement und den Umsatz mit Spin Wheel.
Leistungsstarkes AI Image Generator Plugin für WordPress von ChatGPT
Holen Sie sich 360° Augmented Reality für WooCommerce noch heute!
Kopieren und Einfügen eines beliebigen Webdesigns mit nur 2 Klicks!
Ein voll funktionsfähiges Theme für elementor mit unbegrenzten Optionen
Intelligentes, sauberes und flexibles Block-Theme für Gutenberg
Das Dark Reader Plugin sorgt für augenfreundliches Lesen im Internet.
WooCommerce einseitige Kasse zur Steigerung der Konversionen.
Find Nearby Stores Instantly with Sigma Store Locator
The Ultimate WordPress Media Library Organizer
Zugang zu über 100 Premium-WordPress-Plugins mit lebenslangen Updates und speziellem Support.
Mühelose Navigation mit umfangreichen Menüoptionen
Visuelle Produktauswahl steigert schnell den Umsatz
Personalisierte Inhalte passen sich in Echtzeit an
Nahtloser Bildlauf für besseren UX-Flow
Sofortige Vervielfältigung von Inhalten spart Zeit
Schneller Zugriff auf leistungsstarke Designelemente
Vorgefertigte Vorlagen beschleunigen die Gestaltung
Erweiterte benutzerdefinierte Felder für flexible Daten
Websites einfach und problemlos klonen
Gestochen scharfe, skalierbare Grafiken für alle Bildschirme
Rebranding von Werkzeugen für ein professionelles Aussehen
Inhalte präzise ein- und ausblenden
Fesselnde Tiefe mit sanfter Bewegung
Einfaches Hinzufügen von Notizen und Kommentaren
Hilfreiche Hinweise verbessern die Benutzerinteraktion
Elemente mit stilvollem Flair animieren
Wichtige Abschnitte immer sichtbar halten
Vollständige Kontrolle mit benutzerdefinierten Code-Optimierungen
Optimieren Sie Dateien, um die Geschwindigkeit der Website zu erhöhen
Ausgearbeitete Seitenvorlagen, die Ihnen den Einstieg in Ihre Landing Page erleichtern, indem Sie einfach ein Einstiegsdesign einfügen
Ready Blocks enthält eine Vielzahl von Layouts und Designelementen, wie Kopf- und Fußzeilen, Widgets usw.
Vorgefertigte Kopfzeilen mit lukrativen Stilen, die für verschiedene Nischenwebsites und Designvorlieben geeignet sind
Eine hilfreiche Sammlung von Fußzeilendesigns, mit denen Sie sofort eine attraktive Fußzeile für Ihre Landing Page erstellen können
Wir sind 24/7 für Sie da. Wir helfen Ihnen gerne.
Detaillierte Anleitungen für jede Funktion bei BdThemes verfügbar
Lernen Sie etwas Neues, bleiben Sie informiert über WordPress, Webdesign und mehr
Hier sind einige der wichtigsten Meilensteine in meiner Entwicklung:
Lernen Sie in unseren Videos die Verwendung von Produkten sowie Tipps und Tricks zu WordPress
Verdienen Sie saftige Provisionen, indem Sie sich an der Aktion beteiligen
Widget Idea Share ist eine gute Möglichkeit, ähnliche Widgets zu finden, die Sie verbessern können.
Gewiss! Wenn Sie sich mit uns in Verbindung setzen möchten, können Sie sich gerne an uns wenden
Erstellen Sie jedes WordPress-Formular in wenigen Minuten mit Sigma Forms.
Coming Soon & Wartungsmodus Page Builder Plugin
Websites mit One Accessibility leicht zugänglich machen
Zeigen Sie Erfahrungsberichte von Kunden an, um das Vertrauen und die Glaubwürdigkeit zu erhöhen.
Zoloblocks hilft bei der Erstellung beeindruckender Gutenberg-basierter Websites.
Der beste Slider in der Ära der Elementor Slider
Die einzigen kompatiblen Blogging-Widgets in Elementor für jeden Blog
Erstellen Sie eine WordPress-eCommerce-Website der nächsten Generation für Unternehmen
Organisieren Sie Ihre Fotos jedes Mal in einem anderen Engel mit Elementor
Steigern Sie das Engagement und den Umsatz mit Spin Wheel.
Leistungsstarkes AI Image Generator Plugin für WordPress von ChatGPT
Holen Sie sich 360° Augmented Reality für WooCommerce noch heute!
Kopieren und Einfügen eines beliebigen Webdesigns mit nur 2 Klicks!
Ein voll funktionsfähiges Theme für elementor mit unbegrenzten Optionen
Intelligentes, sauberes und flexibles Block-Theme für Gutenberg
Das Dark Reader Plugin sorgt für augenfreundliches Lesen im Internet.
WooCommerce einseitige Kasse zur Steigerung der Konversionen.
Find Nearby Stores Instantly with Sigma Store Locator
The Ultimate WordPress Media Library Organizer
Zugang zu über 100 Premium-WordPress-Plugins mit lebenslangen Updates und speziellem Support.
Die Einbettung von Google Maps auf Ihrer Webseite ist sehr nützlich für Online-Shops und Geschäfte. Zum einen hilft es den Leuten, Sie zu erreichen, zum anderen können Sie Ihren Shop weltweit bekannt machen. Heute werden wir darüber sprechen, wie Sie Google Maps in WordPress mit Elementor Page Builder einbetten können.
In erster Linie hat Elementor Google-Karte Widget, das Sie für diesen Zweck verwenden können. Allerdings hat es nur begrenzte Stiloptionen. Daher werden wir heute Folgendes verwenden Erweiterte Google Map Widget von Element Pack.
Wir brauchen uns nicht weiter vorzustellen. Fangen wir an!
Wann immer Sie eine Google Map in WordPress verwenden möchten, müssen Sie eine API Schlüssel auf Ihrem Dashboard. Mit diesem Schlüssel müssen Sie sich als Benutzer bei Google authentifizieren. Schauen wir uns das in Bildern an.

Setzen Sie zunächst die Erweiterte Google Map Widget auf Ihrer Website.

Sobald Sie das Widget ziehen und ablegen, wird eine Popup-Meldung angezeigt. Damit die Karte richtig funktioniert, fordert das System einen API-Schlüssel von Ihnen an. Schauen wir uns an, wie man das macht.

Zu WordPress gehen Dashboard> Element Pack> API-Einstellungen.
Hier sehen Sie ein Feld namens Google Map API-Schlüssel. Jetzt müssen Sie Ihren API-Schlüssel in das Feld eingeben und speichern. Sie können den Schlüssel für die Einbettung der Google Map in WordPress jedoch auch von hier.
Lassen Sie uns nun das Aussehen der Karte nach Ihrem Geschmack verändern. In diesem Teil werden wir über die Einstellungen des Widgets sprechen.

Wie in der obigen Abbildung ist das erste, was Sie sehen werden, die Google-Karte Abschnitt. Dieser befindet sich unter dem Registerkarte "Inhalt. Er enthält die Grundeinstellungen der Karte. Die Schalter auf dem Bildschirm zeigen/verbergen hauptsächlich entsprechende Schaltflächen/Funktionen auf der Karte.
Daher können Sie die Zoomtaste, Suchfeld, Kartentyp Option, und Straßenansicht von hier aus steuern. Außerdem gibt es auch Kartenzoom, Kartenhöheund Suchfeld Abstände Optionen hier. Außerdem können Sie die Karte in Satellit Modus oder Straße Modus.

Der nächste Abschnitt ist Markierung. Mit dem erweiterten Google Map-Widget können Sie eine unbegrenzte Anzahl von Markierungen setzen. Jeder Marker hat Felder wie Breitengrad, Längengrad, Titelund Inhalt. Bei den ersten beiden müssen Sie jedoch die Position der Markierung angeben.

Ein weiterer wichtiger Punkt ist, dass Sie eigene Symbole als Markierungen hinzufügen können. Diese Funktion finden Sie jedoch bei keinem anderen Mapping-Widget. Diese Funktion ist exklusiv für Element Pack-Benutzer.
Bis zu diesem Punkt haben wir nur das Layout eingerichtet. Jetzt werden wir das Aussehen der eingebetteten Google Map in WordPress ändern, indem wir Elmentor.

Auch hier besteht die Registerkarte "Stil" aus zwei Abschnitten. Mit dem GMap-Stil können Sie eine beliebige Oberfläche in Ihre Karte einfügen. Diese Skins ändern die Details der gesamten Karte. Sie müssen also nur den JSON-Code in das markierte Feld einfügen. Sie können auch die CSS-Filter für mehr Stil.

Darüber hinaus können Sie die JSON-Codes von Snazzymaps. Sie haben viele kostenlose und Premium-Karte Skins zur Verfügung zu einem günstigen Preis.

Schließlich ist auch das Suchfeld oben auf der Karte bearbeitbar. Es ist sehr einfach, sein Aussehen zu ändern. Auch hier können Sie die Farbe, die Art des Rahmens und den Radius des Rahmens ändern und dem Suchfeld einen Schatten hinzufügen. Stellen Sie sicher, dass das fertige Produkt den Besuchern ins Auge sticht.

Gut gemacht! Sie haben erfolgreich den ganzen Prozess gelernt. Mit diesem Blog hoffe ich, dass Sie die Einbettung von Google Maps in WordPress mit Elementor leicht machen können. Für weitere Informationen, besuchen Sie bitte unsere Wissensbasis. Ohne weiteres, bleiben Sie sicher. Vielen Dank für das Lesen dieses Blogs!
Größtes Elementor-Vorlagenpaket mit der benutzerfreundlichsten UI und 300+ nützliche Elementor-Widgets. Erstellen Sie Websites von Null auf 100% Perfektion im Handumdrehen.
Diese Website wird betrieben von Element Pack Pro und Rooten Thema.
Copyright © 2026 BdThemes. Alle Rechte vorbehalten.