Textfilter in Listen nutzen

Weblication® Listen lassen sich über Textfilter komfortabel für Seitenbesucher filtern.

Mit dem Weblic® Textfilter können Sie sowohl in der BASE Classic wie auch BASE (Mobile First) eine Weblication® Liste nach Wörtern filtern. Dieser Artikel beschreibt das Vorgehen auf Basis eines BASE Classic 2.x Projektes. Für Mobile First gilt dies entsprechend - beachten Sie hierzu aber die Hinweise am Artikelende.

Fügen Sie hierzu am besten oberhalb der Liste das Element "Textfilter" ein, welches Ihnen nach Installation des gleichnamigen Weblics® im Struktureditor als Administrator zur Auswahl steht.

Element Textfilter - Konfiguration
Element Textfilter - Konfiguration

Im Editor können Sie zum Textfilter festlegen, zu welcher Liste dieser greifen soll. Wählen Sie im Feld "Beim Ändern einen Quickfilter auf folgendes Listenelement ausführen" die Listen-ID aus, zu welcher Liste dies der Fall sein soll. Weiterhin können Sie in der Konfigurationsmaske den Ausfüllhinweis, Darstellung und den Modus festlegen.

Aktivieren Sie dann über die CSS-Only-Variante der entsprechenden Liste die Maske für die "Daten für Textfilter":

Beispiel: Auszug aus der design.css zur Listen-Variante 111 mit aktiviertem Textfilter

.listDefault_var111  {...;-w-editmaskExtended-textsquickfilter:yes;}
Listenoptionen - Daten für Textfilter
Listenoptionen - Daten für Textfilter

Sie erhalten dann folgendes Eingabefeld in den Listenoptionen. Über das Fragezeichen-Symbol rechts oben stehen Ihnen beispielhafte Einträge für das Feld zur Verfügung, z.B.:

  • Beispiel Titel:
    wd:extension/wd:meta/wd:title/text()

Mehrere Felder geben Sie per Pipe-Zeichen | getrennt an, z.B.:

  • Beispiel Titel und Beschreibung:
    wd:extension/wd:meta/wd:title/text()|wd:extension/wd:meta/wd:description
  • Beispiel Titel und Objekt-Feld name
    wd:extension/wd:meta/wd:title/text()|wd:extension/wd:object/wd:data[@id = 'name']/text()

Seitenbesucher erhalten zur Liste ein Feld zur Eingabe von entsprechenden Begriffen, welche die Liste nach diesem Text Kriterium filtern:

Liste mit Textfilter Feld
Liste mit Textfilter Feld
Liste mit Textfilter Feld (gefiltert)
Liste mit Textfilter Feld (gefiltert)

Zu beachten bei BASE (Mobile First):
Nicht alle Listen CSS-Only-Varianen sind im Standard mit dem Flag für den Quickfilter umgesetzt. Ggf. müssen Sie folgende Schritte noch vornehmen:

  1. Installation der Listen CSS-Only Untervariante "Quickfilter"
  2. Zuweisen der Subvariante quickfilter=1, also z.B.:
    -w-subvariants:date=10,title=17,description=10,thumbnail=10,border=0,link=0,cols=0,quickfilter=1;