Gutes aus Jever

von

Teil 2: Viel mehr als nur Kontaktdaten

Im ersten Teil dieser Reihe, habe ich am 31. März das Projekt #gutesausjever vorgestellt. Heute möchte ich den Aufbau der Adressliste Schritt für Schritt zur Nachahmung beleuchten.

Schritt 1: Contao installieren

Insbesondere für die unter Euch, die nicht aus dem Contao-Universum stammen wird dieser Teil ggf. etwas fordernd sein.

Contao ist das Open Source Content Management System im D-A-CH-Raum. Also in Deutschland, Österreich und in der Schweiz sehr stark verbreitet. Wir nutzen und entwickeln für dieses System seit mehr als zehn Jahren. Als Contao-Premium-Partner für Entwicklung und Design setzen wir für unsere Kunden und uns hundertprozentig auf Contao. Contao ist sowohl sehr gut geeignet für Websites kleinerer und mittlerer Unternehmen als auch passend für Großunternehmen oder große Internetportale inkl. Mehrsprachigkeit. Contao setzt auf Barrierefreiheit und bringt vieles von Haus aus mit, wie beispielsweise umfassende Rechteeinstellungen für Redakteure. Tausende, größtenteils kostenlose Erweiterungen, wie beispielsweise unsere con4gis Bausteine, machen fast alles möglich. Was nicht dabei ist kann bei einer Contao-Partneragenturen zur Entwicklung beauftragt werden.

Für die Installation von Contao braucht Ihr als erstes einen Webspace auf Eurem Server, Rechner oder bei Eurem Hoster. Der Aufbau hängt vom System und/oder vom Anbieter ab. Wichtig ist, dass die Umgebung unter PHP >= 7.2 läuft, dass eine aktuelle Maria-DB bzw. MySQL Datenbank vorhanden ist und das die Systemvoraussetzungen gegeben sind: Speicherplatz, RAM-Speicher und auch die Zugriffsmöglichkeiten sollten dem heutigen Standard entsprechen. In den meisten Fällen ist das aber kein Problem. Zusätzlich solltet Ihr nach der Installation für ein SSL-Zertifikat sorgen. Für bestimmte Zugriffe auf verschiedene Dienste ist ein Zertifikat inzwischen unabdingbar. Macht es gleich richtig, dann bleiben entsprechende Fehlermeldung aus. In den allermeisten Fällen könnt Ihr inzwischen Let's Encrypt Zertifikate nutzen.

Hier geht es zur Installationsanleitung: Contao installieren

Und hier zum Download: Contao herunterladen

Nehmt für den Anfang immer die jeweils aktuellste LTS-Version (zurzeit 4.9). LTS-Versionen sind stabil und werden über Jahre gepflegt.

Damit schließe ich das Thema "Contao installieren" hier ab. Wenn Du Hilfe brauchst, kannst du Dich gerne bei der Küstenschmiede melden.

Schritt 2: con4gis Data installieren

Unser Data Baustein ist entstanden, um zügig über das Contao Backend eine eigene Datenbank mit eigenen Feldern aufbauen zu können. Beispielsweise um eine Adressliste zu generieren. Wie das geht erfahrt Ihr nach der Installation. Wichtig ist, dass Ihr inzwischen Contao 4.9 installiert habt. Ihr könnt den Manager bedienen, Ihr wisst was das Installtool ist und Ihr habt Euch schon mal als Administrator im Backend angemeldet. Das alles ist Voraussetzung für die nächsten Schritte.

Öffnet den Contao Manager erneut in Eurem Browser und wechselt in den Bereich "Entdecken". Dort gebt Ihr in das Feld "Erweiterungen suchen" folgendes ein: con4gis/data

Nach dem Ihr das Paket gefunden habt, klickt Ihr auf hinzufügen und wechselt in den Menüpunkt Pakete. Dort könnt Ihr jetzt Eure Umgebung aktualisieren. Der Data-Baustein hat ein paar Abhängigkeiten im Bauch. So werden auch die Bausteine Core, Projects und Maps automatisch mit installiert. Nach der Installation muss die Datenbank aktualisiert werden und dann hat Eure Contao Anwendung alles für unsere Adressliste im Bauch. Auf ins Backend. Es kann losgehen.

Schritt 3: Die Datenpflege vorbereiten

Im Backend solltet Ihr jetzt das neue con4gis Dashboard in der Contao-Navigation sehen. Das bitte öffnen. Im Dashboard werden installierte con4gis Bausteine aufgelistet. Dort beim Data-Baustein ganz rechts auf den Favoriten-Stern klicken. Jetzt tauchen die zugehörigen Module nicht nur im Dashboard sondern auch in der Contao-Navigation auf, was eine schnellere Navigation über mehrere Module möglich macht.

Ihr solltet jetzt folgendes in der Navigation sehen:

con4gis/data Bausteine

Tipp: Über die "Einstellungen" oben im Dashboard könnt Ihr entscheiden, ob der Bausteinname in der Navigation dargestellt werden soll oder nicht. Bei mehreren favorisierten Bausteinen ist es sinnvoll diesen so wie hier mit [data] anzeigen zu lassen.

