Archiv-Template erstellen

Mit Elementor Pro können Sie die Darstellung der Immobilien-Listenansicht (Archiv) vollständig selbst gestalten. Sie haben zwei Wege: die 1-Klick HTML-Version für einen schnellen Start oder ein individuell gestaltetes Template mit unseren Widgets und Dynamic Tags.

Voraussetzungen

• Elementor Pro ab Version 3.20.0
• WP-ImmoMakler (beliebige Edition)

Hinweis

Deaktivieren Sie im Backend Ihrer Website (wp-admin) unter WP-ImmoMakler → Einstellungen → Theme Builder die Option WP-ImmoMakler Templates verwenden, wenn Sie die Darstellung vollständig mit Elementor Pro steuern möchten.

Option A: 1-Klick HTML-Version (Schnellstart)

Die 1-Klick-Widgets zeigen die bewährten HTML-Templates von WP-ImmoMakler an. Sie eignen sich, wenn Sie schnell ein funktionierendes Layout benötigen und Anpassungen per CSS oder über das WP-ImmoMakler Child-Skin-Plugin vornehmen möchten.

1. Theme Builder öffnen

   Navigieren Sie zu Templates > Theme Builder und klicken Sie auf Archiv hinzufügen.

2. Leeres Template wählen

   Wählen Sie eine leere Vorlage (kein vorgefertigtes Layout).

3. Widget einfügen

   Suchen Sie in der Widget-Sidebar nach der Kategorie WP-ImmoMakler: 1-Klick HTML-Version und ziehen Sie das Widget Archiv Listenansicht (HTML) auf die Seite.

4. Condition setzen

   Klicken Sie auf Veröffentlichen und wählen Sie als Bedingung WP-ImmoMakler > Alle Immobilien-Listen. Damit wird dieses Template für alle Immobilien-Archive verwendet.

5. Fertig

   Die Listenansicht wird nun mit dem WP-ImmoMakler HTML-Template dargestellt. Anpassungen sind über CSS, den Customizer oder das WP-ImmoMakler Child-Skin-Plugin möglich.

Option B: Individuelles Template gestalten

Für volle Gestaltungsfreiheit erstellen Sie ein eigenes Archive Template mit den spezialisierten WP-ImmoMakler-Widgets und Elementors eigenem Loop Grid.

1. Theme Builder öffnen

   Navigieren Sie zu Templates > Theme Builder und klicken Sie auf Archiv hinzufügen.

2. Seitenlayout einrichten

   Wählen Sie eine leere Vorlage. Fügen Sie einen Container für Ihre Seitenstruktur hinzu (z. B. zweispaltiges Layout für Suchformular + Ergebnisse).

3. Suchformular einfügen PLUS

   Ziehen Sie das Widget Suchformular aus der Kategorie WP-ImmoMakler in die Sidebar oder den Header-Bereich. Das Suchformular filtert die Ergebnisliste automatisch.

4. Karte einfügen PLUS

   Optional: Fügen Sie das Widget Karte (Archiv) ein, um die Suchergebnisse auf einer Karte darzustellen.

5. Ergebnisliste aufbauen

   Sie haben drei Möglichkeiten für die Ergebnisliste:

   Variante 1: Archiv-Loop Widget Ziehen Sie das Widget Archiv-Loop aus der Kategorie WP-ImmoMakler: Archive Template auf die Seite. Es zeigt konfigurierbare Immobilienkarten als Schleife an.

   Variante 2: Archiv Inline-Liste Verwenden Sie das Widget Archiv Inline-Liste für eine kompakte, platzsparende Darstellung.

   Variante 3: Elementor Loop Grid mit Dynamic Tags Für maximale Kontrolle nutzen Sie Elementors eigenes Loop Grid-Widget. Erstellen Sie ein Loop-Template und verwenden Sie darin die WP-ImmoMakler Dynamic Tags:

   • Titelbild als dynamisches Bild im Image-Widget
   • Immobilien-Titel als dynamischer Text in der Überschrift
   • Daten-Wert für Preis, Fläche, Zimmeranzahl usw.
   • Datenkacheln für eine kompakte Eckdaten-Übersicht
   • Direktlink als dynamische URL für den Button

6. Datenkacheln für Eckdaten

   Das Widget Datenkacheln eignet sich hervorragend für die Darstellung der wichtigsten Eckdaten (Preis, Fläche, Zimmer) in einem ansprechenden Kachel-Layout — sowohl in der Listenansicht als auch in der Detailansicht.

7. Condition setzen

   Klicken Sie auf Veröffentlichen und wählen Sie als Bedingung:

   Bedingung	Beschreibung
   Alle Immobilien-Listen	Template gilt für alle Immobilien-Archive
   Immobilien-Referenz-Archiv	Template gilt nur für Referenz-Objekte

   Sie können verschiedene Templates für unterschiedliche Archive erstellen (z. B. ein eigenes Layout für Referenzobjekte).

Verfügbare Archiv-Widgets

Widget	Kategorie	Beschreibung
Archiv Listenansicht (HTML)	1-Klick HTML-Version	Komplette Listenansicht mit WP-ImmoMakler HTML-Templates
Archiv Inline-Liste	Archive Template	Kompakte Inline-Listenansicht
Archiv-Loop	Archive Template	Konfigurierbare Immobilienkarten-Schleife
Datenkacheln	Single Post Template	Eckdaten als Kacheln (auch im Archiv nutzbar)
Suchformular PLUS	seitenweit nutzbar	Immobilien-Suchformular mit Filtern
Karte (Archiv) PLUS	seitenweit nutzbar	Karte mit Immobilien-Standorten
Carousel PLUS	seitenweit nutzbar	Immobilien-Karussell

Nützliche Dynamic Tags für die Listenansicht

Wenn Sie Elementors Loop Grid verwenden, können Sie diese Dynamic Tags in beliebigen Standard-Widgets nutzen:

Tag	Typ	Einsatz
Titelbild	Bild	Image-Widget, als Hintergrundbild
Immobilien-Titel	Text	Überschrift
Daten-Wert	Text	Preis, Zimmerzahl, Fläche usw. in Text-Widgets
Vermarktungsart	Text	”Kauf” oder “Miete” als Badge
Status	Text	Verkauft, Vermietet usw.
Direktlink	URL	Button, Link

Display Conditions im Archiv

Mit Display Conditions können Sie Elemente in der Listenansicht abhängig von den Daten der jeweiligen Immobilie ein- oder ausblenden:

• Bilder vorhanden: Platzhalter anzeigen, wenn keine Bilder vorhanden
• Taxonomie-Bedingungen: Unterschiedliche Darstellung für Kauf- und Mietobjekte
• Datenfelder vorhanden: Preisfeld nur anzeigen, wenn ein Preis vorhanden ist

Vorschau und Testen

Beim Bearbeiten des Templates zeigt Elementor standardmäßig Platzhalter-Daten an. Um das Template mit echten Immobiliendaten zu testen:

1. Klicken Sie in der Elementor-Fußleiste auf das Zahnrad-Symbol (Seiteneinstellungen).
2. Wählen Sie unter Vorschaueinstellungen den Beitragstyp Immobilie und suchen Sie eine Seite, die ein Immobilien-Archiv enthält (z. B. Ihre Immobilien-Übersichtsseite).
3. Das Template wird nun mit den echten Daten Ihrer Immobilien-Listenansicht dargestellt.

Tipp

Beginnen Sie mit der 1-Klick HTML-Version und wechseln Sie später zu einem individuellen Template, wenn Sie mehr Gestaltungsfreiheit benötigen. Beide Ansätze lassen sich jederzeit austauschen.