Inhaltsbox (mit weiteren Elementen befüllbar)

Dieser Inhaltscontainer erlaubt es dem Redakteur, Inhalte in einer Box besonders hervorzuheben. Er lässt sich mit beliebigen Inhaltselementen befüllen, deren Breiten über das CSS-Rendering automatisch angepasst werden. Falls es mehrere Layoutvarianten gibt, kann der Redakteur diese auswählen und so unterschiedlich gestaltete Container einbauen. Boxen können sowohl in mehrspaltigen Containern vorkommen, als auch mehrspaltige Container beinhalten.

Beispiele / CSS-Only-Varianten ab CMS 10.x

Variante 0: Hervorgehoben

Inhaltsbox Variante 0

Variante 1: Eingerahmt

Inhaltsbox Variante 1

Variante 2: Mit Schatten

Inhaltsbox Variante 2

Variante 3: Halbtransparent

Inhaltsbox Variante 3

Variante 5: 100% breit schmaler Inhalt

Inhaltsbox Variante 5

Variante 7: Inline-Box Darstellung mit Abstand und weißem Hintergrund

Inhaltsbox Variante 7

Variante 20: Vertikal scrollbar mit fester Höhe

Inhaltsbox Variante 20

Variante 21: Horizontal scrollbar

Inhaltsbox Variante 21

Variante 30: Fest definiertes Hintergrundbild

Inhaltsbox Variante 30

Variante 31: Auswählbares Hintergrundbild

Inhaltsbox Variante 31

Variante 32: Eingerahmt mit Hintergrundbild, Mouseover-Bild und Link

Inhaltsbox Variante 32

Variante 33: Bild und Text rechts oder links, Mouseover-Bild und Link

Inhaltsbox Variante 33

Variante 34: Hintergrundbild und Text rechts oder links, Mouseover-Bild und Link

Inhaltsbox Variante 34

Variante 36: Eingerahmt mit fixiertem Hintergrundbild

Inhaltsbox Variante 36

Variante 37: Bild oben 100% mit Inhalt

Inhaltsbox Variante 37

Variante 40: Sprechblase

Inhaltsbox Variante 40

Variante 50: Überschrift (erste enthaltene Überschrift oben anzeigen)

Inhaltsbox

Bild

Dieser Inhaltscontainer erlaubt es dem Redakteur, Inhalte in einer Box besonders hervorzuheben. Er lässt sich mit beliebigen Inhaltselementen befüllen, deren Breiten über das CSS-Rendering automatisch angepasst werden. Falls es mehrere Layoutvarianten gibt, kann der Redakteur diese auswählen und so unterschiedlich gestaltete Container einbauen. Boxen können sowohl in mehrspaltigen Containern vorkommen, als auch mehrspaltige Container beinhalten.

Variante 51: Überschrift (erste enthaltene Überschrift oben links anzeigen)

Inhaltsbox

Bild

Dieser Inhaltscontainer erlaubt es dem Redakteur, Inhalte in einer Box besonders hervorzuheben. Er lässt sich mit beliebigen Inhaltselementen befüllen, deren Breiten über das CSS-Rendering automatisch angepasst werden. Falls es mehrere Layoutvarianten gibt, kann der Redakteur diese auswählen und so unterschiedlich gestaltete Container einbauen. Boxen können sowohl in mehrspaltigen Containern vorkommen, als auch mehrspaltige Container beinhalten.

Variante 52: Überschrift (erste enthaltene Überschrift oben rechts anzeigen)

Inhaltsbox

Bild

Dieser Inhaltscontainer erlaubt es dem Redakteur, Inhalte in einer Box besonders hervorzuheben. Er lässt sich mit beliebigen Inhaltselementen befüllen, deren Breiten über das CSS-Rendering automatisch angepasst werden. Falls es mehrere Layoutvarianten gibt, kann der Redakteur diese auswählen und so unterschiedlich gestaltete Container einbauen. Boxen können sowohl in mehrspaltigen Containern vorkommen, als auch mehrspaltige Container beinhalten.

Variante 60: Vergrößerbar, Aufklapper rechts

Inhaltsbox Variante 60

Variante 61: Vergrößerbar, Aufklapper mittig

Inhaltsbox

Bild

Dieser Inhaltscontainer erlaubt es dem Redakteur, Inhalte in einer Box besonders hervorzuheben. Er lässt sich mit beliebigen Inhaltselementen befüllen, deren Breiten über das CSS-Rendering automatisch angepasst werden. Falls es mehrere Layoutvarianten gibt, kann der Redakteur diese auswählen und so unterschiedlich gestaltete Container einbauen. Boxen können sowohl in mehrspaltigen Containern vorkommen, als auch mehrspaltige Container beinhalten.

