CMSimple Tests und Demos
Headerimage

Templates anpassen

Das Layout des Basistemplates Fullscreen mit 3 Newsboxen kann man sehr einfach an seine Bedürfnisse anpassen. Die unterschiedlichen Header kann man bei allen Templates durch ein- und auskommentieren zweier Codeblöcke erzeugen.

Das Basistemplate Fullscreen

Dieses Template wird durch minimale Änderungen in der stylesheet.css des Templates ganz einfach 3- oder 2-spaltig. Man muss nur den Gültigkeitsbereich des entsprechenden CSS Codes soweit erhöhen, dass alle denkbaren Bildschirmauflösungen abgedeckt sind, indem man z. B. vor die entsprechende Zahl eine 99 (rot markiert) setzt:

/* 3 column */
@media (max-width: 991880px) {
.tplge_newsArea {flex: 1 0 300px;}
.tplge_newsAreaIn {width: 300px;}
}

So wird aus dem Fullscreen Template ein 3-Spalter. Das kann man später einfach durch entfernen der "99" rückgängig machen. Das gleiche funktioniert auch mit dem Code für 2-Spalter. Die Templates bleiben selbstverständlich responsiv.

Die Header

In allen Templates sind 2 unterschiedliche Header enthalten, fullsize und small.

Beide Header-Varianten haben exakt den gleichen html-Code. Die unterschiedliche Darstellung wird nur durch unterschiedlichen CSS-Code bewirkt, jeweils einer der beiden Codeblöcke ist auskommentiert.

Suchen Sie in der stylesheet.css nach folgendem Kommentar:

/* HEADER */

Die beiden Codeblöcke heissen header fullsize und header small.

nach oben