fullwidth bg-orange_50 font-white
fullwidth
...fullwidth-Hintergründe für Jimdo-Standardelemente
Dies ist eine Testseite zur Demonstration und Optimierung von fullwidth-Elementen für Jimdo-Creator Webseiten. Mithilfe der hier eingesetzten "Fullwidth-Widgets" können Jimdo-Creator Standarelemente mit individuellen Hintergründen zu versehen werden, die sich über die gesamte Breite des Browserfensters erstrecken.
Dadurch ist es möglich, mit Jimdo-Creator Standardelementen ein Streifen-Design zu erreichen, das dem neuen Jimdo-Baukasten (Dolphin) ähnelt. Für die Hintergründe der "Streifen" können Farben oder Bilder verwendet werden.
Die Handhabung erfolgt weitgehend automatisiert, wobei die Farb- und Bildhintergründe selbstständig und frei über ein eingenes CSS definiert werden können.
fw-column font-white
fw-section bg-orange_50 font-white
Fullwidth-Sectionelement (fw-section)
Das fw-section-Widget verbreitert jedes Jimdo-Standardelement auf 100% der verfügbaren Fensterbreite. Die Randabstände werden dabei generell auf 25px festgelegt. Um den Contentbereich eine maximale Standardbreite zuzuweisen, muss statt des Secion-Widgets das normale fullwidth-Widget benutzt werden (fullwidth).
In diesem Beispiel wurde der Contentbereich im Section-Element unter Verwendung von Spaltenelementen mit verschieden- bzw. gleichbreiten Spalten formatiert.
fw-section bg-orange_50 font-white
fullwidth-Spaltenelement
(bg-black_33 font-white)
HowToDo
Fotos
Was immer du auf deiner Webseite zeigen und anbieten willst: Für alles gibt es wichtige Suchbegriffe, die
für Suchmaschinen wichtig sind. Diese könntest du auf deiner Startseite in der H2 (mittleren Überschrift) oder H3 (kleine Überschrift) unterbringen.
fw-column bg-black_33 font-white
fullwidth-Spaltenelement
fixiertes Background-Image
...HowToDo
(click to open/close)
Portraits
Was immer du auf deiner Webseite zeigen und anbieten willst: Für alles gibt es wichtige Suchbegriffe, die
für Suchmaschinen wichtig sind. Diese könntest du auf deiner Startseite in der H2 (mittleren Überschrift) oder H3 (kleine Überschrift) unterbringen.
fw-column bg-img1 parallax-bg font-white
fullwidth-Spaltenelement
(bg-darkgrey font-white)
...HowToDo
(click to open/close)
Portraits
Was immer du auf deiner Webseite zeigen und anbieten willst: Für alles gibt es wichtige Suchbegriffe, die
für Suchmaschinen wichtig sind. Diese könntest du auf deiner Startseite in der H2 (mittleren Überschrift) oder H3 (kleine Überschrift) unterbringen.
fw-column bg-darkgrey font-white
fullwidth-Spaltenelement
Backgroundcolor (bg-white)
...HowToDo
(click to open/close)
Bewerbung
Hier gibt’s noch nichts zu lesen, aber das kannst du leicht ändern: Textfeld anklicken, deine eigenen Worte
reinschreiben – und schon heißt es tschüss, Beispieltext!
Familie
Hier gibt’s noch nichts zu lesen, aber das kannst du leicht ändern: Textfeld anklicken, deine eigenen Worte reinschreiben – und schon heißt es tschüss, Beispieltext!
fw-column bg-white
nachfolgendes Element: fullwidth bg-orange_33
nachfolgendes Element: fullwidth bg-orange_33 font-white
fullwidth-Standardelemente
...mehrere hintereinander angelegte fullwidth-Standardelemente
(fullwidth bg-orange_33 font-white)
Galerien
Hier gibt’s noch nichts zu lesen, aber das kannst du leicht ändern: Textfeld anklicken, deine eigenen Worte reinschreiben – und schon heißt es tschüss, Beispieltext!
nachfolgendes Element: fullwidth bg-orange_33 font-white
fullwidth Bild-mit-Text-Element
Hier gibt’s noch nichts zu lesen, aber das kannst du leicht ändern: Textfeld anklicken, deine eigenen Worte reinschreiben – und schon heißt es tschüss, Beispieltext!
nachfolgendes Element: fullwidth bg-orange_33 font-white
nachfolgendes Element: fullwidth bg-black_33 font-white
nachfolgendes Element: fullwidth bg-black_33 font-white
fullwidth-Standardelemente
...mehrere hintereinander angelegte fullwidth-Standardelemente
(fullwidth bg-orange_33 font-white)
nachfolgendes Element: fullwidth bg-black_33 font-white
fullwidth Bild-mit-Text-Element
Hier gibt’s noch nichts zu lesen, aber das kannst du leicht ändern: Textfeld anklicken, deine eigenen Worte reinschreiben – und schon heißt es tschüss, Beispieltext!
nachfolgendes Element: fullwidth bg-black_33 font-white
nachfolgendes Element: fullwidth font-white
Normaler Content
...mit eigener Schriftfarbe
In diesem Bereich ist der normale Hintergrund der Unterseite wirksam. Über das fullwidth-Widget können auch Anweisungen definiert werden, die sich nur auf die verwendeten Texte im jeweiligen Content auswirken.
(fullwidth font-white)
...HowToDo
(click to open/close)
nachfolgendes Element: fullwidth font-white
Der Hintergrund dieser Seite wurde mithilfe eines als "Schalter" eingerichteten Bildelementes per jQuery zugewiesen. Auf diese Weise lassen sich auch auf Jimdofree-Seiten Unterseitenspezifische Hintergrundfarben definieren.
CSS background-Button
