Verfügbare Module

Allgemeine Elemente

Diese allgemeinen Elemente sind beliebig einsetzbar. Sie können im Backend über angeleget werden. Der Editor ist entweder als ein eigenständiges Text-Modul verfügbar oder wird in andere Module (wie z.B. oben für Teasertext im Heroheader-Silder) eingebunden.

Headline 1

Headline 2

Headline 3

Headline 4

Headline 5

Nachdem die H1 an vielen Stellen zu groß war, haben wir für SEO nochmals getrickst: Es kann bei jeder Headline eine CSS-Klasse (z.B. für h1 die Klasse layout-h2 ergänzt werden, um das Layout der entsprechenden Headline zu erzwingen, im Quellcode ist es aber eine h1):

h1 layout-h2

h1 layout-h3

h1 layout-h4

h2 layout-h1

h2 layout-h3

h2 layout-h4

h3 layout-h1

h3 layout-h2

h3 layout-h4

h4 layout-h1

h4 layout-h2

h4 layout-h3

Normaler fließtext lorem ipsum dolor set amet. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Maecenas porttitor congue massa. Fusce posuere, magna sed pulvinar ultricies, purus lectus malesuada libero, sit amet commodo magna eros quis urna. Nunc viverra imperdiet enim. Fusce est. Vivamus a tellus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Proin pharetra nonummy pede. Mauris et orci. Aenean nec lorem. In porttitor. Donec laoreet nonummy augue. Suspendisse dui purus, scelerisque at, vulputate vitae, pretium mattis, nunc. Mauris eget neque at sem venenatis eleifend. Ut nonummy. Mit verschiedene Formatierungen:

Fetter Text

Fetter Text und unterstrichen

Kursiv Text

Kursiv Text und unterstrichen

Unterstichener Text

Ein Link

Zentrierter Text

Rechtsbündiger Text

eine	Tabelle	die	mitten	im
inhalt	steht	warum	auch	immer

Eine Liste
Listenpunkt 2
Listenpunkt 3
Listepunkt unterstrichen

Numerische Liste
Listenpunkt 2
Listenpunkt 3
Listen punkt unterstrichen

Text ohne unteren Abstand und in beliebiger Farbe

Headline

Mit Betätigen des Play-Buttons, wird der externe Dienst YouTube gestartet. Pressing the play button starts the external YouTube service.

button primary

button secondary

button link

Eine Überschrift im Format Kein Abstand

Darunter ein zentriertes Heading H3

Texte können durch Rows und Columns gelayoutet werden. Der Text selbst wird wieder über das Text-Modul eingebunden. Hier ein Text, der in einer gesamten Row steht und sich über 4 Text-Columns zieht. Die beiden Columns links und rechts sind leer und dienen nur der Formatierung.

Welche Headline ist das?

sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam
sanctus est Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam
sanctus est Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam

Welche Headline ist das?

sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam
sanctus est Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam
sanctus est Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam

Einspaltiger Text

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

Anmerkung: Die linke und rechte leere Column sollten 3 Spalten breit sein

aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet

Zweispaltiger Text

Dreispaltiger Text

Accordion

Ein Text

Optionaler Link

Ein weiterer Text

Eine Überschrift

Default Slider

Hier kann etwas Text stehen

CoordinatesHeader

Haupteinsatzzweck: Isolena Startseite. Haben wir aber auch auf Content-Seiten. Koordinatenpunkte können beliebig angelegt werde.

Dein Style dein Teppich

Zur Unterseite

Eine Kategorie

Ein Produkttitel

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

20€

Kategorie

Produkttitel

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

33€

Heroheaderslider

Sind 3 Versionen für einen Header. Hauptverwendungszwecke: Die verschiedenen Markenstartseiten. Silder-Funktion optional, geht auch nur mit einem Bild.

Unterüberschrift

Überschrift

Zur Kategorie

Unterüberschrift

Überschrift

Zur Kategorie

Kategorie Header

Im Kategorie-Header kann ein Hauptbild hinterlegt werden und links und rechts Elemente als .png/.svg, die zur entsprechenden Seite passen. Hier z.B. Teppich-Outlines. Die Höhe des Bildes muss flexibel sein, damit der Header nicht zu groß wird.

Eine unterüberschrift

Überschrift

Hier geht jetzt auch der wysiwyg editor

Stage Slider

Bildergalerie, Breite wird automatisch skaliert, Höhe frei wählbar

1. Schritt

2. Schritt

3. Schritt

Category Slider => benötigen wir so nicht mehr unbedingt

Eine unterüberschrift

Überschrift

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sedfdgd ff dfhlhf sl ishslkb hsdfkjsh blksj ndlkj lkdsj

Mehr

Eine Unterüberschrift

Überschrift 2

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sedfdgd ff dfhlhf sl ishslkb hsdfkjsh blksj ndlkj lkdsj

Mehr

Eine Unterüberschrift

Überschrift 3

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sedfdgd ff dfhlhf sl ishslkb hsdfkjsh blksj ndlkj lkdsj

Mehr

Eine Unterüberschrift

