Layout und mobile Ansicht

Layout, Titel und mobile Ansicht

Seiteneinstellungen

Unter Bearbeiten → Seiteneinstellungen:

• Helles oder dunkles Theme wählen.
• Widgetrahmen ein-/ausblenden.
• Globale Titelausrichtung links, zentriert oder rechts festlegen.
• Die Rastergröße wählen: 12, 24, 48, 96 oder 192 Spalten.

Die gemeinsamen Einstellungen wirken auf alle Seiten dieses CMS-Devices. Sie werden als Entwurf gespeichert und erst durch Veröffentlichen live.

Widgettitel

Ohne eigene Einstellung sind die Titel linksbündig. Die gemeinsame Ausrichtung gilt für die Widgettitel, nicht für Dialogüberschriften oder frei formatierte Überschriften innerhalb von Text-/HTML-Inhalten. Die Sichtbarkeit eines Titels wird weiterhin am einzelnen Widget eingestellt.

Rasterdichte

Mehr Spalten erlauben feinere Schritte für Positionen und Größen. Die Rasterdichte ist keine zusätzliche Bildschirmauflösung. Widgets werden direkt im Editor verschoben und skaliert, nicht über numerische Positionsfelder in den Widgetdialogen.

Der aktuelle Schema-5-Editor arbeitet mit dem präzisen Raster. Frühere Layoutmodi wie „Fluss“, „Masonry“ oder „Frei“ aus älteren Anleitungen sind nicht der hier beschriebene Arbeitsablauf.

Automatisch anordnen

Bearbeiten → Widgets automatisch anordnen rückt die Widgets der aktuellen Seite nach oben und links.

• Die Leserichtung bleibt erhalten: zeilenweise von links nach rechts.
• Größen und Inhalte ändern sich nicht.
• Andere Seiten und die gemeinsame Navigation bleiben unverändert.
• Leicht versetzte Nachbarn werden bei ausreichender Höhenüberdeckung als gemeinsame Zeile erkannt.
• Lücken können zugunsten der Reihenfolge bestehen bleiben.
• Die Anordnung landet sofort im Entwurf, nicht in Live.

Nutze das nach dem Entfernen großer Kacheln oder nach manuellen Umbauten.

Desktop und Browserzoom

Bei gleicher Inhaltsbreite zeigen Editor, Vorschau und Homepage dieselben Desktoppositionen und Proportionen. Navigation und Widgets skalieren gemeinsam mit der Fensterbreite.

Browserzoom wird nicht durch vollständiges Einpassen aufgehoben: Hineinzoomen vergrößert, Hinauszoomen verkleinert die Darstellung. Reicht der Platz nicht, kann der Rasterbereich seitlich scrollen; die Werkzeugleiste bleibt außerhalb dieses Inhaltsrasters.

Smartphone und Tablet

Bis einschließlich 600 Pixel Inhaltsbreite ordnen Homepage und Vorschau die Widgets automatisch in Leserichtung mit Zeilenumbruch an. Kleine Kacheln erhalten dort mindestens ein Viertel der Bezugsbreite und 6 rem Höhe. Das gespeicherte Seitenverhältnis bleibt maßgeblich.

Die Navigation steht in der schmalen Ansicht vor den Widgets; bei Platzmangel verwendet sie ihr aufklappbares Menü.

Das Drehen des Geräts verändert keine gespeicherten Rasterpositionen. Auch die gewählte Rasterdichte bestimmt nicht, ob die schmale Ansicht aktiv ist.

Geräte-Vorschau

Oben rechts im Editor ein Smartphone-, Tablet- oder Desktopprofil wählen. Die Drehfunktion wechselt Hoch-/Querformat. Damit prüfst du den responsiven Entwurf, ohne Desktoppositionen zu überschreiben.

Zum eigentlichen Positionieren wieder in den normalen Editor wechseln: Dessen exaktes Raster bricht nicht automatisch um.

Praktische Kontrolle

Vor Veröffentlichung:

• Lange Titel und große Messwerte prüfen.
• Breite und schmale Ansicht ansehen.
• Hoch- und Querformat testen.
• Burger-Menü öffnen und alle sichtbaren Seiten prüfen.
• Browserzoom ausprobieren.
• Auf dem Zielgerät nachladen; eine Simulation ersetzt nicht jeden Gerätetest.

Widgetübersicht · Beispielprojekt