Die Erstellung einer komplett mehrsprachigen Immobilien-Seite kann eine Herausforderung sein. In diesem Beitrag zeigen wir Ihnen, wie Ihnen dies mit den Toolset-Plugins gelingt. Sie können bei null beginnen oder ein fertiges Referenzdesign benutzen, um die Entwicklung zu beschleunigen.

Was unsere mehrsprachige Immobilien-Seite enthalten wird

„Immobilien“ sind alles, das auf dem Boden gebaut wird, einschließlich nur Grundstücke (ohne Bebauung). Wohnungen, Gebäude, unbebaute Flächen und Büros haben verschiedene Felder und werden unterschiedlich angezeigt. Aus diesem Grund haben wir beschlossen, für jedes davon einen separaten benutzerdefinierten Beitragstyp zu erstellen.

immobilien-startseite-600

Jeder Abschnitt auf der Seite enthält einen eigenen Slider mit hervorgehobenen Objekten und benutzerdefinierter Suche. Mit dieser benutzerdefinierten Suche können Sie Objekte nach Attributen suchen (wie Größe, Preis und Funktion). Sie zeigt die Ergebnisse als Gitter (Textliste) sowie in Form von Markierungen auf einer Google Map an.

individuelle-suche-haueser-600

Jedes Objekt wird mit vollständigen Details angezeigt, einschließlich des Maklers, der es eingetragen hat, der Beschreibung und der Lage auf der Karte.

einzelhaus-600

Wenn Sie also eine solche Seite selbst erstellen, gehen Sie wie folgt vor:

  • Erstellen Sie die benutzerdefinierten Beitragstypen und ihre Felder und Taxonomie
  • Finden Sie heraus, wie Sie eine benutzerdefinierte Suche implementieren (das ist ein entscheidender Teil des Projekts)
  • Finden Sie heraus, wie Sie Objekte auf einer Google Map anzeigen
  • Gestalten Sie, wie alles angezeigt werden soll

So erstellen Sie eine mehrsprachige Immobilienseite mit Toolset

Es gibt tolle Themes, die dies für Sie übernehmen. Heute erklären wir Ihnen, wie Sie solche Seiten mit unseren Toolset-Plugins erstellen.

Falls Sie noch nicht von Toolset gehört haben: Es ist ein Paket aus Plugins, die Ihnen helfen, fortgeschrittene Seiten mit benutzerdefinierten Typen zu erstellen, ohne Programmierung. Toolset eignet sich perfekt für Immobilien-Seiten, da diese stark auf benutzerdefinierte Beitragstypen und benutzerdefinierte Felder setzen. Mit Toolset können Sie diese benutzerdefinierten Typen und Felder ganz einfach einrichten und hübsch im Front-End anzeigen, ganz ohne PHP-Programmierung.

Benutzerdefinierte Beitragstypen, Felder und Taxonomie für unsere Immobilien-Seite

Als erstes haben wir die benutzerdefinierten Typen, die benutzerdefinierten Felder und die Taxonomie erstellt. Obwohl die Seite recht simpel aussieht, enthält sie 7 verschiedene benutzerdefinierte Beitragstypen. Gehen Sie auf Toolset->Dashboard, um diese zu erstellen.

Die benutzerdefinierten Typen, Felder und die Taxonomie für unsere Immobilien-Referenzseite
Die benutzerdefinierten Typen, Felder und die Taxonomie für unsere Immobilien-Referenzseite

Wir haben verschiedene Sets benutzerdefinierter Felder erstellt, die die Attribute hinzufügen, die jeder benutzerdefinierte Beitragstyp braucht.

Benutzerdefinierte Felder für Wohnungen
Benutzerdefinierte Felder für Wohnungen

Gestalten des Front-Ends der Seite mit Toolset

Unser Front-End-Designzentrum mit Toolset ist das Layouts-Plugin. Mit Layouts können Sie das „Grundgerüst“ Ihrer Seite mit Hilfe eines Drag-and-Drop-Editors gestalten. Erstellen Sie dann die Details der einzelnen Blöcke mit dem Views-Plugin.

Als erstes gestalten Sie das Layout. Dabei beginnen Sie mit dem übergeordneten Layout, welches die Elemente enthält, die auf jeder Unterseite der Website erscheinen.

