In Haiilo kannst du das Design so anpassen, dass es deinem Corporate Design (CD) und deinen Markenrichtlinien anpassen. So fühlen sich deine Nutzerinnen und Nutzer auf Anhieb wohl.
Grundlagen
Für jedes erstellte Theme kannst du die Farben und Logos in der Administration > Designs. Wenn du über das nötige Know-how hast, kannst du auch erweiterte Anpassungen über CSS vornehmen.
Darüber hinaus hast du die Möglichkeit, weitere Themen zu erstellen über Design hinzufügen. Auf diese Weise kannst du verschiedene Designs für verschiedene Zielgruppen konfigurieren, zum Beispiel für Tochtergesellschaften.
Jedes Haiilo wird mit einem Standard-Design geliefert, das jedem Benutzer angezeigt wird, wenn er noch nicht registriert haben. Dieses Design kann geändert, aber nicht gelöscht werden.
Farben
Ein wesentliches Element, um deine Haiilo-Oberfläche lebendiger zu gestalten, ist die Anpassung der Farben. Du verwendest hexadezimale Werte, um genau zu definieren, welche Farben in der Oberfläche verwendet werden sollen (z.B. #FF0000).
- Hauptfarbe: Die Primärfarbe definiert die Schriftfarbe in der Subnavigationsleiste für Homepages. Sie bestimmt auch die Hintergrundfarbe für die Anmeldeseite.
- Unterer Rand der Navigation: Fügt einen Farbakzent unterhalb der Hauptnavigation. Eine kontrastierende Farbe ist eine Option, um eine klare Unterscheidung von der Hauptnavigation.
- Hintergrund der Navigation: Die Hauptfarbe der Leiste. Wenn du hier eine helle Farbe verwendest, solltest du eine dunklere Schriftfarbe wählen.
- Textfarbe der Navigation: Dieser Teil bestimmt die Farbe des Textes und der Icons in der Navigationsleiste. Wir empfehlen, eine Farbe zu wählen, die die mit dem Hintergrund der Navigationsleiste kontrastiert (z. B. weißer Hintergrund mit schwarzem Text oder dunkelblauer Hintergrund mit weißem Text).
- Navigation aktiv: Die Farbe, die die Navigationsleiste haben soll sein soll, wenn sie aktiv ausgewählt ist, d.h. dort, wo sich der Nutzer gerade befindet. Wenn dieses Verhalten nicht erwünscht ist, nimm einfach die gleiche Farbe wie für den Hintergrund der Navigation.
- Verlaufsfarbe: Die Verlaufsfarbe legt fest, in welche andere Farbe die Hintergrundfarbe auf der Anmeldeseite übergehen soll.
- Button Hintergrundfarbe: Die Hintergrundfarbe für feste Buttons in der Benutzeroberfläche, z.B. Seite erstellen, Speichern.
- : Die Textfarbe für feste Schaltflächen in der Oberfläche.
- Linkfarbe: Die Farbe für Hyperlinks in der Benutzeroberfläche.
- Textfarbe: Die Farbe des gesamten Textes, außer bei Elementen, bei denen die Textfarbe separat bearbeitet werden kann, z. B. im Rich Text Editor Widget.
Logos
Im zweiten Reiter der Themeneinstellungen kannst du dein Logo hochladen.
Die folgenden Optionen sind in Haiilo verfügbar:
- Das Front-Logo wird auf dem Anmeldebildschirm angezeigt und sollte mindestens 80px hoch sein.
- Das Logo in der Navigation steht immer oben links in der Navigation und sollte mindestens 100px hoch sein.
- Das Favicon wird normalerweise in der Adressleiste des Browsers Adressleiste, im Browser-Tab, in den Lesezeichen und links neben der URL angezeigt. Das Bild sollte 16x16px groß sein und das Dateiformat .ico haben.
- Das iOS Homescreen Icon erscheint als Symbol, wenn du die die URL deines Haiilo auf dem Homescreen deines iPhones speicherst, und es sollte mindestens 180x180px groß sein.
Erweitert
Im dritten Abschnitt der Designeinstellungen kannst du CSS-Anpassungen vornehmen. Du kannst an dieser Stelle mit CSS zum Beispiel die Schriftart ändern, zusätzliche Hintergrundfarben (oder Bilder) einfügen und noch vieles mehr.
Alle Anpassungen sollten mit Bedacht gewählt werden, da sie sich auf die Aktualisierungen auswirken können. Für diesen Teil der Designanpassungen empfehlen wir fundierte CSS-Kenntnisse.
Wenn Änderungen in diesem Bereich vorgenommen wurden und sich als falsch herausstellen, dann fällt diese Korrektur nicht unter die regulären Supportleistungen von Haiilo fallen. Wenn du CSS-Anpassungen benötigst, empfehlen wir dir, dich an erfahrene Berater in diesem Bereich zu wenden.
Für bestimmte Bereiche von Haiilo sind benutzerdefinierte CSS möglicherweise nicht verfügbar, da wir uns das Wir behalten uns das Recht vor, die Nutzung für eine optimale Funktionalität der Plattform einzuschränken.