Umgebungskarte Block einsetzen
Ce contenu n’est pas encore disponible dans votre langue.
Mit dem Gutenberg-Block Umgebungskarte Einzelimmobilie (immomakler/single-map) binden Sie die Karte einer Immobilie direkt in Block-Templates oder beliebige Seiten ein. Der Block entspricht in Funktionsumfang und Ausgabe dem gleichnamigen Elementor-Widget „Umgebungskarte Einzelimmobilie”.
Voraussetzungen
Abschnitt betitelt „Voraussetzungen“- WordPress mit Gutenberg-Editor (ab WordPress 5.0)
- WP-ImmoMakler (beliebige Edition)
- Ein Karten-Anbieter muss im Customizer unter WP-ImmoMakler → Karten ausgewählt sein. Lässt sich damit keine Karte zeichnen, springt die Google Maps Embed Karte ein, sofern sie als Fallback aktiviert ist
- Die Immobilie muss eine Adresse oder Geokoordinaten hinterlegt haben
Block einfügen
Abschnitt betitelt „Block einfügen“-
Immobilie bearbeiten oder Template öffnen
Öffnen Sie eine bestehende Immobilie im Editor oder ein Block-basiertes Template für den Beitragstyp Immobilie (erfordert ein Block-Theme oder den Site Editor).
-
Block einfügen
Klicken Sie auf das +-Symbol und suchen Sie nach Umgebungskarte oder navigieren Sie zur Kategorie Widgets. Fügen Sie den Block ein.
-
Vorschau prüfen
Im Editor wird eine Live-Vorschau mit den Daten einer vorhandenen Beispiel-Immobilie angezeigt. Die Karte erscheint inklusive der konfigurierten Einwilligungs-/Consent-Funktionalität. Auf der tatsächlichen Immobilien-Seite erscheint die Karte des jeweiligen Objekts.
Kartenhöhe konfigurieren
Abschnitt betitelt „Kartenhöhe konfigurieren“Im Block-Panel Darstellung legen Sie die Höhe der Karte fest:
| Einstellung | Beschreibung |
|---|---|
| Einheit | Einheit für die Kartenhöhe: px, %, vh oder vw. Standard: px. |
| Kartenhöhe | Höhe der Karte in der gewählten Einheit. Standard: 350 px. |
Verfügbare Bereiche je nach Einheit:
| Einheit | Minimum | Maximum |
|---|---|---|
| px | 100 | 1200 |
| % | 10 | 100 |
| vh | 10 | 100 |
| vw | 10 | 100 |
Die eingestellte Höhe wird als scoped Inline-CSS auf die Map-Container-Selektoren .immomakler-map-iframe, .immomakler-map-iframe iframe.map und iframe.immomakler-map-iframe angewendet.
CSS-Klassen für eigene Anpassungen
Abschnitt betitelt „CSS-Klassen für eigene Anpassungen“Für weitergehende Gestaltung können Sie in Ihrem Theme eigene CSS-Regeln verwenden:
/* Block-Wrapper */.wp-block-immomakler-single-map .immomakler-single-map { }
/* Map-Container (iframe oder JS-API-div) */.immomakler-map-iframe { }
/* Eingebettetes iframe-Element */.immomakler-map-iframe iframe.map { }