Das Master-Layout der Seite, mit Kopfzeile, Fußzeile und Platzhalter für untergeordnete Layouts
Das Master-Layout der Seite, mit Kopfzeile, Fußzeile und Platzhalter für untergeordnete Layouts

Als nächstes machen Sie mit der Gestaltung der Layouts (Grundgerüste) für verschiedene Hauptseiten weiter. Dies ist das Layout für das „Häuser-Archiv“, also die Suchseite für Häuser.

Das Layout des Häuser-Archivs (das
Das Layout des Häuser-Archivs (das „Grundgerüst“ für die Häuserliste)

Sobald die Layouts fertig sind, ist es Zeit, in die verschiedenen Blöcke einzutauchen und diese zu erstellen. Dies machen Sie mit Views. Eine View lädt Inhalte aus der Datenbank und zeigt sie an. Sie können Views für simple Listen, Slider, benutzerdefinierte Suchen, Tabellen, Gitter und alles andere erstellen, das Ihnen einfällt.

Eine View kann in drei Schritten erstellt werden:

  1. Wählen Sie aus, wofür die View eingesetzt wird (simple Liste, benutzerdefinierte Suche, paginierte Liste, Slider)
  2. Wählen Sie weitere Optionen, je nach der Art von View, die Sie erstellen
  3. Gestalten Sie die Ausgabe mit HTML und CSS

Einrichtung einer View - 1. Wählen Sie aus, welche Inhalte angezeigt werden sollen
Einrichtung einer View – 1. Wählen Sie aus, welche Inhalte angezeigt werden sollen

Einrichtung einer View - 2. Wählen Sie Optionen für diese Art von View aus
Einrichtung einer View – 2. Wählen Sie Optionen für diese Art von View aus

Einrichtung einer View - Gestalten Sie die Ausgabe mit HTML
Einrichtung einer View – Gestalten Sie die Ausgabe mit HTML

Eventuell ist Ihnen aufgefallen, dass im HTML-Code oben Shortcodes verwendet werden. Diese Shortcodes zeigen Felder an. Sie müssen sich die Shortcodes oder deren Optionen nicht merken. Um ein Feld in die HTML einzubeziehen, klicken Sie auf den Button Felder und Views im Editor. Wählen Sie das Feld aus, geben Sie dessen Optionen ein, dann erhalten Sie den fertigen Shortcode.

Einfügen eines Felds
Einfügen eines Felds

So können Sie Ihre eigenen benutzerdefinierten Layouts erstellen und in diesen die nötigen Seitenelemente aufbauen. Wenn Sie HTML und CSS beherrschen, gelingt Ihnen mit Toolset alles, ohne PHP-Programmierung.

So übersetzen Sie

Eines der tollen Dinge an Toolset ist die nahtlose Integration mit WPML. Alles, das Sie mit Toolset erstellen, lässt sich mit WPML ganz einfach übersetzen.

Toolset registriert automatisch alle „Strings“, die übersetzt werden sollen.

Wenn Sie auf WPML->String Translation gehen, sehen Sie Domains für alle Views (und anderen Toolset-Elemente), die Sie erstellt haben. Es wird auch Domains für die benutzerdefinierten Beitragstypen und Felder geben.

Übersetzung der Strings in einer View
Übersetzung der Strings in einer View

Das Übersetzen der Layouts ist noch einfacher. Gehen Sie auf WPML -> Übersetzungsverwaltung, dort sehen Sie Layouts im Übersetzungs-Dashboard.

Zu übersetzende Layouts
Zu übersetzende Layouts

Die Übersetzungs eines Layouts ist ähnlich wie die Übersetzung von Beiträgen. Sie erhalten eine Liste mit Texten, die im Layout erscheinen, und übersetzen diese. Sie müssen die Layouts nicht für jede Sprache neu erstellen.

Beginnen Sie bei null oder arbeiten Sie mit einer fertigen Referenzseite

Mit Toolset können Sie Ihre eigenen mehrsprachigen Immobilienseiten von der Pike auf erstellen. Sie können auch unsere vollständige Immobilien-Referenzseite als Ausgangspunkt nutzen. Da unsere Referenzseite komplett mit den Toolset-Plugins erstellt wurde, können Sie alles darin verändern. Sie können Elemente bearbeiten, entfernen und eigene hinzufügen.