Flächen-Liste Block

Mit dem Gutenberg-Block Flächen-Liste (immomakler/single-data-areas) geben Sie die Flächenangaben einer Immobilie als zweispaltige Definitionsliste mit Bezeichnung und Wert aus. Anders als der Immobiliendaten-Block, der alle Kerndaten auf einmal ausgibt, beschränkt sich die Flächen-Liste auf die Flächenfelder – und Sie legen pro Block-Instanz fest, welche davon erscheinen. Aufbau und Stiloptionen entsprechen dem Block Preise-Liste.

Flächen-Liste im Frontend mit Wohnfläche und Grundstücksfläche

Voraussetzungen

WordPress mit Gutenberg-Editor
WP-ImmoMakler (beliebige Edition)
Eine Immobilie im Kontext: Der Block liest die Flächen der gerade angezeigten Immobilie. Platzieren Sie ihn daher in einem Site-Editor-Template für den Beitragstyp Immobilie oder auf einer Vorlagenseite – siehe Single-Seite erstellen. Auf einer gewöhnlichen Seite ohne Immobilie bleibt der Block leer.

Block einfügen

Template oder Vorlagenseite öffnen

Öffnen Sie im Site Editor das Template für den Beitragstyp Immobilie (erfordert ein Block-Theme) oder die Vorlagenseite, auf der die Detailansicht Ihrer Immobilien aufgebaut wird.
Block einfügen

Klicken Sie auf das +-Icon und suchen Sie nach Flächen-Liste oder navigieren Sie zur Kategorie Widgets. Fügen Sie den Block ein.
Felder auswählen

Schalten Sie im Seitenbereich unter Felder die Flächenfelder aus, die in dieser Liste nicht erscheinen sollen. Standardmäßig sind alle Felder aktiviert.
Vorschau prüfen und speichern

Im Editor zeigt der Block sofort eine Live-Vorschau mit den Daten der Vorschau-Immobilie. Speichern Sie das Template – auf der tatsächlichen Immobilien-Seite erscheinen die Flächen des jeweiligen Objekts.

Optionen

Im Seitenbereich (Reiter Einstellungen) finden Sie die folgenden Panels:

Panel	Option	Standardwert	Beschreibung
Einstellungen	Beschriftung anzeigen	Ja	Zeigt die Bezeichnungen der Flächenfelder in einer eigenen Spalte neben den Werten an. Ausgeschaltet gibt der Block nur die Werte untereinander aus.
Felder	ein Schalter pro Flächenfeld	alle Ja	Legt fest, welche Flächenfelder diese Block-Instanz überhaupt ausgeben darf (vollständige Liste unten).
Tabellenzellen	Innenabstand (oben / rechts / unten / links)	10 / 3 / 3 / 3 px	Abstand innerhalb jeder Zelle der Liste.
Tabellenzellen	Rahmen	Kein	Trennlinie zwischen den Zeilen: Kein, Durchgehend, Gestrichelt, Gepunktet oder Doppelt. Erst mit einem gewählten Rahmen erscheinen die folgenden drei Optionen.
Tabellenzellen	Rahmenbreite (px) / Rahmenfarbe	1 px / Theme-Standard	Stärke und Farbe der Trennlinien.
Tabellenzellen	Trennlinien: Außenabstand (px)	0	Verlängert die Trennlinien über den Block-Innenabstand hinaus nach außen.
Tabellenzellen	Vertikale Trennlinie zwischen Spalten	Nein	Zeichnet zusätzlich eine senkrechte Linie zwischen Beschriftungs- und Wertespalte, im Stil des gewählten Rahmens.
Beschriftung	Spaltenbreite (%)	55	Breite der Beschriftungsspalte; die Wertespalte nimmt den Rest ein.
Beschriftung	Schriftgröße (px) / Schriftgewicht / Textfarbe	Theme-Standard	Typografie der Beschriftungen.
Werte	Textausrichtung	Links	Ausrichtung der Werte in ihrer Spalte: Links oder Rechts.
Werte	Schriftgröße (px) / Schriftgewicht / Textfarbe	Theme-Standard	Typografie der Werte.

Zusätzlich unterstützt der Block die WordPress-Standardoptionen für Innen- und Außenabstand im Reiter Design.

Verfügbare Flächenfelder

Das Panel Felder listet die Flächenfelder in der Reihenfolge, in der WP-ImmoMakler sie auch ausgibt:

Bezeichnung	Key
Wohnfläche	`wohnflaeche`
Nutzfläche	`nutzflaeche`
Bürofläche	`bueroflaeche`
Gesamtfläche	`gesamtflaeche`
Ladenfläche	`ladenflaeche`
Lagerfläche	`lagerflaeche`
Verkaufsfläche	`verkaufsflaeche`
Gewerbefläche	`gewerbeflaeche`
Freifläche	`freiflaeche`
Büroteilfläche	`bueroteilflaeche`
Verwaltungsfläche	`verwaltungsflaeche`
Gastrofläche	`gastroflaeche`
Dachbodenfläche	`dachbodenflaeche`
Kellerfläche	`kellerflaeche`
Balkonfläche	`balkonflaeche`
Terrassenfläche	`terrassenflaeche`
Balkon-/Terrassenfläche	`balkon_terrasse_flaeche`
Gartenfläche	`gartenflaeche`
Sonstige Fläche	`sonstflaeche`
Vermietbare Fläche	`vermietbare_flaeche`
Beheizbare Fläche	`beheizbare_flaeche`
Fläche (Freitext)	`flaeche_freitext`
Wohnfläche (Freitext)	`wohnflaeche_freitext`
Grundstücksfläche (Freitext)	`grundstuecksflaeche_freitext`
Fläche von	`flaechevon`
Fläche bis	`flaechebis`
Teilbar ab	`teilbar_ab`
Grundstücksfläche	`grundstuecksflaeche`
Fensterfront	`fensterfront`
Fensterfront (m²)	`fensterfront_qm`
Grundstücksfront	`grundstuecksfront`
Hallenhöhe	`hallenhoehe`
Kubatur	`kubatur`
Ausnützungsziffer	`ausnuetzungsziffer`
Grundflächenzahl (GRZ)	`grz`
Geschossflächenzahl (GFZ)	`gfz`
Baumassenzahl (BMZ)	`bmz`
Bruttogrundfläche (BGF)	`bgf`

Styling per CSS

Jede Zeile der Liste trägt eine Klasse nach dem Muster immomakler-data-{key}, sodass Sie einzelne Flächenfelder in Ihrem Theme gezielt gestalten können:

/* Liste */
.wp-block-immomakler-single-data-areas .immomakler-single-data-areas__list { }

/* Beschriftung und Wert eines bestimmten Feldes */
.wp-block-immomakler-single-data-areas dt.immomakler-data-wohnflaeche { }
.wp-block-immomakler-single-data-areas dd.immomakler-data-wohnflaeche { }