Umkreissuche

Eine Umkreissuche finden Sie auch auf unserer Demoseite (Bildungsinstitute). Dort können Sie die Konfiguration gerne abschauen.

Schritt 1 Backend Modul erstellen

Als erstes erstellen wir ein Backend Modul. In diesem Beispiel verwende ich Deutschlands Freizeitparks.

Schritt 2 Eingabefelder für Koordinatenermittlung

Nun müssen wir in unserem Freizeitpark Modul zwei Eingabefelder hinzufügen. Einmal Latitude und Longitude. Diese können ganz gewöhnliche Textfelder sein.

Adressfelder

Danach benötigen wir weitere Eingabefelder für die Adresse. Entweder erstellen wir ein Eingabefeld, indem wir die vollständige Adresse hinterlegen oder wir erstellen mehrere Adressfelder. Diese Adressfelder können auch Textfelder sein.

Schritt 3 Koordinatenermittlung aktivieren

Als nächstes müssen wir die Latitude und Longitude Eingabefelder für die Koordinatenermittlung freigeben. Dazu öffnen wir wieder die Backend Einstellungen von unserem Freizeitpark Modul und öffnen die Geo-Einstellungen Palette. Dort übergeben wir Latitude und Longitude Eingabefelder.

Je nachdem wie wir uns entschieden haben, ob wir mehrere Felder oder nur ein Feld haben, übergeben wir auch unsere Adressfelder.

Google Maps API

Latitude und Longitude werden mit Google Maps API erzeugt. Dazu wird ein gültiger API Schlüssel benötigt. Dieser kann in der Google Cloud Console erstellt werden. Der Schlüssel soll unter System > Einstellungen > Catalog Manager-Einstellungen in die Felder Google-Maps Server Key und Google-Maps Client Key eingetragen werden.

Schritt 4 Datensätze einpflegen

Wir erstellen einige Datensätze bzw. Freizeitparks.

Schritt 5 Listenansicht erstellen

Wir können jetzt das Frontend Modul Catalog Listenansicht erstellen. Danach wählen wir unser Backend Modul aus. In meinem Fall das Freizeitpark Modul. Dort müssen wir nur noch die Umkreissuche aktivieren. Dazu öffnen wir die Umkreissuche-Einstellungen Palette und aktivieren die entsprechende Checkbox.

Als letztes wählen wir noch einmal die Latitude und Longitude Eingabefelder aus. Optional können wir ein Land auswählen.

Die Listenansicht können wir nun über ein Inhaltselement auf der Seite einbinden.

Schritt 6 Filterformular erstellen & einbinden

Als letztes benötigen wir unser Filterformular. Dafür können wir den Formulargenerator von Contao nutzen.

In den Formular Einstellungen müssen wir die Übertragungsmethode auf GET einstellen. Die restlichen Einstellungen sind jedem selbst überlassen.

Feldnamen für die Umkreissuche

Kommen wir zu den Formularfeldern. Bei den Eingabefeldern gibt es auch keine großen Einschränkungen. Das einzige was wir beachten müssen ist die Feldname Konvention:

• rs_pstl => Postleitzahl Eingabefeld
• rs_cty => Stadt Eingabefeld
• rs_strt => Sraße Eingabefeld
• rs_strtn => Straßennummer Eingabefeld
• rs_cntry => Land Eingabefeld

Wenn wir die Feldnamen richtig zuordnen, sollte die Umkreissuche funktionieren. Das Filterformular muss nur noch im Frontend auf der selben Seite wie die Listenansicht eingebunden werden.

Mit dem können wir die aktiven Felder auslesen.

Schritt 7 Distanz ermitteln

Im Filterformular erstellen wir ein Eingabefeld für die Distanz. Feldtyp spielt keine Rolle. Wichtig ist, dass wir bei dem Feldnamen rs_dstnc verwenden.