Zum Hauptinhalt springen

Ein Custom Widget erstellen

Erfahren Sie, wie Sie mit dem Widget Builder benutzerdefinierte Widgets von Grund auf erstellen.

Ein Custom Widget erstellen​

Richten Sie Ihr Custom Widget in wenigen einfachen Schritten ein, indem Sie den folgenden Anweisungen folgen und ein einfaches „Hello World"-Widget von Grund auf erstellen.

Schritte zum Erstellen eines Custom Widgets​

  1. Ein neues Widget erstellen​

    Navigieren Sie über die rechte Seitenleisten-Navigation zu Custom Widgets und klicken Sie auf die Schaltfläche New Custom Widget.

  2. Allgemeine Informationen ausfüllen​

    Geben Sie den Namen Ihres Widgets im Titelfeld ein und wählen Sie ein Symbol für Ihr Widget.

     Hello World
    Hello World Icon

  3. Ein einfaches Layout hinzufügen​

    Überspringen Sie alle anderen Optionen und gehen Sie direkt zum Layout-Editor, indem Sie den Layout Tab auswählen. Fügen Sie im Layout-Editor eine einfache HTML-Struktur mit einem div-Element hinzu, das den Text „Hello World" enthält.

    <div>Hello World</div>

  4. Ihr Widget speichern​

    Stellen Sie sicher, dass Sie den Schalter Available in Staffbase im General Tab aktiviert haben, um Ihr Widget in der Staffbase-Plattform verfügbar zu machen. Klicken Sie dann auf die Schaltfläche Save, um Ihr allererstes Custom Widget zu erstellen.

    info

    Wenn Sie nur Ihren aktuellen Fortschritt speichern und später daran weiterarbeiten möchten, ohne es in der Staffbase-Plattform verfügbar zu machen, können Sie den Schalter Available in Staffbase deaktivieren.
    Auch wenn Sie Ihr Widget testen möchten, müssen Sie das Widget nicht jedes Mal in der Staffbase-Plattform entfernen. Sie können einfach den Schalter Available in Staffbase im Widget Builder deaktivieren und es wird in Staffbase nicht sichtbar sein.

  5. Ihr Widget veröffentlichen​

    Nachdem Sie Ihr Widget gespeichert haben, gehen Sie zu Ihrer Staffbase App und fügen Sie Ihr neu erstelltes Widget einer Seite hinzu, um es in Aktion zu sehen.

    Gehen Sie in der Staffbase App zu einer Seite Ihrer Wahl und klicken Sie auf die Schaltfläche Edit. Klicken Sie im Page content Editor auf die Schaltfläche + / Add Widget und wählen Sie Ihr Widget aus der Liste der verfügbaren Widgets.

    Das war's! Sie haben erfolgreich Ihr erstes Custom Widget mit dem Widget Builder erstellt.