Variante 62: Vergrößerbar, Aufklapper mittig darüber minimiert

Inhaltsbox

Bild

Dieser Inhaltscontainer erlaubt es dem Redakteur, Inhalte in einer Box besonders hervorzuheben. Er lässt sich mit beliebigen Inhaltselementen befüllen, deren Breiten über das CSS-Rendering automatisch angepasst werden. Falls es mehrere Layoutvarianten gibt, kann der Redakteur diese auswählen und so unterschiedlich gestaltete Container einbauen. Boxen können sowohl in mehrspaltigen Containern vorkommen, als auch mehrspaltige Container beinhalten.

Variante 63: Vergrößerbar, Aufklapper mittig darunter minimiert

Inhaltsbox

Bild

Dieser Inhaltscontainer erlaubt es dem Redakteur, Inhalte in einer Box besonders hervorzuheben. Er lässt sich mit beliebigen Inhaltselementen befüllen, deren Breiten über das CSS-Rendering automatisch angepasst werden. Falls es mehrere Layoutvarianten gibt, kann der Redakteur diese auswählen und so unterschiedlich gestaltete Container einbauen. Boxen können sowohl in mehrspaltigen Containern vorkommen, als auch mehrspaltige Container beinhalten.

Variante 64: Vergrößerbar, Aufklapper rechts nur Text

Inhaltsbox

Bild

Dieser Inhaltscontainer erlaubt es dem Redakteur, Inhalte in einer Box besonders hervorzuheben. Er lässt sich mit beliebigen Inhaltselementen befüllen, deren Breiten über das CSS-Rendering automatisch angepasst werden. Falls es mehrere Layoutvarianten gibt, kann der Redakteur diese auswählen und so unterschiedlich gestaltete Container einbauen. Boxen können sowohl in mehrspaltigen Containern vorkommen, als auch mehrspaltige Container beinhalten.

Variante 65: Vergrößerbar, Aufklapper mittig nur Text

Inhaltsbox

Bild

Dieser Inhaltscontainer erlaubt es dem Redakteur, Inhalte in einer Box besonders hervorzuheben. Er lässt sich mit beliebigen Inhaltselementen befüllen, deren Breiten über das CSS-Rendering automatisch angepasst werden. Falls es mehrere Layoutvarianten gibt, kann der Redakteur diese auswählen und so unterschiedlich gestaltete Container einbauen. Boxen können sowohl in mehrspaltigen Containern vorkommen, als auch mehrspaltige Container beinhalten.

Variante 70: Auswählbares Layout

Inhaltsbox

Bild

Dieser Inhaltscontainer erlaubt es dem Redakteur, Inhalte in einer Box besonders hervorzuheben. Er lässt sich mit beliebigen Inhaltselementen befüllen, deren Breiten über das CSS-Rendering automatisch angepasst werden. Falls es mehrere Layoutvarianten gibt, kann der Redakteur diese auswählen und so unterschiedlich gestaltete Container einbauen. Boxen können sowohl in mehrspaltigen Containern vorkommen, als auch mehrspaltige Container beinhalten.

Variante 71: Auswählbare Hintergrundfarbe

Inhaltsbox

Bild

Dieser Inhaltscontainer erlaubt es dem Redakteur, Inhalte in einer Box besonders hervorzuheben. Er lässt sich mit beliebigen Inhaltselementen befüllen, deren Breiten über das CSS-Rendering automatisch angepasst werden. Falls es mehrere Layoutvarianten gibt, kann der Redakteur diese auswählen und so unterschiedlich gestaltete Container einbauen. Boxen können sowohl in mehrspaltigen Containern vorkommen, als auch mehrspaltige Container beinhalten.

Variante 80: Einblenden, wenn im sichtbaren Bereich

Inhaltsbox

Bild

Dieser Inhaltscontainer erlaubt es dem Redakteur, Inhalte in einer Box besonders hervorzuheben. Er lässt sich mit beliebigen Inhaltselementen befüllen, deren Breiten über das CSS-Rendering automatisch angepasst werden. Falls es mehrere Layoutvarianten gibt, kann der Redakteur diese auswählen und so unterschiedlich gestaltete Container einbauen. Boxen können sowohl in mehrspaltigen Containern vorkommen, als auch mehrspaltige Container beinhalten.

Variante 81: Einfahren von rechts, wenn im sichtbaren Bereich

Inhaltsbox

Bild

