Hallo,
bist du eine Lösung gefunden hast, hier mal ein Vorschlag:
- Verwende z.B. das Design "Flex-Lyout(responsiv)" oder "Barrierefreies Flex-Lyout(responsiv)"
- erstelle im Absatzbereich "Oben" Absatztypen wie "Aufmacher", "Text-Absatz" oder "Bild-Absatz" (diese können im Web-Client bearbeitet werden)
- erstelle einen Absatztyp "HTML-Clip" und füge unten bei <head> folgenden Grid-Style-Code hinzu:
<style>
#header {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 25%));
}
</style>
Erklärung:
- #header = Absatzbereich "Oben" in der die Grid-Funktion für alle Absätze ausführen soll
- minmax teilt sich in der Klammer hier im Beispiel als Werte Mindestbreite 200px und pro Absatztyp 25% der Displaybreite auf, die du anpassen kannst.
(bei 25% wäre das hier z.B. 4 Absatzmodule wenn genügend Displaybreite zur Verfügung steht, wenn nicht, dann wird es immer um ein Absatz weniger wenn die Pixelbreite der Absätze nicht mehr zur Verfügung stehen. Beispiel: bei 500px wäre also nur für 2 Absatztylen Platz)
- statt auto-fit könnte man auch auto-fill vewenden und zusammen statt 25% kann man 1fr schreiben, dann wird beim größen Display/Bildschirm ein leerer Platz erzeugt, bis die Pixelzahl des letzten Absatz der Reihe Platz hat.
- Weitere Absätze werden eine Zeile darunter erzeugt, wenn die Displaybreite voll ist.
Wenn du jetzt das ganze in einer Vorlage (Vorlagenseite) erstellst (So wie Thomas bereits den Hinweis gegeben hat), dann kannst du für die gewünschten Seiten in den jeweiligen Ordner bei Eigenschaften die Vorlagneseite auswählen und bestimmen ob der Inhalt "Oben" der Seite oben oder unten hinzugefügt wird, Standard.ist überschreiben eingestellt.
Das könnte man auch bei Inhalt, Links, Rechts und Unten ebenfalls erstellen, aber es gibt Absatztypen, die nicht so toll aussehen würdenund da sollten die Grid-Funktion nicht eingesetzt werden.
Das ist nur ein Beispiel, es gibt viel vliel mehr Grid-Befehle, die man als Style-Code hinzufügen kann, z.B. eventuell auch geziehiter für einen Absatztypen. Das müsste dann genauer betrachtet werden.
Wenn nicht alles klar ist, was ich hier schreibe, im Handbuch stehen viele Erläuterungen drinnen (Ausser natürlich die Grid-Funktion, die man auch im www Beispiele zu haufen findet.
Viels Spass beim Austesten.
Änderung: Mindestbreite auf 200px reduziert, so dass bei Display Smartphone zwei Absatztypen nebeneinander Platz haben.
Hinweis: Bei Verwendung von Absatztyp "Aufmacher" empfiehlt sich die Einstellung "1-Spaltig" (max. 2-Spaltig)U zu verwenden, da ansonsten alles zu sehr gestaucht aussieht.
Mit freundlichen Grüßen
Thomas
Web To Date seit 2004, Siquando Web 12, Pro Web 9, Web Client
Dieser Beitrag wurde bereits 1 mal bearbeitet, zuletzt von »
MuggelClan« (Heute, 10:49)
