widget Kategorien: Business
Zeigen Sie Ihren Besuchern eine Karte von jedem beliebigen Standort. Verwenden Sie das Karten-Widget, um den Standort Ihres Unternehmens oder einen Veranstaltungsort anzuzeigen. Außerdem können Sie Kunden darüber informieren, wo sie Parkplätze finden.
Mapbox ist der Standardkartenanbieter für das Karten-Widget. Sie können Google Maps jedoch als Standardkartenanbieter für alle neuen und vorhandenen Websites in Ihrem Konto festlegen. Zusätzlich zum Karten-Widget wird Google Maps zum Standard in allen Ortssuchen und Karten für die Inhaltsbibliothek und andere anwendbare widget.
Alle Standortdaten aus Mapbox werden gespeichert und auf Google Maps angewendet. Dadurch wird sichergestellt, dass Sie Standorte nicht erneut einrichten müssen.
Beachten Sie, dass diese Funktion nur von Mitarbeitern mit der Berechtigung für Pro-Einstellungen aktiviert werden kann.
So legen Sie Google Maps als Ihren Standardkartenanbieter fest:
-
Generieren Sie in Ihrem Google Maps-Konto einen API-Schlüssel. Weitere Informationen zum Generieren eines API-Schlüssels finden Sie in der Dokumentation von Google. Wir empfehlen Ihnen , die Nutzungs- und Abrechnungsrichtlinie von Google zu lesen.
-
(Fakultativ) Wenn Sie Ihr Google-Konto so einrichten, dass der API-Schlüssel nur auf bestimmten Websites verwendet werden kann, müssen Sie duda.co, Ihre Website-Domain und ggf. alle weißen Beschriftungsdomains zur Liste der zulässigen Websites in Ihrem Google-Konto hinzufügen. Es ist wichtig, das folgende Format für Ihre Domains zu verwenden:
*.duda.co/*
-
Klicken Sie in Ihrem Dashboard auf Ihren Avatar in der oberen rechten Ecke und wählen Sie Konto aus.
-
Scrollen Sie auf der Seite „Kontoeinstellungen“ nach unten zum Abschnitt „Google Map-Integration“ und klicken Sie auf „Einrichten“.
-
Fügen Sie Ihren API-Schlüssel in das Feld ein und klicken Sie dann auf Auf alle Websites anwenden. Dadurch wird Google Maps zur Standardkarte für alle bestehenden und neuen Websites in Ihrem Konto.
Sie können Google Maps jederzeit deaktivieren und zurück zu Mapbox wechseln. Alle Standortdaten von Google Maps werden gespeichert und automatisch auf Mapbox angewendet, wenn Sie wechseln.
Optionen für die Einrichtung der Karte
-
Geben Sie Ihre Geschäftsadresse in das dafür vorgesehene Feld ein.
-
Wählen Sie die Adresse aus dem angezeigten Dropdown-Menü aus.
Hinweis
Wenn Ihre Adresse nicht im Dropdown-Menü angezeigt wird, bedeutet dies, dass die Datenbank HERE, die Website Builder verwendet, die Adresse nicht enthält. Um die Adresse zu übermitteln oder zu korrigieren, wenden Sie sich an HERE Map Creator.
Wenn Sie Google Maps als Standardanbieter verwenden, lesen Sie die Google-Dokumentation Hinzufügen eines fehlenden Ortes zu Google Maps.
-
-
Statt dem Kartenbild können Sie auch einen Karten-Button anzeigen.
-
Um eine Kartenschaltfläche auf bestimmten Geräten im Classic-Editor anzuzeigen, wählen Sie die Schaltfläche auf Geräten verwenden () aus, an der die Schaltfläche angezeigt werden soll. Wenn keine Geräte ausgewählt sind, wird das Kartenbild angezeigt.
-
Im Editor 2.0 kann die Schaltfläche für alle Geräte aktiviert werden. Um die Schaltfläche zu aktivieren, klicken Sie auf den Schalter Als Schaltfläche auf allen Geräten festlegen .
-
-
Geben Sie den Text, der auf der Schaltfläche angezeigt werden soll, in das dafür vorgesehene Feld Text auf der Schaltfläche ein.
-
Popup für Ortsinformationen (Infofenster für die Kartenmarkierung). So zeigen Sie ein Popup-Fenster mit Standortinformationen im Karten-Widget an:
-
Geben Sie einen Titel und eine Beschreibung für das Popup-Fenster ein.
-
Wählen Sie aus, ob das Popup Bei hover, Beim Klicken oder Immer aus dem Dropdown-Menü Popup angezeigt werden soll.
-
So können Sie Karten von Google Maps mit dem HTML-Widget einbetten:
-
Gehen Sie zu Google Maps.
-
Suchen Sie nach dem gewünschten Standort.
-
Klicken Sie auf das Menü oben links und dann auf Karte freigeben oder einbetten .
-
Klicken Sie auf die Registerkarte Karte einbetten .
-
Kopieren Sie die URL in den Anführungszeichen nach <iframe src =". Stellen Sie sicher, dass Sie die vollständige, in den Anführungszeichen enthaltene URL kopieren.
-
Navigieren Sie zu Ihrer Website, klicken Sie im linken Bereich auf widgetund ziehen Sie das HTML-Widget in eine Zeile.
-
Verwenden Sie den folgenden Einbettungscode und fügen Sie die URL, die Sie von Google Maps erhalten haben, in die Anführungszeichen nach iframe src= ein:
<div class="embed-container"><iframe src=" " frameborder="0" allowfullscreen></iframe></div>
-
Öffnen Sie den Entwicklermodus.
-
Klicken Sie auf Website-HTML/CSS und dann auf Website.css.
-
Betten Sie das folgende CSS in diesen Abschnitt ein:
.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
Die Größe der Karte wird nun an die entsprechenden Geräte angepasst. Wenn Sie den normalen Einbettungscode von Google Maps verwenden, ist die Größe des Karten-Widgets auf allen Geräten statisch und wird in der mobilen Ansicht abgeschnitten.