Dieser Inhaltscontainer erlaubt es dem Redakteur, Inhalte in einer Box besonders hervorzuheben. Er lässt sich mit beliebigen Inhaltselementen befüllen, deren Breiten über das CSS-Rendering automatisch angepasst werden. Falls es mehrere Layoutvarianten gibt, kann der Redakteur diese auswählen und so unterschiedlich gestaltete Container einbauen. Boxen können sowohl in mehrspaltigen Containern vorkommen, als auch mehrspaltige Container beinhalten.

Variante 82: Einfahren von links, wenn im sichtbaren Bereich

Inhaltsbox

Bild

Dieser Inhaltscontainer erlaubt es dem Redakteur, Inhalte in einer Box besonders hervorzuheben. Er lässt sich mit beliebigen Inhaltselementen befüllen, deren Breiten über das CSS-Rendering automatisch angepasst werden. Falls es mehrere Layoutvarianten gibt, kann der Redakteur diese auswählen und so unterschiedlich gestaltete Container einbauen. Boxen können sowohl in mehrspaltigen Containern vorkommen, als auch mehrspaltige Container beinhalten.

Variante 83: Einblenden mit Vergrößerungseffekt, wenn im sichtbaren Bereich

Inhaltsbox

Bild

Dieser Inhaltscontainer erlaubt es dem Redakteur, Inhalte in einer Box besonders hervorzuheben. Er lässt sich mit beliebigen Inhaltselementen befüllen, deren Breiten über das CSS-Rendering automatisch angepasst werden. Falls es mehrere Layoutvarianten gibt, kann der Redakteur diese auswählen und so unterschiedlich gestaltete Container einbauen. Boxen können sowohl in mehrspaltigen Containern vorkommen, als auch mehrspaltige Container beinhalten.

Variante 85: Parallax Hintergrundbild

 
 

Inhaltsbox

Bild

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Ut commodo pretium nisl. Integer sit amet lectus. Nam suscipit magna nec nunc. Maecenas eros ipsum, malesuada at, malesuada a, ultricies dignissim, justo. Mauris gravida dui eget elit.

 
 
 

Variante 86: Parallax Inhalt

Inhaltsbox

Bild

Dieser Inhaltscontainer erlaubt es dem Redakteur, Inhalte in einer Box besonders hervorzuheben. Er lässt sich mit beliebigen Inhaltselementen befüllen, deren Breiten über das CSS-Rendering automatisch angepasst werden. Falls es mehrere Layoutvarianten gibt, kann der Redakteur diese auswählen und so unterschiedlich gestaltete Container einbauen. Boxen können sowohl in mehrspaltigen Containern vorkommen, als auch mehrspaltige Container beinhalten.

Variante 90: Laufschrift von rechts

Inhaltsbox per Laufschrift + + + Inhaltsbox per Laufschrift + + + Inhaltsbox per Laufschrift

Variante 110: Fixe Position am Rand des Fensters

Inhaltsbox Variante 110

Variante 111: elementBox_var111

Inhaltsbox

Bild

Dieser Inhaltscontainer erlaubt es dem Redakteur, Inhalte in einer Box besonders hervorzuheben. Er lässt sich mit beliebigen Inhaltselementen befüllen, deren Breiten über das CSS-Rendering automatisch angepasst werden. Falls es mehrere Layoutvarianten gibt, kann der Redakteur diese auswählen und so unterschiedlich gestaltete Container einbauen. Boxen können sowohl in mehrspaltigen Containern vorkommen, als auch mehrspaltige Container beinhalten.

Variante 115: Fixe Position neben dem Inhalt

Eine Vorschau dieser Inhaltsbox-Variante ist an dieser Stelle leider nicht möglich.

Variante 120: Container aufklappbar

Eine Vorschau dieser Inhaltsbox-Variante ist an dieser Stelle leider nicht möglich.

Variante 140: Neutral mit Hintergrundvideo

Inhaltsbox

Bild

Dieser Inhaltscontainer erlaubt es dem Redakteur, Inhalte in einer Box besonders hervorzuheben. Er lässt sich mit beliebigen Inhaltselementen befüllen, deren Breiten über das CSS-Rendering automatisch angepasst werden. Falls es mehrere Layoutvarianten gibt, kann der Redakteur diese auswählen und so unterschiedlich gestaltete Container einbauen. Boxen können sowohl in mehrspaltigen Containern vorkommen, als auch mehrspaltige Container beinhalten.

Variante 2000: elementBox_var2000

Inhaltsbox

Bild