Erklärung:

  • Datenerfassung => Datenpflege (z.B. Betrieb "Krabbenpalast")
  • Eigene Felder => Benutzerdefinierte Datenbankfelder (z.B. Icon als Onlineshop-Auszeichnung)
  • Kategorien => Daten müssen kategorisiert werden (z.B. Fischfilet Fachgeschäft)
  • Verzeichnisse => Optionale weitere Strukturebene (z.B. Gastronomie)

Contao sortiert die Menüpunkt seit Kurzem alphabetisch. Wir werden für das Einrichten Eures Branchenverzeichnisses die logische Reihenfolge verwenden.

Schritt 4: Eigene Felder definieren

Als aller erstes müsst Ihr Euch überlegen, ob Ihr überhaupt eigene Felder benötigt. Insbesondere für Adressdaten liefern wir bereits einiges an Felder mit. Was schon da ist könnt Ihr sehen, wenn Ihr mal testweise unter Kategorien eine Kategorie anlegt. Dort seht Ihr eine Feldliste. Alle diese Felder sind bereits vorhanden. Früher oder später werdet Ihr aber eigene Felder haben wollen.

Wenn Ihr ein erstes eigenes Feld anlegt, werdet Ihr diese Maske sehen:

con4gis Data initiale Sich eigenes Feld

Die drei wichtigsten Eingabefelder sollten immer gefüllt werden. Der Name wird gebraucht um das Feld an den verschiedenen Stellen zu verknüpfen (z.B. in der Kategorie). Der Datenbank-Alias entspricht dem Feldnamen in der Datenbank und der Typ dem Feldtyp. Über den Typ kommen dann auch viele weitere Eingabefelder hinzu.

Wichtig zu wissen ist, dass Ihr über diese Maske echte Datenbankfelder in Eure Datenerfassung bringt. D.h. Ihr müsst nach der Pflege über den Contao Manager den Cache leeren und die Datenbank über das Installtool aktualisieren.

So, jetzt aber ein Beispiel in zwei Teilen. Und zwar bringen wir ein Icon als Auszeichnung und Filter hinzu. Als erstes seht Ihr die Backend-Optionen, d.h. die möglichen Anpassungen für das Feld innerhalb der Datenerfassung:

con4gis Data eigenes Feld mit Backend Optionen

Es wird also ein neues Feld erzeugt, welches kein Pflichtfeld aber über das Contao Backend filterbar ist. Der Beschreibungstext wird für die späteren Redakteure in der Datenerfassung als Feldbeschreibung angezeigt. Für Menschen die in Contao Zuhause sind gut nachvollziehbar. Für das Frontend kommen wir jetzt wieder zum con4gis/data-Spezifischen:

con4gis data eigenes Feld mit Frontend Optionen

Wenn für das Frontend keine Bezeichnung gesetzt ist, wird automatisch die Feldbezeichnung oben verwendet. Heute wollen wir uns auf die Adressliste konzentrieren. Das Thema Karte / Popup kommt dann in Teil 3. D.h. wir möchten das das Icon, das im Frontend angezeigt wird, auch filterbar ist. In den Details soll das Icon nicht angezeigt werden, da wir dort direkt einen Link zum Onlineshop über die Datenerfassung einpflegen (dazu gleich mehr). Ganz unten geben wir noch ein Font Awesome Icon für die Darstellung in der Liste und für den Filterbutton an.

Nach dem Speichern muss, wie bereits erwähnt, der Cache geleert und die Datenbank aktualisiert werden. Wichtig ist auch, dass die das Feld über das Auge veröffentlicht. Ansonsten taucht es in der Kategorieauswahl noch nicht auf.

Schritt 5: Die erste Branchenkategorie

Das neue Feld sollte jetzt in der Datenbank vorhanden sein. Wir wechseln jetzt in das Backend-Modul "Kategorien".

Wir erstellen die Kategorie "Fischfilet Fachgeschäft", ordnen und aktivieren die Felder. Zum Beispiel so:

con4gis/data Kategorie

Die Eingaben in den Kategorieeinstellungen wirken sich an einigen Stellen aus. Uns geht vorerst um die Sortierung im Backend. D.h. so wie Ihr die Felder hier sortiert werden diese auch bei der Datenerfassung im entsprechenden Modul dargestellt. Dazu gleich mehr. Wenn Ihr "Nur veröffentlichte Elemente anzeigen" aktiviert, dann taucht an den entsprechenden Elementen in der Datenerfassungs-Liste das Auge-Icon zum de-/aktivieren auf. Ihr müsst dann die entsprechenden Datensätze immer aktivieren. Wenn die Checkbox hier aber nicht gesetzt wird, dann werden alle Daten der Kategorie im Frontend direkt veröffentlicht. Ganz unten könnt Ihr noch ein Schema für die Felder auswählen, dadurch werden entsprechende Properties nach Schema.org gesetzt.

