© Kellie L. Folkerts/Shutterstock.com
Konfiguration von Display-Templates für Suchergebnisse

Treffend dargestellt


Alleine durch die Integration der FAST-Suche in SharePoint 2013 ist die Suche um ein Vielfaches leistungsstärker geworden. Darüber hinaus bietet die neue Suche interessante Anpassungs- und Erweiterungsmöglichkeiten. Beispielsweise muss die Darstellung der Suchergebnisse nicht wie beim Vorgänger umständlich über XSL-Templates angepasst werden, sondern das Rendern der Trefferliste kann mit JavaScript vorgenommen werden. Für die meisten Entwickler dürfte das eine willkommene Neuerung darstellen. Durch die Einführung der auf HTML und JavaScript basierenden Display-Templates bietet es sich förmlich an, die mitgelieferten Standardtemplates per JavaScript um weitere Ergebnis- und Darstellungslogik zu erweitern. In Kombination mit den ebenfalls neuen Callouts und Hover-Panels stehen somit einfache Wege offen, die Benutzerfreundlichkeit und die Effizienz der neuen Suche noch weiter zu steigern.

Hierbei hat sich die Enterprise-Suche von SharePoint 2013 zur idealen Lösung entwickelt. Nicht nur weil sie über scheinbar unendliche Anpassungsmöglichkeiten verfügt, sondern auch weil sie einen entscheidenden Vorteil gegenüber ihrer prominenten Konkurrenz besitzt: Die Nutzer der Suche sind bekannt, sie sind keine anonyme Masse von Personen, deren Ambitionen erahnt werden müssen, sondern es sind Mitarbeiter mit konkreten Funktionen, Arbeitsbereichen und Aufgaben. Darüber hinaus sind die benutzbaren Informationen und Inhalte zumeist strukturiert und mit Metadaten angereichert, mehr als nur Volltext. Besonders interessant ist die Kombination dieser Vorteile mit Aufgaben und Tätigkeiten, die direkt im Anschluss an die Suche aus der Trefferdarstellung heraus durchgeführt werden können. So kann eine in SharePoint zentralisierte Enterprise-Suche als Schnittstelle und Einstiegspunkt zu einer komplexen Informationslandschaft dienen und aufgrund strukturierter Daten zielgerichtete Tätigkeiten ermöglichen.

In diesem Artikel werden wir nicht nur die Grundlagen für das Anpassen von Display-Templates und Hover Panels vermitteln, sondern anhand eines Projektbeispiels zeigen, wie die SharePoint-Standard-Ergebnisauflistung durch clientseitigen Code um für die Ergebnisauswahl relevante Informationen auch von externen Quellen erweitert werden kann. Das Beispiel wird zum Download bereitgestellt und kann als Basis für eigene Anpassungen genutzt werden.

Für unser Beispiel wird Microsofts SharePoint Designer 2013 benötigt, der unter [1] kostenlos heruntergeladen werden kann. Der SharePoint Designer ist gemeinsam mit Expression Web der Nachfolger von FrontPage zum Bearbeiten von Webseiten. Während Expression Web zum Erstellen beliebiger Webseiten verwendet werden kann, wurde der SharePoint Designer spezifisch zum Erstellen und Bearbeiten von Webseiten in SharePoint entwickelt. Er bietet mehr Kontrolle als die eingebauten Bearbeitungsmöglichkeiten in SharePoint. Konnte die erste Version von 2007 noch als eigenständiger HTML-Editor verwendet werden, sind die Versionen 2010 und 2013 ausschließlich in Kombination mit SharePoint verwendbar. Das Arbeiten mit dem SharePoint Designer ist dabei nur mit aktiver Verbindung zum entsprechenden Server möglich, einen Offlinemodus gibt es derzeit nicht. Dennoch erleichtert der SharePoint Designer das Bearbeiten von Dateien auf dem SharePoint-Server sehr. So wird eine Datei beim Speichern direkt auf dem Server gesichert und ist dort sofort verfügbar. Alternativ können Sie die Display-Templates auch in einem Text- oder HTML-Editor Ihrer Wahl bearbeiten, allerdings ist dies oft sehr viel umständlicher.

Die Überführung der einfachen Out-of-the-box-Such- und Trefferdarstellung in eine effektivere Anwendungsform kann recht einfach über HTML- und JavaScript-basierte Display-Templates und Hover-Panels erfolgen, die je nach Treffer/Ergebnistyp eine unterschiedliche Darstellung und Funktionen anbieten. Diese Funktionalität ist in SharePoint 2013 nicht neu, sie wurde jedoch im Vergleich zur Vorgängerversion sehr stark und kann mit wenig Einarbeitungszeit realisiert werden. In diesem Artikel erhalten Sie einen Überblick, welche Möglichkeiten sich anbieten und wie diese in einem tatsächlichen Projektszenario umgesetzt wurden.

Display-Templates und Hover-Panels

Display-Templates dienen der unterschiedlichen Darstellung einzelner Suchtreffer (Abb. 1, Nummer 1). Handelt es sich bei einem Treffer z. B. um ein Word-Dokument, wird das Display Template für Word-Dokumente verwendet. Dies beschränkt sich jedoch nicht nur auf Dateiformate, sondern auch auf Inhaltstypen. So gibt es für Kontakte, Personen, Microfeed-Einträge, Aufgaben und Diskussionsbeiträge jeweils eigene Display Templates. Neben den Display-Templates für einzelne Elemente einer Suchergebnisliste gibt es „Control Displays“ (Abb. 1, Nummer 2). Diese werden im Webpart nur einmalig aufgerufen und strukturieren die Sucherergebnisse in Listen.

Hover-Panels sind eine besondere Form von Display-Templates, die bei Bewegung der Maus über einen Suchtreffer eingeblendet werden. In ihrem Aussehen ähneln sie den aus SharePoint 2013 bekannten Callouts, die beim Klick auf die Auslassungspunkte eines Elements erscheinen. Hover-Panels unterscheiden sich jedoch in ihrer Logik und besitzen einen anderen Aufbau. Jedes Display-Template referiert über die Variable var hoverUrl auf ein eigenes Hover-Panel. Hover-Panels können ebenso wie Display-Templates bearbeitet und angepasst werden und bieten darüber hinaus Möglichkeiten zur Benutzeraktion (Abb. 1, Nummer 3).

Das Szenario

Nachfolgend wird der konkrete Einsatz von Display-Templates und Hover-Panels an einem tatsächlichen Projektbeispiel vorgestellt: Ein mittelständischer Lieferant erhält auf dem Postweg täglich über 55 S...

Neugierig geworden? Wir haben diese Angebote für dich:

Angebote für Gewinner-Teams

Wir bieten Lizenz-Lösungen für Teams jeder Größe: Finden Sie heraus, welche Lösung am besten zu Ihnen passt.

Das Library-Modell:
IP-Zugang

Das Company-Modell:
Domain-Zugang