Artikel-Layout
Liste, Karten oder Magazin-Stil.
Design anpassen
Im letzten Schritt des News-Setups wählst du das Layout und die Darstellung für dein News-Modul. Diese Einstellungen bestimmen das grundlegende Aussehen der Artikel-Übersicht und Artikel-Detailansicht.
Übersicht
Section titled “Übersicht”Das News-Design besteht aus mehreren Bereichen:
Bild-Darstellung
Wie Artikel-Bilder angezeigt werden.
Kategorie-Anzeige
Wie Kategorien dargestellt werden.
Vorschau-Optionen
Wie viel vom Artikel angezeigt wird.
Layout-Optionen
Section titled “Layout-Optionen”Das News-Modul bietet 3 Layout-Optionen für die Artikel-Übersicht:
1. Liste
Section titled “1. Liste”| Eigenschaft | Wert |
|---|---|
| Stil | Vertikale Liste |
| Platzbedarf | Kompakt |
| Übersicht | Viele Artikel auf einen Blick |
Artikel werden in einer vertikalen Liste angezeigt.
Design-Merkmale:
- Kompakte Darstellung
- Artikel-Titel prominent
- Kleines Vorschaubild (Thumbnail)
- Datum und Kategorie in einer Zeile
- Schnelles Scrollen
Vorteile:
- Mehr Artikel sichtbar
- Schnelle Übersicht
- Klassisches News-Feeling
- Platzsparend
Empfohlen für:
- News-reiche Apps
- Mobile-optimierte Ansichten
- Nutzer, die viele Artikel scannen
- Schnelle Information
2. Karten
Section titled “2. Karten”| Eigenschaft | Wert |
|---|---|
| Stil | Moderne Cards |
| Platzbedarf | Mehr Platz |
| Übersicht | Weniger, aber detaillierter |
Artikel werden als moderne Karten angezeigt.
Design-Merkmale:
- Großes Artikelbild
- Titel und Vorschautext sichtbar
- Kategorie-Badge
- Schatten und Abstände
- Modernes Look & Feel
Vorteile:
- Visuell ansprechend
- Bilder kommen zur Geltung
- Mehr Kontext pro Artikel
- Moderne Ästhetik
Empfohlen für:
- Bild-lastige News
- Magazin-ähnliche Apps
- Desktop-optimierte Ansichten
- Design-fokussierte Projekte
3. Magazin
Section titled “3. Magazin”| Eigenschaft | Wert |
|---|---|
| Stil | Editorial Layout |
| Platzbedarf | Am meisten |
| Übersicht | Wenige, hervorgehobene Artikel |
Artikel werden im Magazin-Stil angezeigt.
Design-Merkmale:
- Großer Hero-Artikel oben
- Kleinere Artikel darunter
- Featured-Artikel hervorgehoben
- Abwechslungsreiches Grid
- Premium-Feeling
Vorteile:
- Professionelles Aussehen
- Featured-Artikel prominent
- Storytelling-Fokus
- Hochwertiger Eindruck
Empfohlen für:
- Lifestyle-Apps
- Unternehmens-Magazine
- Premium-Inhalte
- Wenige, aber hochwertige Artikel
Bild-Darstellung
Section titled “Bild-Darstellung”Wähle, wie Artikel-Bilder angezeigt werden:
Optionen
Section titled “Optionen”| Option | Beschreibung | Beispiel |
|---|---|---|
| Thumbnail | Kleines quadratisches Bild | 80x80 px |
| Banner | Breites Bild oben | Vollbreite |
| Hintergrund | Bild als Card-Hintergrund | Mit Overlay |
| Versteckt | Kein Bild in Übersicht | Nur im Detail |
Thumbnail:
- Platzsparend
- Schnelles Laden
- Gut für Listen-Layout
Banner:
- Bilder kommen zur Geltung
- Gut für Karten-Layout
- Mehr Aufmerksamkeit
Hintergrund:
- Moderner Look
- Bild und Text übereinander
- Text-Overlay erforderlich
Versteckt:
- Maximale Kompaktheit
- Schnellstes Laden
- Bilder nur im Artikel-Detail
Kategorie-Anzeige
Section titled “Kategorie-Anzeige”Wenn Kategorien aktiviert sind, kannst du wählen, wie sie angezeigt werden:
Optionen
Section titled “Optionen”| Option | Beschreibung |
|---|---|
| Badge | Kleiner farbiger Badge |
| Text | Einfacher Text-Link |
| Icon | Icon mit Kategorie-Name |
| Versteckt | Kategorie nicht sichtbar |
Badge (empfohlen):
- Visuell auffällig
- Farbcodierung möglich
- Schnelle Erkennung
Text:
- Minimalistisch
- Platzsparend
- Unauffällig
Vorschau-Optionen
Section titled “Vorschau-Optionen”Bestimme, wie viel vom Artikel in der Übersicht angezeigt wird:
Vorschautext
Section titled “Vorschautext”| Option | Beschreibung |
|---|---|
| Keine | Nur Titel |
| Kurz | 1-2 Zeilen (~100 Zeichen) |
| Mittel | 3-4 Zeilen (~200 Zeichen) |
| Lang | 5+ Zeilen (~300 Zeichen) |
Empfehlung nach Layout:
| Layout | Vorschautext |
|---|---|
| Liste | Keine oder Kurz |
| Karten | Kurz oder Mittel |
| Magazin | Mittel oder Lang |
So wählst du Design-Optionen
Section titled “So wählst du Design-Optionen”-
Design-Schritt erreichen
Im Setup-Wizard erreichst du nach den Features den Design-Schritt. Du siehst eine Vorschau der verfügbaren Layouts.
-
Layout auswählen
Tippe auf das gewünschte Layout:
- Liste: Kompakte vertikale Liste
- Karten: Moderne Card-Darstellung
- Magazin: Editorial-Stil
Die ausgewählte Option wird mit blauer Umrandung und Häkchen markiert.
-
Bild-Darstellung wählen
Wähle, wie Bilder angezeigt werden sollen:
- Thumbnail, Banner, Hintergrund oder Versteckt
-
Weitere Optionen
Je nach Layout siehst du weitere Optionen wie:
- Kategorie-Anzeige
- Vorschautext-Länge
- Datum-Anzeige
-
Fertig!
Nach der Auswahl werden die Design-Einstellungen gespeichert.
Du kannst alles später im News-Editor weiter anpassen.
Empfehlungen nach App-Typ
Section titled “Empfehlungen nach App-Typ”Empfohlene Einstellungen:
| Einstellung | Wert |
|---|---|
| Layout | Liste oder Karten |
| Bilder | Thumbnail oder Banner |
| Kategorie | Badge |
| Vorschau | Kurz |
Für Unternehmens-News: Karten-Layout mit Banner-Bildern für professionellen Look. Kategorien als Badge für schnelle Erkennung.
Empfohlene Einstellungen:
| Einstellung | Wert |
|---|---|
| Layout | Magazin oder Karten |
| Bilder | Banner oder Hintergrund |
| Kategorie | Badge |
| Vorschau | Mittel |
Für Blog/Magazin: Magazin-Layout für Editorial-Feeling. Große Bilder und längere Vorschautexte.
Empfohlene Einstellungen:
| Einstellung | Wert |
|---|---|
| Layout | Liste |
| Bilder | Thumbnail oder Versteckt |
| Kategorie | Text oder Badge |
| Vorschau | Keine oder Kurz |
Für schnelle News: Listen-Layout für maximale Kompaktheit. Wenig Bilder, schnelles Scrollen.
Empfohlene Einstellungen:
| Einstellung | Wert |
|---|---|
| Layout | Karten |
| Bilder | Banner |
| Kategorie | Badge |
| Vorschau | Kurz |
Für Community-News: Karten-Layout für modernes Feeling. Bilder prominent, aber nicht überwältigend.
Vergleich der Layout-Optionen
Section titled “Vergleich der Layout-Optionen”| Merkmal | Liste | Karten | Magazin |
|---|---|---|---|
| Artikel pro Screen | Viele | Mittel | Wenige |
| Bild-Prominenz | Niedrig | Hoch | Sehr hoch |
| Vorschau-Text | Optional | Ja | Ja |
| Moderner Look | Klassisch | Modern | Premium |
| Mobile-Optimierung | Sehr gut | Gut | Mittel |
| Ladezeit | Schnell | Mittel | Langsamer |
Design später anpassen
Section titled “Design später anpassen”Nach der Einrichtung kannst du das Design jederzeit im News-Editor individuell anpassen:
Layout-Tab
Artikel-Layout, Abstände, Grid-Einstellungen
Artikel-Detail
Header-Stil, Bild-Position, Autor-Anzeige
Kategorien
Kategorie-Farben, Icons, Sortierung
Farben
Hintergrund, Text, Akzente, Badges
Der News-Editor bietet:
- Live-Vorschau aller Änderungen
- Komplette Freiheit bei der Gestaltung
- Responsive Design für alle Bildschirmgrößen
- Farbkonfiguration für jeden Bereich
Erweiterte Optionen im News-Editor
Section titled “Erweiterte Optionen im News-Editor”Nach dem Setup hast du im News-Editor Zugriff auf viele weitere Optionen:
Artikel-Übersicht
Section titled “Artikel-Übersicht”| Option | Beschreibung |
|---|---|
| Grid-Spalten | 1-4 Spalten für Karten/Magazin |
| Abstände | Padding und Margins |
| Schatten | Card-Elevation |
| Eckenradius | Abgerundete Ecken |
| Sortierung | Neueste, Beliebt, Featured zuerst |
Artikel-Detail
Section titled “Artikel-Detail”| Option | Beschreibung |
|---|---|
| Header-Stil | Hero, Banner, Kompakt |
| Autor-Anzeige | Mit/ohne Avatar, Name, Datum |
| Verwandte Artikel | Am Ende anzeigen |
| Navigation | Vor/Zurück-Buttons |
| Teilen-Position | Oben, unten, floating |
Nächste Schritte
Section titled “Nächste Schritte” News-Editor Erstelle und verwalte Nachrichtenartikel
Kategorien erstellen Richte News-Kategorien ein
Zurück zur Übersicht News-Modul Setup Übersicht