Jetzt haben wir unsere Kategorie. Für eine wirkliche Branchenliste brauchen wir aber noch ein Branchenverzeichnis.

Schritt 6: das Branchenverzeichnis

Das Branchenverzeichnis ist prinzipiell nur eine weitere Strukturebene, dafür müssen wir nicht viel tun. Wir wechseln in das Modul "Verzeichnisse" und füllen einen ersten Eintrag aus:

con4gis/data Branchenverzeichnis

Name eintragen. Gültige Kategorien verknüpfen. Fertig ist unser erstes Branchenverzeichnis.

Schritt 7: Die Datenpflege

Tipp: Bevor wir unseren Krabbenpalast einpflegen hier schon mal der Hinweis, dass alle erfassten Daten in einer Tabelle (tl_c4g_data_element) landen. D.h. solltet Ihr bereits eine Datenquelle haben, dann könnt Ihr diese auch importieren. Bspw. über einen CSV-Import mit con4gis/import. Dafür solltet Ihr die Felder der Datenerfassung aber erst einmal kennen.

Alle möglichen Felder hier zu beschreiben führt zu weit. Fangen wir mal mit den allgemeinen Daten an:

con4gis/data Datenerfassung Allgemeine Daten

Das Feld Kategorie entspricht der Hauptkategorie des Betriebs.

Tipp: Insbesondere für Filialen bei denen die Kontaktdaten immer gleich sind, haben wir das Elternelement eingeführt. Ist dieses gesetzt, werden nicht gefüllte Felder aus dem Elternelement übernommen.

Weiter geht es mit der Beschreibung, die Kartenanbindung wird wie gesagt erst Thema in Teil 3:

con4gis/data Datenerfassung Beschreibung

Alle Felder die gefüllt und über Kategorie und Frontend-Modul veröffentlicht sind, werden an den verschiedenen Stellen im Frontend dargestellt. Als nächstes kämen die Kontaktdaten. Wir machen aber gleich mal weiter mit unserem Icon-Feld:

con4gis/data Datenerfassung Icon und Link

Unser Feld "Icon für Auszeichnung Onlineshop" ist hier eine Checkbox die dafür sorgt, dass der Krabbenpalast die Auszeichnung erhält und auch im Frontend filterbar ist, wenn es darum geht Betriebe mit Onlineshop zu finden.

Weiter unten habe ich noch einen Link zum Shop gesetzt. Dieser wird in den Details dargestellt. Auch hier kann man Font Awesome benutzen hinter dem </i> steht noch ein Textbeispiel: zum Shop. Also so: <i class="fas fa-shopping-cart"></i> Zum Shop

Das Feld Benutzergruppe ist für die Frontend-Pflege, die heute aber kein Thema ist. Die anderen Felder sind hoffentlich selbsterklärend. Ich denke Ihr habt die Datenerfassung und was damit zusammenhängt, die Eigenen Felder, Kategorien und Verzeichnisse verstanden. Damit schließe ich das Thema Datenpflege jetzt ab. Jetzt müssen wir das Ganze nur noch in die Website bringen.

Schritt 8: Auf ins Frontend

Wir wechseln zu den Frontend-Modulen (Themes -> Zahnräder). Dort erstellen wir ein neues Modul vom Typ "(data) Auflistung ohne Schreibzugriff":

Auch hier im Modul gibt es zahlreiche Einstellungen. Hier wieder nur ein Auszug:

con4gis/data Auflistung Kategorien

Hier können wir unsere Branchenverzeichnisse, aber auch einzelne Kategorien verknüpfen. Außerdem können wir die Liste über verschiedene Parameter beeinflussen. Wie beispielsweise die Feldliste:

con4gis/data Auflistung Feldliste

Hinweis: con4gis/data baut auf con4gis/projects auf. Über projects, unser Frontend Framework, sind noch viel mehr Konfigurationen für die Liste möglich, die wir nach und nach auch für die Backend Konfiguration in Data ergänzen werden. Es lohnt sich also die Weiterentwicklung im Auge zu behalten. Bspw. über den con4gis Twitterkanal. Bei Ideen gerne auch mal bei uns nachhaken, ggf. gibt es schon eine Lösung mittels con4gis.

Das Modul binden wir in einen Artikel ein und schauen uns das Ergebnis im Frontend an:

con4gis/data Frontend Liste

So sieht die aktuelle Ansicht im Frontend aus. Die Einträge werden entsprechend aufgelistet. Oben der Filterbutton, der aktiv nur Adressen auflistet mit Onlineshop. Die Detail-Ansicht sieht wie folgt aus:

con4gis/data Frontend Detailansicht

Das war Teil 2. Eines von vielen Beispielen wie Ihr con4gis/data nutzen könnt. Es müssen keine Adressdaten sein. Es können auch Jobs, Produkte oder irgendetwas anderes sein. Viel Erfolg beim Testen. Teil 3 kommt dann in der nächsten Woche. Da gucken wir uns den Krabbenpalast in der Karte an.

Weiterführende Links:

Zurück