Widgets filtern: Filteroptionen hinzufügen und Veranstaltungen (vorab) filtern
Standardmäßig werden in den veranstaltungsübergreifenden Kalender- und Tabellenwidgets alle anstehenden Veranstaltungen einer doo Organisation angezeigt, auf Wunsch mit einer Suchfunktion für Buchende, die ihnen eine Stichwort-, Orts- und Datumssuche ermöglicht (Alle allgemeinen Infos dazu finden Sie in unserem Artikel zum Thema Widgets).
Manchmal reichen die angebotenen Filter für Buchende jedoch nicht, oder Sie möchten die Veranstaltungen schon vorab filtern. Hierfür bietet doo Ihnen drei Optionen:
-
Sie können zusätzliche Filterfeld mit Mehrfachauswahl hinzufügen, über die Ihre Seitenbesucher alle Veranstaltungen nach vorgegebenen Kategorien oder Stichwörtern filtern können. Ein Beispiel wären zusätzliche Filter für Veranstaltungsart, Trainer*in oder Zielgruppen.
-
Außerdem können Sie sowohl die Standardfilter als auch die zusätzlichen Filter vorbefüllen. Zum Beispiel können Sie festlegen, dass Ihren Besuchern beim Öffnen der Seite eine vorgefilterte Liste mit Veranstaltungen in München angezeigt wird. Die Nutzer können die Filterauswahl selbstständig verändern und so auch auf alle anderen Veranstaltungen zugreifen. Diese Möglichkeit eignet sich besonders dann, wenn Sie Ihre Veranstaltungen nach unterschiedlichen Themen, Orten oder Zielgruppen kategorisieren möchten und ggf. unterschiedliche Landingpages planen, auf denen jeweils nur die relevanten Events hervorgehoben werden sollen.
-
Ein dritte Möglichkeit ist, das nur von Ihnen vorab definierte Veranstaltungen angezeigt im Widget werden und Besucher nur innerhalb dieser Liste suchen und navigieren können. Diese Möglichkeit eignet sich beispielsweise für Veranstalter, die nur ihre öffentlichen Veranstaltungen in der Übersicht anzeigen lassen und interne Events außen vor lassen möchten.
All diese Anpassungen werden im Widgetcode vorgenommen und erfordern ein vorheriges Anlegen von Veranstaltungsfeldern, um die Events zuzuordnen. Mehr zu Einbettung, Anpassung und Vorbefüllung von Widgets finden Sie auch in unserer technischen Dokumentation zu Widgets.
1. Filterfeld mit Mehrfachauswahl zu Widget hinzufügen
1. Legen Sie für Ihre Organisation ein neues internes Veranstaltungsfeld mit beliebigem Namen des Typs “Mehrfachauswahl” an und geben Sie als Auswahlmöglichkeiten all die Stichworte an, nach denen Sie Ihre Veranstaltungen filtern lassen möchten. Legen Sie am Besten fest, dass das neue Veranstaltungsfeld standardmäßig für alle neu erstellten Veranstaltungen eingebunden werden soll. Eine Anleitung, wie Sie Veranstaltungsfelder anlegen, finden Sie in unserem Artikel zu Veranstaltungsfeldern.
2. Fügen Sie das Feld im ersten Schritt der Veranstaltungsbearbeitung (“Veranstaltungsinformationen”) bei allen neuen und bestehenden Veranstaltungen hinzu, die in dem Widget auftauchen sollen, wählen Sie ein oder mehrere zutreffende Stichworte über die Checkboxen aus und speichern Sie die Änderungen unten auf der Seite.
3. Erstellen Sie ein Kalender- oder Listenwidgets, kopieren den Widgetcode und fügen Sie folgenden Parameter hinter “data-viovendi-organizer=”XXXX”“ ein und ersetzen Sie den Namen des Veranstaltungsfeldes sowie die Antwortmöglichkeiten entsprechend durch Ihre eigenen Bezeichnungen:
data-viovendi-event-filters='[
{
"label": "Veranstaltungsfeld-Name",
"options": ["Option1", "Option2", "Option3"]
}
]'
Beispiel für angepassten Code:
<div class="viovendi-widget viovendi-event-list-widget"
data-viovendi-locale="de-de"
data-viovendi-widget-config-name="list-13369-2715"
data-viovendi-organizer="13369"
data-viovendi-event-filters='[
{
"label": "Event-Typ",
"options": ["Kongress", "Messe", "Roadshow", "Online-Event"]
}
]'
</div>
<script type="text/javascript" src="https://doo.net/viovendi-embed.js" data-viovendi-version="1"></script>
4. Fügen Sie den angepassten Widgetcode in Ihre Webseite ein – oben links wird Ihnen nun der Filter angezeigt.
Gut zu wissen: Der im Code definierte Filter wird auch dann angezeigt, wenn die Suchfunktion in den Widgeteinstellungen ausgeschalten wurde.
In der technischen Dokumentation zu Widgets finden Sie diese Funktion unter “Custom filters for bookers”.
2. Widget mit vorbefülltem Filter erstellen
Alternativ oder zusätzlich können Sie einstellen, dass ein oder mehrere Filter beim Laden des Widgets schon aktiviert sind, sodass Ihren Seitenbesuchern nur eine bestimmte Veranstaltungsauswahl angezeigt wird, die sie dann nachträglich noch ändern beziehungsweise erweitern können.
Sie können das Widget zum Einen nach den Standard-Suchmöglichkeiten des Widgets (Schlagwort, Veranstaltungsort, Start- und Enddatum) vorfiltern. Falls Sie, wie oben beschrieben, weitere Filtermöglichkeiten mithilfe von Veranstaltungsfeldern angelegt haben, können Sie das Widget auch nach diesen vorfiltern, indem Sie den bereits angepassten Code noch wie unten beschrieben erweitern.
Zum Erstellen eines vorgefilterten Widgets, fügen Sie Ihrem bestehenden Widgetcode folgenden Parameter hinzu, geben die gewünschten Kriterien ein und löschen alle nicht benötigten Zeilen innerhalb der äußeren geschwungenen Klammer, die Sie nicht benötigen:
data-viovendi-search-prefill='{
"keywords": "",
"location": "cityName",
"from_date": "YYYY-MM-DD",
"to_date": "YYYY-MM-DD",
"filters": {
"selection-attribute-name": ["option1", "option2"]
}
}'
Hier sehen Sie einen vollständiger Beispielcode für eine vorgefiltertes Kalender-Widget nach dem Veranstaltungsort “London”
<div class="viovendi-widget viovendi-event-list-widget"
data-viovendi-locale="de-de"
data-viovendi-widget-config-name="list-13369-2715"
data-viovendi-organizer="13369"
data-viovendi-search-prefill='{
"location": "London"
}'
></div>
<script type="text/javascript" src="https://doo.net/viovendi-embed.js" data-viovendi-version="1"></script>
Wenn Sie nach virtuellen Veranstaltungen filtern möchten, geben Sie in der Location-Zeile statt eines Ortes “virtual” ein.
Nachfolgend sehen Sie einen Beispielcode für ein Widget, bei dem ein Filter für das Veranstaltungsfeld “Event-Typ” eingefügt wurde und die Veranstaltungen des Typs “Messe” vorausgewählt werden.
<div class="viovendi-widget viovendi-event-list-widget"
data-viovendi-locale="de-de"
data-viovendi-widget-config-name="list-13369-2715"
data-viovendi-organizer="13369"
data-viovendi-event-filters='[
{
"label": "Event-Typ",
"options": ["Kongress", "Messe", "Roadshow", "Online-Event"]
}
]'
data-viovendi-search-prefill='{
"filters": {
"Event-Typ": ["Messe"]
}
}'
</div>
<script type="text/javascript" src="https://doo.net/viovendi-embed.js" data-viovendi-version="1"></script>
Wenn Sie den angepassten Code in Ihre Webseite integrieren, wird nur die entsprechende Unterauswahl der Veranstaltungen angezeigt, auf die alle Filter zutreffen.
In der technischen Dokumentation zu Widgets finden Sie diese Funktion unter “Prefill the search filters”.
Tipp: Sie können das Vorbefüllen auch über URL-Parameter steuern. So können Sie zum Beispiel in Ihren E-Mails eine Liste mit Links zu den unterschiedlichen Event-Typen einfügen. Je nachdem, auf welchen Link der Empfänger klickt, sieht er auf der Seite, auf der das Widget eingebunden ist, nur die Veranstaltungen der gewünschten Art. Gleichzeitig müssen sie nicht mehrere Widgets auf eigene Seiten legen. Der Hauptlink kann immer auf die gleiche Seite mit dem gleichen Widget verweisen. Durch die URL-Parameter wird im Link die Information mitgegeben, welche Filter wie vorbefüllt werden sollen. Mehr zu URL-Parametern finden Sie auch in unserer technischen Dokumentation zu Widgets.
3. Widget mit fest definierter Veranstaltungsauswahl
Wenn Besucher nur bestimmte Veranstaltungen Ihrer Organisation sehen sollen, können Sie vorab im Hintergrund die Auswahl der Veranstaltungen festlegen. Die Zuordnung, ob eine Veranstaltung im Widget auftauchen soll oder nicht, funktioniert auch hier über interne Veranstaltungsfelder, allerdings mit dem Unterschied, dass alle Veranstaltungen, die Sie dem Widget nicht aktiv zuordnen, für Ihre Besucher nicht im Widget einsehbar sind.
Um so ein Widget zu erstellen, gehen Sie wie folgt vor:
1. Erstellen Sie zunächst ein neues Veranstaltungsfeld und vergeben Sie einen Feldnamen z.B. den Namen “Homepage” (Achtung: der Name muss aus nur einem Wort bestehen und darf keine Leerzeichen oder Sonderzeichen enthalten!), wählen das Eingabeformat “Freitext” und aktivieren die Checkbox “Internes Feld, keine Anzeige im Buchungsprozess”. Wenn Sie das Feld bei neu angelegten Veranstaltungen nicht immer selbst manuell einfügen möchten, können Sie ggf. die Checkbox “Bei neuen Veranstaltungen standardmäßig hinzufügen” zusätzlich aktivieren. Allgemeine Informationen dazu finden Sie in unserem Artikel zu Veranstaltungsfeldern.
2. Erstellen Sie nun eine neue Veranstaltung oder rufen eine bereits erstellte auf und scrollen Sie im ersten Schritt der Veranstaltungserstellung (“Veranstaltungsinformationen“) bis nach unten, klicken unter “Erweiterte Einstellungen” auf “Veranstaltungsfeld hinzufügen” und wählen das entsprechende Feld aus. Wenn Sie eine neue Veranstaltung erstellen und in den Organisationseinstellungen vorab die Checkbox “Bei neuen Veranstaltungen standardmäßig hinzufügen” aktiviert haben, taucht das Feld bereits automatisch auf.
3. Geben Sie dann im Textfeld eine beliebige Eingabe ein, z.B. noch einmal “Homepage”, und bestätigen die Erstellung durch Klick auf “Feld anlegen”.
4. Klicken Sie unten auf der Seite auf “Speichern”, um die Änderungen an den Veranstaltungsinformationen zu übernehmen.
5. Fügen Sie das Feld “Homepage” nun für alle Veranstaltungen hinzufügen, die im Widget auftauchen sollen, indem Sie die entsprechenden Veranstaltungen alle wie oben beschrieben bearbeiten.
6. Nachdem Sie diese Vorbereitungen getroffen haben, rufen Sie die Veranstaltungsübersicht erneut auf, klicken auf “Integration in Ihre Webseite” und erstellen das gewünschte Widget (Kalender oder Tabelle). Alle Informationen zur Erstellungen finden Sie in unserem Artikel zum Thema Widgets.
7. Im nächsten Schritt muss für den Filter der Code des erstellten Widgets manuell angepasst und die folgende Zeile vor dem ersten “>” eingefügt werden:
data-viovendi-event-attributes="IhrVeranstaltungsfeldname"
8. Der angepasste Widgetcode sollte mit der eingefügten Zeile dann (mit anderen Zahlen) etwa so aussehen:
<div class="viovendi-widget viovendi-event-list-widget" data-viovendi-locale="de-de" data-viovendi-organizer="123456" data-viovendi-widget-config-name="list-123456-123" data-viovendi-event-attributes="Homepage"> </div> <script type="text/javascript" src="https://doo.net/viovendi-embed.js" data-viovendi-version="1"></script>
9. Integrieren Sie den Code an gewünschter Stelle in Ihre Webseite. Nur die Veranstaltungen, bei denen das entsprechende Feld hinterlegt ist, werden in der Übersicht auftauchen. Sie können laufend neue Veranstaltungen hinzunehmen oder entfernen, indem sie die jeweiligen Veranstaltungsinformationen bearbeiten und das Feld “Homepage” hinzufügen bzw. löschen.
In der technischen Dokumentation zu Widgets finden Sie diese Funktion unter “Pre-filter by custom event field”.