Überschrift 4

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sedfdgd ff dfhlhf sl ishslkb hsdfkjsh blksj ndlkj lkdsj

Mehr

IconTeaser

Mehrere Teaser-Elemente können angelegt werden, ab 4 Elementen Silder-Funktion möglich.

Es können aber auch Fotos verwendet werden, so das dies eine kleinere Version einer Bildergalerie darstellen kann.

Nachwachsender Rohstoff

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

Selbstreinigend

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor

Regulierung des Wohnklimas

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut lab

100% recyclebar

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo

Ein Titel

Lorem ipsum dolor sit amet, consetetur sed

Coordinates Slider (Koordinaten Teaser)

Ein Teppich-Produkt mit langem Titel, zum Testen

Noch ein Test links oben

Überschrift

mehr

Ein Teppich-Produkt mit langem Titel, zum Testen

Pink

299,00€

Überschrift

mehr

Ein Teppich-Produkt mit langem Titel, zum Testen

Pink

299,00€

Überschrift

mehr

Masonry-Wrapper

Haupteinsatzzweck vom Masonry sind Magazinübersichts-Seiten. Die einzelnen Teaser können eigenständig angelegt werden und dann individuell an unterschiedlichen Stellen eingebunden werden, so das ein Teaser nur einmal erstellt oder korrigiert werden muss. Bei der Magazinübersicht streben wir (je nach Aufwand) aber eigentlich lieber eine geschicktere Lösung an, mit der man nicht so viel Handarbeit im Daily Business leisten muss. Sind hier für Ideen offen.

Zweiter Einstzbereich ist am Ende von Content-Beiträgen als Teaser-Element für weitere Beiträge.

Kategorie

Modernes Wohnzimmer

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

Zur Seite

Kategorie

Modernes Wohnzimmer

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

Zur Seite

Kategorie

Bunte Vielfalt

Lorem ipsum dolor sit amet, consetetur sadipscing elitr

Zum Produkt

Kategorie

Bunte Vielfalt

Lorem ipsum dolor sit amet, consetetur sadipscing elitr

Zum Produkt

Kategorie

Modernes Wohnzimmer

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

Zum Produkt

Test

Text Image Column

Beliebig viele Text-Image-Blöcke können angelegt werden. Link optional. Darstellung abwechselnd links-rechts.

Nachhaltigkeit - von der Idee zum Produkt

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

Mehr

Individualität aus Designerhand

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

Mehr

Image

Verwenden von Bilden in belieber Größe an beliebiger Stelle möglich. Mit dem Row-Colum-System kann man auch mehrere Bilder nebeneinander setzen.

Colorpicker

Beliebige Anzahl an Color-Elementen kann angelegt werden. Hinterlegt wird der HEX-Code und der Farbname. Kreis-Formatierung erfolgt automatisch. Wenn die maximale Breite ausgefüllt ist, werden die weiteren Farb-Kreise in der nächsten Zeile dargestellt. Keine Klick-Funktion.

Nougar

Grass

Coral

Orange

Fir

White

Category Teaser

Category-Teaser könne als Bild- oder Text-Teaser angelegt werden. Beim Bild ist der Upload eines 90x90 px Bildes nötig, Kreisformatierung erfolgt automatisch. Zusätlich zum Kategorie-Namen kann ein Link gesetzt werden. Einsatz z.B. im STYLIT-Magazin oder auch der ISOLEA Produktseite oder bei den ISOLENA Referenzen.

Teppiche

Bravo

Modell "Fagus"

Teppiche

Webteppich Bravo

Modell "Fagus"

FELICE Design-Teppiche

Timeline

2021

Headline

Timeline kann mit und ohne Bilder angelegt werden. Hat immer 2 Headlines (hier erste Headline Jahreszahl). Formatierung erfolgt automatisch. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet.

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dol

2020

Headline

Ein Button der nirgends hinführt

Video

Videos können im Row-Colum-System beliebig platziert werden. Verwendet man z.B. 3 Columns und platziert in der mittleren das Video, wird es entsprechend kleiner skaliert. Die Videos haben ie Möglichkeit mit Rich-Snippets angereichter zu werden.

Beschriebenes Bild

Überschrift

Eine unterüberschrift

Zum Produkt

Beschriebenes Bild

Zweite Version

Zur Kategorie

Info Slider

Eine unterüberschrift

Überschrift, 30 Zeichen lang!!

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et ju

Zur Seite

Eine unterüberschrift 2

Kürzere Überschrift

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et ju

Zur Seite

Eine unterüberschrift 3

Überschrift, 30 Zeichen lang!!

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et ju

Zur Seite

Testimonial Slider

Max Ein-super-langer-Nachname, den eh niemand trägt, aber zum Testen muss das sein

Teststring für Berufe, die sehr lange sind, um zu testen, wie das dann aussieht

Erika Mustermann

Verkauf

Produkte

Mit diesem Modul können Produkte eingebunden werden. Wahlweise über Materialnummer, eine komplette Produktkategorie. Darstellung kann als Slider erfolgen oder als Produkt-Grid, wo die Produkte untereinander dargestellt werden.