Dieser Inhaltscontainer erlaubt es dem Redakteur, Inhalte in einer Box besonders hervorzuheben. Er lässt sich mit beliebigen Inhaltselementen befüllen, deren Breiten über das CSS-Rendering automatisch angepasst werden. Falls es mehrere Layoutvarianten gibt, kann der Redakteur diese auswählen und so unterschiedlich gestaltete Container einbauen. Boxen können sowohl in mehrspaltigen Containern vorkommen, als auch mehrspaltige Container beinhalten.

 

Versionshistorie

002.000.655.000 09.08.2016
Über die CSS-Only Einstellung -w-use-orig-backgroundimage:yes; kann erzwungen werden, dass das Hintergrundbild nicht auf die entsprechende Größe kleingerechnet wird.
002.000.580.000 10.03.2016
Die Bildgrößenberechnung wird auch für Hintergrund- und Mouseover-Bilder angewandt.
002.000.486.000 09.09.2015
Falls die Inhaltsbox verlinkt ist, wird das über ein Linksymbol im Editor sichtbar.
002.000.445.000 14.07.2015
Neue CSS-Only Variante verfügbar, um Elemente beim Mouseover zu vergrößern.
002.000.443.000 14.07.2015
Untervarianten elementBoxHover_var123 werden unterstützt, um Mouseover-Effekte zu definieren.
002.000.323.000 05.02.2015
Untervarianten über -w-subvariants werden unterstützt.
002.000.308.000 21.01.2015
Untervarianten zur Positionierung und Ausrichtung werden unterstützt.
002.000.286.000 16.12.2014
Über -w-editmaskExtended-id:yes lässt sich das ID-Attribut einer Inhaltsbox pflegen.
002.000.273.000 03.12.2014
Das Element Inhaltsbox unterstützt CSS-Only-Untervarianten für Breiten, Höhen, Innenabstände, Außenabstände, Rahmen, Hintergründe und Einblendeffekte.
002.000.254.000 25.11.2014
Neue Parallax Scroll-Faktoren auswählbar.
002.000.201.000 12.09.2014
Über -w-editmaskExtended-parallaxbackgroundspeed:yes; lässt sich die Gewschwindigkeit von Parallax-Hintergründen pflegen.
002.000.185.000 26.08.2014
Hintergrundvideos werden unterstützt
002.000.143.000 22.04.2014
Die fixe Positionierung neben dem Inhalt funktioniert durch die CSS-Only-Funktion wCalc auch mit älteren Browsern.
002.000.140.000 15.04.2014
Neue CSS-Only-Variante verfügbar, um Inhalte direkt neben dem Hauptinhaltsbereich fix zu platzieren.
002.000.112.000 19.03.2014
Neue CSS-Only-Variante mit Parallax-Scrolling verfügbar.
002.000.106.000 25.02.2014
Neue CSS-Only-Variante verfügbar mit durchlaufendem Text.
002.000.104.000 04.02.2014
Neue CSS-Only-Varianten verfügbar, um Inhalte animiert einzublenden, sobald diese im sichtbaren Bereich sind.
002.000.103.000 29.01.2014
Neue CSS-Only-Varianten mit ausrichtbaren Überschriften verfügbar.
002.000.102.000 21.01.2014
Über -w-editmaskExtended-backgroundcolor:yes lässt sich die Hintergrundfarbe pflegbar machen.
002.000.097.000 19.12.2013
Fünf neue CSS-Only-Varianten für aufklappbare Inhaltsboxen verfügbar.
002.000.075.000 01.10.2013
Neue CSS-Only Variante verfügbar.
002.000.066.000 08.07.2013
Neue CSS-Only Variante mit integrierter Überschrift verfügbar.
002.000.063.000 28.05.2013
Neue CSS-Only Variante als Sprechblase verfügbar.
002.000.062.000 07.05.2013
Über -w-editmaskExtended-target:yes lässt sich das Linkziel in einer verlinkten Box pflegen.
002.000.047.000 11.03.2013
Das Hintergrundbild lässt sich über eine CSS-Maske auf Basis einer CSS-Klasse ausrichten: -w-editmaskExtended-backgroundpositionclasses:|backgroundPositionLeftTop|backgroundPositionLBottom|backgroundPositionRightTop|backgroundPositionRightBottom;
002.000.039.000 21.02.2013
Die Höhe von Boxen ist standardmäßig mit 100% definiert.
002.000.026.000 12.12.2012
Über das erweiterte CSS-Attribut -w-editmaskExtended-backgroundimage:yes; können in der gewählten Box-Variante individuelle Hintergrundbilder definiert werden.
001.000.004.000 07.07.2011
Die auswählbaren Klassen können im Template sehr einfach über zwei Variablen definiert werden, ohne die Logik anpassen zu müssen.