Webseiten-Element

Mit dem Webseiten-Element ist es möglich,

1. eine externe Webseite mittels URL in NEO einzubinden.
2. in NEO selbst eine Webseite zu erstellen, die auch einen Gerätestatus oder den Status einer Variablen visualisieren kann.

Eine externe Webseite mittels URL in NEO einbinden.

Mit dem Element Webseite ist es möglich, eine Internetseite in Ihre Fernbedienungsoberfläche einzubinden. Das Einfügen erfolgt über das Ziehen des „Webseite“-Symbols auf die Fernbedienungsseite. Es erscheint ein neues Element, angezeigt durch eine graue Fläche.

Über die im Eigenschaften-Menü angebotenen Einstelloptionen kann nun dem Element eine bereits in der Webseiten-Verwaltung gespeicherte Webseite zugewiesen werden. Alternativ können Sie auch eine neue Webseite direkt im Eigenschaftenmenu anlegen und zuweisen.

Die Größe und Position des des Webseiten-Elementes können Sie entweder über die Eck-Bedienelemente oder über das Eigenschaftenmenü festlegen. Darüber hinaus können Sie die Auto-Refresh-Option mit einem Haken aktivieren, wenn die Webseite sich automatisch aktualisieren soll.

Webseiten-Verwaltung

Dieser Bereich dient zur Verwaltung der integrierten/zugewiesenen Webseiten bzw. zum integrieren einer neuen Webseite. Die Eigenschaften der links selektierten Seite stehen jeweils im rechten Feld.

Anlegen einer neuen Webseite

Zum Anlegen einer neuen Webseite drücken Sie bitte das Plus-Symbol.Jetzt können Sie einen Namen vergeben und die URL eintragen.

In NEO selbst eine Webseite erstellen, die auch einen Gerätestatus oder Status einer Variablen visualisieren kann.

Anstatt eine externe Webseite einzubinden, können Sie das Webseiten-Element auch nutzen, um in NEO selbst Inhalte mittels HTML und CSS zu erzeugen. Sie können dem Webseiten-Element auch einen Status zuweisen und diesen grafisch gestalten und aufbereiten.

Um dem Webseiten-Element einen Status zuzuweisen, ziehen Sie das Element auf die Arbeitsfläche und klicken Sie dann in der rechten Eigenschaftsleiste auf Status zuweisen.

Wählen Sie im nächsten Schritt den Status, den Sie über das Webseiten-Element visualisieren möchten und klicken Sie auf Übernehmen.

Klicken Sie anschließend in der rechten Eigenschaftsleiste auf HTML-Gerüst festlegen.

Nun können Sie damit beginnen das Gerüst für Ihren Status festzulegen.

In der App-Vorschau können Sie sich die Optik und Funktionsweise Ihres Webseiten-Elements anzeigen lassen.

Das Webseiten-Element nutzen, um bspw. ein Wetter-Widget einzufügen

Sie können das Webseiten-Element auch verwenden, um HTML-Widgets, die aktuelle Werte abrufen (wie ein Wetter-Widget) einzufügen.

Ziehen Sie ein Web-Element auf die Seite oder wählen Sie eines aus. Klicken Sie nun in den Eigenschaften auf „HTML Gerüst festlegen“. Hier sehen Sie einige Felder zur Eingabe von HTML-Code, der von Benutzern mit HTML-Kenntnissen leicht verwendet werden kann. Aber auch ohne HTML-Kenntnisse können Sie sehr leicht ein Wetter-Widget erstellen.

Am einfachsten ist es hierfür eines der vielen im Internet angebotenen Widgets zu verwenden, die Sie auf vielen Wetterseiten angeboten bekommen. Wählen Sie einfach einen Anbieter aus, der Ihnen am besten gefällt. Dort können Sie in der Regel einige Einstellungen vornehmen (wie den Ort usw.) und erhalten dann einen fertigen Block mit HTML-Code, den Sie einfach in das Feld Hauptbereich hineinkopieren.

Im Bereich Dokument-Beginn können Sie bei Bedarf Anpassungen vornehmen (z.B. den Parameter invisible hinzufügen, falls kein Hintergrund angezeigt werden soll)

Nachdem man die Eingaben gespeichert hat, kann man die Größe des Web-Elemts an die Größe des Wicgets anpassen und das Autorefresh-Zeitintervall z.B. auf 30 Sekunden setzen.

In einem Pop-up könnte das dann so aussehen (hier wurde ein Widget von meteoblue verwendet)

Mit dem Webseiten-Element eigene Bedienelemente gestalten

Sie können das Webseiten-Element auch verwenden, ohne einen Gerätestatus zuzuweisen und auf diese Weise vielfältige Gestaltungselemente in NEO ergänzen. Z.B. können Sie so eigene Button-Hintergründe in den AIO CREATOR NEO integrieren.

Indem Sie dann den Hintergrund eines gängigen NEO-Buttons löschen …

… und das verbleibende Icon auf Ihren eigenen Button legen, können Sie Ihrem so erstellten eigenen Button anschließend auch einen Status oder einen Befehl zuweisen.

Mit dem NEO Webseiten-Element können Sie Ihre Gerätestatus auf vielfältige Art visualisieren. In unserem Tech-Tipp auf dem mediola-Blog zeigen wir, wie z.B. auch Diagramme für Gerätestatus mit dem Webseiten-Element realisiert werden können. —