Konfigurieren und Hinzufügen von Widgets in Webanwendungen

Binden Sie in von Ihnen häufig verwendeten Webanwendungen die Knowledge-Integrator-Widgets ein.

Die Widgets erlauben Ihnen einen einfachen Zugriff von externen Webanwendungen auf Ihre Knowledge-Inhalte. Zur Zeit haben Sie die Möglichkeit über das Widget Integrator-Schaltfläche eine Schaltfläche in die Applikation zu bringen, über die Sie Serviceware Knowledge einfach öffnen können. Über das Widget Integrator-Hilfstext kann ein Hilfetext entweder in Form eines Knowledge-Textes oder als Tooltipp eingeblendet werden.Zur Integration von Widgets für den Knowledge-Integrator in andere Webanwendungen benötigen Sie Kenntnisse in HTML, CSS sowie jQuery.
Tipp: Informationen zur Verwendung von Selektoren: https://api.jquery.com/all-selector/ und https://wiki.selfhtml.org/wiki/CSS/Tutorials/Selektoren.

Screenshot: Widget-Einstellungen für Integrationen
Gehen Sie zur Einbindung von Widgets in Webanwendungen wie folgt vor:
  1. Öffnen Sie die Optionen für die Widgets über das Integrator-Kontextmenü im Browser und Einstellungen > Optionen > Widgets.
  2. Wählen Sie + Widget hinzufügen.
    Der Dialog zum Einfügen eines Widgets öffnet sich.
  3. Wählen Sie ein Widget aus dem Drop-down-Menü verfügbarer Widgets für den Knowledge-Integrator.
  4. Geben Sie die URL der Webanwendung an, in die das Widget eingebunden wird.
  5. Geben Sie an, welcher URL-Typ angegeben wird:
    • Domäne: eine allgemeine Domäne, beispielsweise www.docs.serviceware-se.com
    • Wildcard: Abschnitte der URL können durch * ersetzt werden, beispielsweise *.google*
    • Regexp: Die URL kann durch einen regulären Ausdruck spezifiziert werden, beispielsweise .*google\.[(com)|(de)]
  6. Geben Sie den Selektor zur Platzierung des Widgets an. Es können mehrere Selektoren angegeben werden, wovon der erste vom Integrator berücksichtigt wird. Verändern Sie bei Bedarf die Reihenfolge der Selektoren per Drag & Drop. Den Selektor für die Platzierung finden Sie über Die Entwickler-Tools im Browser bei den Elementen der Seite.
    Screenshot: Browser Developer-Tools; Auswahl des Elementtyps
    • CSS-Selektor; handelt es sich um eine Klasse oder eine ID, muss „.“ bzw. „#“ vor dem Befehl eingefügt werden.
      Screeenshot: Einfügen eines Selektors für die Widget-Platzierung im CSS-Format
    • jQuery-Selektor; Ein Dialog wird geöffnet, in dem der Selektor definiert werden kann. Bestätigen Sie die Eingabe.
      Screenshot: Parameter zum Einfügen einer Platzierung als jQuery-Selector
  7. Geben Sie die Platzierungsposition an.
    • Davor; das Widget wird vor dem Zielelement angeordnet.
    • Erstes Kind; das Widget wird innerhalb des Zielelements am Anfang vor dem ersten Kind angeordnet.
    • Letztes Kind; das Widget wird innerhalb des Zielelements am Ende vor dem letzten Kind angeordnet.
    • Danach; das Widget wird nach dem Zielelement dargestellt.
  8. Haben Sie das Widget Integrator-Hilfstext ausgewählt, wählen Sie Parameter konfigurieren und geben die ID des Hilfetextes aus der Knowledge-Datenbank an, der über das Widget geöffnet werden soll. Entscheiden Sie, ob das Widget als Tooltipp angezeigt wird.
  9. Geben Sie HTML-Code für die Platzierung an, um sie der Struktur und dem Stil der Zielanwendung anzupassen. Die Eingabe ist optional. Im HTML-Code muss die ID des Widgets enthalten sein. 
    <div id="widget"/>

Einfügen des Widgets Integrator-Schaltfläche

Verwenden Sie die folgenden Parameter zum einfügen einer Schaltfläche zum Aufrufen des Hilfe-Textes innerhalb der Serviceware Webhelp vor dem Suchfeld.


Screenshot: Beispiel für das Widget Integrator Help Text
Name
Integrator Button
URL
www.doc.servicware-se.com
Typ
Domain
Selektor für die Platzierung
CSS
#searchForm
Davor