Ein Design (Theme) legt die Markenfarben, Schriften, Eckenradien und Schatten deiner Community fest, getrennt für den hellen und den dunklen Modus. Mit Designs passt du die Community an das Farbschema deiner Marke an und legst fest, ob Mitglieder deine Community standardmäßig hell oder dunkel sehen.
Wer kann das tun: Community-Inhaber und -Administratoren. Mitglieder wählen ihren hellen oder dunklen Modus selbst. · Wo: Web (Admin-Konsole). Mitglieder wechseln den Modus im Web und in der Mateflow-App. · Tarif: Designs und Farben sind an keinen Tarif gebunden. Benutzerdefiniertes CSS hängt von deinem Plattform-Tarif ab.
Designs-Seite öffnen
Gehe zu Admin → Darstellung → Designs. Du kannst auch auf der Branding-Seite auf Farben & Schriften in Themes verwalten → klicken.
- Aktives Design zeigt das Design, das Mitglieder gerade sehen. Es trägt das Abzeichen Live.
- Design-Bibliothek listet deine anderen Designs auf. Du kannst sie durchsuchen oder sortieren, zum Beispiel nach Zuletzt aktualisiert.
- Die Schaltflächen oben heißen App Theme, Settings und Add Theme.
Neues Design aus einer Vorlage hinzufügen
- Klicke auf Add Theme.
- Gib einen Theme-Name ein (bis zu 50 Zeichen).
- Wähle eine Vorlage. Nutze Vorlagen suchen... oder den Filter Kategorie, um eine zu finden. Ein Design beginnt immer mit einer Vorlage.
- Um es sofort live zu schalten, hake Sofort veröffentlichen an.
- Klicke auf Theme erstellen.
Um stattdessen ein vorhandenes Design zu kopieren, öffne sein Menü ⋯, klicke auf Klonen, gib einen Neuer Theme-Name ein und klicke auf Theme klonen. Die Kopie übernimmt alle hellen und dunklen Farben, die Typografie, Abstände, Rahmen und Schatten.
Farben und Schriften eines Designs bearbeiten
Klicke beim aktiven Design auf Anpassen oder öffne das Menü ⋯ eines anderen Designs und klicke auf Bearbeiten. Der Editor öffnet sich mit Theme bearbeiten: und dem Namen des Designs.
- Wähle unter Farbmodus die Option Hell oder Dunkel. Jeder Modus hat eigene Farben, lege also beide fest.
- Lege im Tab Farben Farben wie Background, Primary, Accent, Card und Sidebar fest. Jede Textfarbe zeigt ihr Kontrastverhältnis. Klicke auf Smart-Anpassung, um eine Farbe zu korrigieren, die die Kontraststufe WCAG AA nicht erreicht.
- Wähle im Tab Typografie die Schriftfamilie und den Zeichenabstand.
- Lege im Tab Sonstiges den Rahmenradius und den Schatten fest. Dort findest du auch Benutzerdefiniertes CSS, sofern dein Plattform-Tarif es enthält.
- Prüfe die Live-Vorschau. Wechsle zwischen Feed, Post, Profil und UI sowie zwischen Desktop-Ansicht und Mobilansicht.
- Klicke auf Speichern.
Wenn du das aktive Design speicherst, ändert sich, was Mitglieder sehen. Um Änderungen gefahrlos auszuprobieren, bearbeite ein Design in der Bibliothek und veröffentliche es, wenn es fertig ist.
Design veröffentlichen
Klicke in der Design-Bibliothek bei einem Design auf Veröffentlichen. Es erscheint dann unter Aktives Design, und das bisherige Design wandert zurück in die Bibliothek. Es ist immer nur ein Design live.
Du kannst jedes Design außer dem Live-Design löschen: Öffne sein Menü ⋯, klicke auf Löschen und bestätige. Das Löschen kann nicht rückgängig gemacht werden.
Frühere Version eines Designs wiederherstellen
Mateflow speichert jedes Mal einen Snapshot eines Designs, wenn es bearbeitet, veröffentlicht oder zurückgesetzt wird.
- Öffne das Menü ⋯ des Designs und klicke auf Verlauf.
- Suche im Versionsverlauf die gewünschte Version und klicke auf Zurücksetzen.
- Bestätige. Mateflow speichert zuerst den aktuellen Stand als neuen Snapshot, sodass du das Zurücksetzen rückgängig machen kannst.
Hellen oder dunklen Standardmodus festlegen
Der Standardmodus gilt für alle, die keinen eigenen Modus gewählt haben.
- Klicke auf der Designs-Seite auf Settings.
- Wähle unter Standard-Darstellung die Option Hell, Dunkel oder System (Auto). System (Auto) folgt der Geräteeinstellung der jeweiligen Person.
- Klicke auf Einstellungen speichern.
So wechseln Mitglieder zwischen hellem und dunklem Modus
Mitglieder können deinen Standard jederzeit überschreiben:
- Web: Sie klicken auf ihren Avatar und dann auf Darstellung (oder gehen zu Einstellungen → Darstellung). Unter Design wählen sie Community folgen, System, Hell oder Dunkel. Community folgen zeigt an, welchen Modus du als Standard festgelegt hast.
- App: Sie öffnen Einstellungen und Datenschutz → Darstellung. Unter Design wählen sie Wie Community, Wie System, Hell oder Dunkel.
Mitglieder können kein anderes Design wählen. Die Farben deines veröffentlichten Designs gelten für alle, in dem Modus, den sie wählen.
Der Mateflow-App eigene Farben geben
Standardmäßig verwendet die Mateflow-App die Farben deines Live-Designs im Web. So änderst du sie nur für die App:
- Klicke auf der Designs-Seite auf App Theme.
- Wähle Hell oder Dunkel und lege dann die Farben fest, die du ändern möchtest. Farben, die du leer lässt, verwenden die Standardwerte der App. Derive from web füllt einen ersten Entwurf aus deinem Web-Design aus.
- Klicke auf Speichern.
Die App-Anpassung wird mit deinem Live-Design gespeichert, und die App behält ihre eigenen Schriften. Damit die App wieder deinem Web-Design folgt, klicke auf Clear override und bestätige.
Verwandte Artikel
War dieser Leitfaden hilfreich?