Der ThemeWare® CMS-Block "Hero-Slider (3x)" muss mit den entsprechenden "Hero-Slider" CMS-Elementen befüllt werden. Eine Kompatibilität mit anderen CMS-Elementen können wir derzeit nicht garantieren.
Der "Hero-Slider (3x)" bietet dir die Möglichkeit 3 Slides zu nutzen – nicht mehr und nicht weniger.
Wichtig: Dieser Block ist nur in der ThemeWare® Pro Edition verfügbar.
Anwendungsbeispiele findest du in den ThemeWare® Demoshops:
Hero-Slider
Die ThemeWare® "Hero-Slider"-Blöcke sind CMS-Blöcke die mit den entsprechenden Slider CMS-Elementen befüllt werden müssen. Andere CMS-Elemente funktionieren nicht im Hero-Slider.
Die Slider-Blöcke haben daher spezielle CMS-Elemente.
Wähle einen CMS-Block aus und ziehe diesen einfach per Drag’n’Drop in deine Erlebniswelt.
Hinweis: Den "Hero-Slider" findest du in der Rubrik "ThemeWare® Allgemein" [Pro]
Das "automatische Abspielen" (autoplay) ist aufgrund von Bedenken hinsichtlich der Barrierefreiheit (ab Version 3.7 bzw. 4.0) deaktiviert. Du kannst diese Funktion über die Theme-Konfiguration aktivieren.
In den Block-Einstellungen hast du die Möglichkeit CSS-Klassen für den entsprechenden CMS-Block zu definieren.
Da der ThemeWare® "Hero-Slider" (ab ThemeWare® 2.0) auf dem Bootstrap 5 Carousel () basiert, sind folgende CSS-Klassen besonders interessant:
Füge die CSS-Klasse carousel-fade dem Block hinzu, um Slides mit einem Fade-Übergang anstelle eines Slides zu animieren.
Füge die CSS-Klasse carousel-dark dem Block hinzu, um Steuerelemente dunkler zu gestalten.
Für eine optimale Sichtbarkeit haben die Bedienelemente vom "Hero-Slider" einen Schlagschatten. Dies hilft besonders, wenn die Farbigkeit der Bilder im Slider stark variiert. Möchtest du diese Schlagschatten nicht, füge dem entsprechenden Block einfach die CSS-Klasse flat-controls hinzu.
Anwendungsbeispiele findest du in den ThemeWare® Demoshops:
CMS-Blöcke
In diesem Bereich findest du alles über die ThemeWare® CMS-Blöcke welche du in den "Block-Kategorien" auswählen und deiner Erlebniswelt hinzufügen kannst.
Mit ThemeWare® erhältst du eine umfangreiche und wachsende Auswahl an CMS-Blöcken um deinen Shop zu individualisieren. Die ThemeWare® CMS-Blöcke sind ab Version 0.5.0 in der Pro-Edition und teilweise in der Cloud-Edition verfügbar.
Weitere CMS-Blöcke sind sowohl für die Pro-Edition als auch für die Cloud-Edition in Arbeit und folgen mit kommenden Updates. Sei gespannt!
Klicke auf das Plus-Icon um einen CMS-Block auszuwählen.
Grid 'Two'
Grid 'Three' (swapped)
Grid 'Three'
ThemeWare® CMS-Block Grid 'Two'
Hinweis: Dieser Artikel ist in Arbeit.
Wichtig: Dieser Block ist nur in der ThemeWare® Pro Edition verfügbar.
ThemeWare® CMS-Block Grid 'Three' (swapped)
Hinweis: Dieser Artikel ist in Arbeit.
Wichtig: Dieser Block ist nur in der ThemeWare® Pro Edition verfügbar.
ThemeWare® CMS-Block Grid 'Three'
Hinweis: Dieser Artikel ist in Arbeit.
Wichtig: Dieser Block ist nur in der ThemeWare® Pro Edition verfügbar.
Wähle im Dropdown "Block-Kategorie" den gewünschten CMS-Block aus.
Ziehe den CMS-Block per Drag'n'Drop in deine Erlebniswelt.
ThemeWare® CMS-Block hinzufügen
In der ThemeWare® Pro-Edition haben die ThemeWare® CMS-Blöcke eigene Kategorien und sind nach dem folgenden Muster gegliedert:
ThemeWare® Allgemein
Enthält grundlegende Gestaltungsblöcke wir Slider, Teaser und Banner.
ThemeWare® Spalten
Enthält Spalten-Blöcke die beliebig befüllt werden können.
ThemeWare® Grids
Enthält Grid-Blöcke die mit Bildelementen befüllt werden können.
ThemeWare® Kategorieseite
Enthält CMS-Blöcke für Kategorieseiten.
ThemeWare® Produktseite
Enthält CMS-Blöcke für Produktseiten.
ThemeWare® Sidebar
Enthält CMS-Blöcke für die Sidebar.
ThemeWare® Verschiedenes
Enthält weitere seitenübergreifende CMS-Blöcke.
ThemeWare® Pro-Edition
In der ThemeWare® Cloud-Edition findest du die ThemeWare® CMS-Blöcke in den Standard-Kategorien von Shopware (siehe "Text & Bild").
ThemeWare® Cloud-Edition
Die CMS-Blöcke in Shopware 6 verfügen über verschiedene Konfigurationsfelder. Im Abschnitt "Layout" findest du beispielsweise die Möglichkeit "CSS-Klassen" zu ergänzen und das Padding des Blocks zu definieren.
Block-Einstellungen
In den Block-Einstellungen hast du die Möglichkeit CSS-Klassen für den entsprechenden CMS-Block zu definieren. ThemeWare® bietet dir eine Reihe von CSS-Klassen, die du in deinen Erlebniswelten nutzen kannst.
Für alle CMS-Blöcke sind folgende CSS-Klassen interessant:
Weitere Klassen findest du im Bereich "Anleitungen > Erlebniswelten" in der ThemeWare® Wissensdatenbank:
Du kannst einen bestimmten CMS-Block individuell stylen, indem du ihm in den Block-Einstellungen eine eigene CSS-Klasse zuweist und die gewünschten Styles in deiner CSS-Datei oder der Theme-Konfiguration definierst.
Du kannst die CMS-Elemente in den meisten CMS-Blöcken austauschen. Mehr dazu erfährst du im Bereich CMS-Elemente.
Weitere Informationen und Grundlagen zum Thema "Shopware 6 Erlebniswelten" und "CMS-Blöcken" findest du in der ThemeWare® Wissensdatenbank:
ThemeWare® CMS-Blöcke
Tipp: Wenn du weitere Ideen oder Wünsche zu bestehenden oder neuen Blöcken hast, sende uns gerne Verbesserungsvorschläge über unser Service Portal.
Bedenken hinsichtlich der Barrierefreiheit: Das Aktivieren dieser Funktion kann dazu führen, dass Teile Deiner Storefront für Menschen mit Einschränkungen nicht zugänglich sind. Dies kann eine Nichteinhaltung der in Deiner Gerichtsbarkeit geltenden Barrierefreiheitsgesetze darstellen (z.B. des Europäischen Rechtsakts zur Barrierefreiheit).
Bitte beachte: Mit dem Aktivieren erkennst du dieses Risiko an und übernimmst die volle Verantwortung.
CSS-Klassen
Überblenden (Crossfade)
Dunkle Bedienelemente (Controls)
Flache Bedienelemente (Controls)
Demos
Vier Spalten
Der ThemeWare® CMS-Block "Vier Spalten" (jeweils 25%) ist ein universeller CMS-Block. In diesen kannst du diverse CMS-Elemente platzieren.
ThemeWare® CMS-Block "Vier Spalten" [Pro]
Beispiel
ThemeWare® CMS-Block "Vier Spalten"
Tipp: Die Spaltenabstände kannst du mit den ThemeWare® CSS-Abstandsklassen (siehe ) modifizieren.
Demo
Anwendungsbeispiele findest du in den ThemeWare® Demoshops:
Zwei Spalten, 5-7
Der ThemeWare® CMS-Block "Zwei Spalten, 5-7" (ca. 41.667% | ca. 58.333%) ist ein universeller CMS-Block. In diesen kannst du diverse CMS-Elemente platzieren.
ThemeWare® CMS-Block "Zwei Spalten, 5-7" [Pro]
Beispiel
ThemeWare® CMS-Block "Zwei Spalten, 5-7"
Tipp: Die Spaltenabstände kannst du mit den ThemeWare® CSS-Abstandsklassen (siehe ) modifizieren.
Demo
Anwendungsbeispiele findest du in den ThemeWare® Demoshops:
Zwei Spalten, 8-4
Der ThemeWare® CMS-Block "Zwei Spalten, 8-4" (ca. 66.667% | ca. 33.333%) ist ein universeller CMS-Block. In diesen kannst du diverse CMS-Elemente platzieren.
ThemeWare® CMS-Block "Zwei Spalten, 8-4" [Pro]
Beispiel
ThemeWare® CMS-Block "Zwei Spalten, 8-4"
Tipp: Die Spaltenabstände kannst du mit den ThemeWare® CSS-Abstandsklassen (siehe ) modifizieren.
Demo
Anwendungsbeispiele findest du in den ThemeWare® Demoshops:
Kategorie-Teaser
Die ThemeWare® Kategorie-Teaser-Blöcke haben keine spezielle Funktion und dienen lediglich der Übersicht in der Auswahl der CMS-Blöcke im Erlebniswelt-Editor.
Du musst diese CMS-Blöcke nicht unbedingt nutzen um die entsprechenden CMS-Elemente in deiner Erlebniswelt zu platzieren.
Hinweis: Mehr Informationen zu den ThemeWare® Kategorie-Teaser-Elementen findest du hier:
Verfügbare Kategorie-Teaser-Blöcke
Kategorie-Teaser
Kategorie-Teaser (Advanced)
Kategorie-Teaser (Modern)
Wähle einen CMS-Block aus und ziehe diesen einfach per Drag’n’Drop in deine Erlebniswelt.
Hinweis: Kategorie-Teaser-Blöcke findest du in der Rubrik "ThemeWare® Kategorie-Teaser" [Pro]
Zwei Spalten, 3-9
Der ThemeWare® CMS-Block "Zwei Spalten, 3-9" (25% | 75%) ist ein universeller CMS-Block. In diesen kannst du diverse CMS-Elemente platzieren.
ThemeWare® CMS-Block "Zwei Spalten, 3-9" [Pro]
Beispiel
ThemeWare® CMS-Block "Zwei Spalten, 3-9"
Tipp: Die Spaltenabstände kannst du mit den ThemeWare® CSS-Abstandsklassen (siehe ) modifizieren.
Demo
Anwendungsbeispiele findest du in den ThemeWare® Demoshops:
Grid 'One' (getauscht)
Der ThemeWare® CMS-Block "Grid 'One' (getauscht)" ist ein universeller CMS-Block. In diesen kannst du diverse CMS-Elemente platzieren.
ThemeWare® CMS-Block "Grid 'One' (getauscht)"
Wichtig: Dieser Block ist nur in der ThemeWare® Pro Edition verfügbar.
Standard-Einstellungen
Alle Bild-Elemente nutzen den Darstellungsmodus "Füllen".
Die kleinen Bild-Elemente haben eine minimale Höhe von 320 px.
Das große Bild-Element nutzt die komplette Höhe und sollte eine minimale Höhe 2x der minimalen Höhe der beiden linken Bilde-Elemente haben (z.B. 640 px).
Hinweis: In älteren Versionen von ThemeWare® kann es nötig sein noch die Lücke (z.B. 20px) einem Element zu addieren.
Anwendungsbeispiele findest du in den ThemeWare® Demoshops:
Block-Konfiguration
ThemeWare® erweitert ausgewählte CMS-Blöcke um eine Block-Konfiguration in der CMS-Sidebar (2). Die Block-Konfiguration ermöglicht es dir, das responsive Verhalten deiner CMS-Blöcke komfortabel zu steuern - ohne CSS-Klassen manuell eingeben zu müssen.
Die Konfiguration gliedert sich in zwei Bereiche: das Responsive Block-Layout (3 – Spaltenabstand und Ausrichtung) und das Responsive Spalten-Layout (4 – Spaltenanordnung, Sichtbarkeit und Experten-Modus).
Dies ist die erste Iteration dieser Funktion. Wir haben bereits weitere Ideen für zusätzliche Konfigurationen, möchten uns zunächst aber auf dein Feedback zur aktuellen Umsetzung konzentrieren.
Tipp: Du hast Vorschläge für weitere Konfigurationen oder andere Funktionen für ThemeWare®? Dann sende uns deine Ideen jederzeit gern über das ThemeWare Service Portal:
Wichtig: Diese Funktion ist nur in der ThemeWare® Pro Edition verfügbar.
Responsive Block-Layout
Im Bereich "Responsive Block-Layout" (3) konfigurierst du den Spaltenabstand (Gutter) und die Ausrichtung der Spalten innerhalb des Blocks.
Spaltenabstand (Gutter)
Legt den horizontalen und vertikalen Abstand zwischen den Spalten fest. Du kannst aus verschiedenen vordefinierten Abstandswerten oder "Standard" wählen.
Ausrichtung
Wähle die horizontale Ausrichtung der Spalten innerhalb der Zeile:
Standard (links) - Standardausrichtung
Zentriert - Spalten werden zentriert
Rechts - Spalten werden rechtsbündig ausgerichtet
Mit dem Schalter "Erweiterte Konfiguration" kannst du Gutter und Ausrichtung für jeden Viewport einzeln konfigurieren. Folgende Viewports stehen zur Verfügung:
Desktop Groß (≥1200px)
Desktop (≥992px)
Tablet (≥768px)
Im Bereich "Responsive Spalten-Layout"(4) konfigurierst du die Spaltenanordnung und Sichtbarkeit der einzelnen Spalten.
Spaltenanordnung
Legt fest, wie viele Spalten in einem bestimmten Viewport nebeneinander statt untereinander dargestellt werden. So kannst du z.B. auf einem Tablet drei Spalten auf zwei reduzieren.
Sichtbarkeit
Steuert, ob eine Spalte in einem bestimmten Viewport sichtbar oder ausgeblendet ist.
Asymmetrisch ab
Nur verfügbar bei asymmetrischen Spalten-Blöcken (z.B. Zwei Spalten 3-9, Drei Spalten 3-3-6). Legt fest, ab welchem Viewport die Spalten in der vordefinierten asymmetrischen Aufteilung des Blocks dargestellt werden. Unterhalb dieses Viewports werden die Spalten gleichmäßig oder untereinander angeordnet.
Experten-Modus
Mit dem Schalter "Erweiterte Konfiguration" kannst du Spaltenanordnung und Sichtbarkeit für jeden Viewport einzeln festlegen.
Nicht alle CMS-Blöcke unterstützen alle Bereiche der Block-Konfiguration. Die folgende Übersicht zeigt, welche Block-Typen welche Konfigurationsbereiche bieten:
Symmetrische Spalten-Blöcke wie "Zwei Spalten", "Drei Spalten", "Vier Spalten" und "Sechs Spalten" unterstützen:
Grid-Blöcke wie "Grid One", "Grid Two", "Grid Modern" usw. unterstützen:
Responsive Block-Layout (nur Gutter, keine Ausrichtung)
Der Block "Eine Spalte" unterstützt:
Responsive Spalten-Layout (Spaltenanordnung + Sichtbarkeit, kein Gutter, keine Ausrichtung)
Hero-Slider (4x)
Der ThemeWare® CMS-Block "Hero-Slider (4x)" muss mit den entsprechenden "Hero-Slider" CMS-Elementen befüllt werden. Eine Kompatibilität mit anderen CMS-Elementen können wir derzeit nicht garantieren.
Der "Hero-Slider (4x)" bietet dir die Möglichkeit 4 Slides zu nutzen – nicht mehr und nicht weniger.
Wichtig: Dieser Block ist nur in der ThemeWare® Pro Edition verfügbar.
Anwendungsbeispiele findest du in den ThemeWare® Demoshops:
Grid 'Five'
Hinweis: Dieser Artikel ist in Arbeit.
ThemeWare® CMS-Block Grid 'Five'
Wichtig: Dieser Block ist nur in der ThemeWare® Pro Edition verfügbar.
Kategorieseite
Die ThemeWare® CMS-Blöcke für Kategorieseiten selber haben keine spezielle Funktion. Du musst diese aber nutzen um die entsprechenden CMS-Elemente in deiner Erlebniswelt zu platzieren.
Hinweis: Mehr zu den ThemeWare® Elementen für Kategorien findest du hier:
Verfügbare Blöcke
Unterkategorien im Listing
Unterkategorien im Listing (Modern)
Wichtig: Diese Blöcke sind nur in der ThemeWare® Pro Edition verfügbar.
Block hinzufügen
Wähle einen CMS-Block aus und ziehe diesen einfach per Drag’n’Drop in deine Erlebniswelt.
Hinweis: Diese Blöcke findest du in der Rubrik "ThemeWare® Kategorieseite" [Pro]
Zwei Spalten
Der ThemeWare® CMS-Block "Zwei Spalten" (50% | 50%) ist ein universeller CMS-Block. In diesen kannst du diverse CMS-Elemente platzieren.
ThemeWare® CMS-Block "Zwei Spalten" [Pro]
Beispiel
ThemeWare® CMS-Block "Zwei Spalten"
Tipp: Die Spaltenabstände kannst du mit den ThemeWare® CSS-Abstandsklassen (siehe ) modifizieren.
Demo
Anwendungsbeispiele findest du in den ThemeWare® Demoshops:
Grid 'Modern' (getauscht)
Der ThemeWare® CMS-Block "Grid 'Modern '(getauscht)" ist ein universeller CMS-Block. In diesen kannst du diverse CMS-Elemente platzieren.
ThemeWare® CMS-Block "Grid 'Modern' (getauscht)"
Wichtig: Dieser Block ist nur in der ThemeWare® Pro Edition verfügbar.
Standard-Einstellungen
Alle Bild-Elemente nutzen den Darstellungsmodus "Füllen".
Die kleinen Bild-Elemente haben eine minimale Höhe von 300 px.
Die beiden großen Bild-Element haben eine minimale Höhe von 640 px.
Tipp: Achte darauf, dass die Summe minimalen Höhen auf beiden Seiten gleich sind.
Der ThemeWare® CMS-Block "Countdown-Banner (kompakt)" hat keine spezielle Funktion. Du musst diesen CMS-Block aber nutzen um das entsprechende CMS-Element in deiner Erlebniswelt zu platzieren.
ThemeWare® "Countdown-Banner (kompakt)"
...
Wichtig: Dieser Block ist nur in der ThemeWare® Pro Edition verfügbar.
Mehr Informationen zum CMS-Element findest du hier:
Der ThemeWare® CMS-Block "Drei Spalten, 3-3-6" (25% | 25% | 50%) ist ein universeller CMS-Block. In diesen kannst du diverse CMS-Elemente platzieren.
ThemeWare® CMS-Block "Drei Spalten, 3-3-6" [Pro}
Beispiel
ThemeWare® CMS-Block "Drei Spalten, 3-3-6"
Tipp: Die Spaltenabstände kannst du mit den ThemeWare® CSS-Abstandsklassen (siehe ) modifizieren.
Demo
Anwendungsbeispiele findest du in den ThemeWare® Demoshops:
Hero-Slider (2x)
Der ThemeWare® CMS-Block "Hero-Slider (2x)" muss mit den entsprechenden "Hero-Slider" CMS-Elementen befüllt werden. Eine Kompatibilität mit anderen CMS-Elementen können wir derzeit nicht garantieren.
Der "Hero-Slider (2x)" bietet dir die Möglichkeit 2 Slides zu nutzen – nicht mehr und nicht weniger.
Wichtig: Dieser Block ist nur in der ThemeWare® Pro Edition verfügbar.
Anwendungsbeispiele findest du in den ThemeWare® Demoshops:
Discount-Banner
Hinweis: Dieser Artikel ist in Arbeit.
Der ThemeWare® CMS-Block "Discount-Banner" hat keine spezielle Funktion. Du musst diesen CMS-Block aber nutzen um das entsprechende CMS-Element in deiner Erlebniswelt zu platzieren.
ThemeWare® "Discount-Banner"
...
Wichtig: Dieser Block ist nur in der ThemeWare® Pro Edition verfügbar.
Mehr Informationen zum CMS-Element findest du hier:
Wähle einen CMS-Block aus und ziehe diesen einfach per Drag’n’Drop in die Sidebar-Sektion deiner Erlebniswelt.
Hinweis: Sidebar-Blöcke findest du in der Rubrik "ThemeWare® Sidebar" [Pro]
Countdown-Banner
Hinweis: Dieser Artikel ist in Arbeit.
Der ThemeWare® CMS-Block "Countdown-Banner" hat keine spezielle Funktion. Du musst diesen CMS-Block aber nutzen um das entsprechende CMS-Element in deiner Erlebniswelt zu platzieren.
ThemeWare® "Countdown-Banner"
...
Wichtig: Dieser Block ist nur in der ThemeWare® Pro Edition verfügbar.
Mehr Informationen zum CMS-Element findest du hier:
Eine Anwendungsbeispiel findest du in unseren Demoshops:
Demo folgt...
Zwei Spalten, 4-8
Der ThemeWare® CMS-Block "Zwei Spalten, 4-8" (ca. 33.333% | ca. 66.667%) ist ein universeller CMS-Block. In diesen kannst du diverse CMS-Elemente platzieren.
Anwendungsbeispiele findest du in den ThemeWare® Demoshops:
Banner
Die ThemeWare® Banner-Blöcke selber haben keine spezielle Funktion. Du musst diese aber nutzen um die entsprechenden CMS-Elemente in deiner Erlebniswelt zu platzieren.
Image-Banner
Parallax-Banner
Eine Spalte
Der ThemeWare® CMS-Block "Eine Spalte" (100%) ist ein universeller CMS-Block. In diesen kannst du diverse CMS-Elemente platzieren.
Anwendungsbeispiele findest du in den ThemeWare® Demoshops:
Drei Spalten
Der ThemeWare® CMS-Block "Drei Spalten" (jeweils ca. 33.333%) ist ein universeller CMS-Block. In diesen kannst du diverse CMS-Elemente platzieren.
Anwendungsbeispiele findest du in den ThemeWare® Demoshops:
Teaser
Die ThemeWare® Teaser-Blöcke haben keine spezielle Funktion und dienen lediglich der Übersicht in der Auswahl der CMS-Blöcke im Erlebniswelt-Editor.
Du musst diese CMS-Blöcke nicht unbedingt nutzen um die entsprechenden CMS-Elemente in deiner Erlebniswelt zu platzieren.
Text-Teaser
Testimonial (Kundenrezension)
Der ThemeWare® CMS-Block "Testimonial (Kundenrezension)" hat keine spezielle Funktion und dient lediglich der Übersicht in der Auswahl der CMS-Blöcke im Erlebniswelt-Editor.
Du musst diesen CMS-Block nicht unbedingt nutzen um das entsprechende CMS-Element in deiner Erlebniswelt zu platzieren.
Mehr Informationen zum CMS-Element findest du hier:
Wähle einen CMS-Block aus und ziehe diesen einfach per Drag’n’Drop in deine Erlebniswelt.
Hinweis
Drei Spalten, 6-3-3
Der ThemeWare® CMS-Block "Drei Spalten, 6-3-3" (50% | 25% | 25%) ist ein universeller CMS-Block. In diesen kannst du diverse CMS-Elemente platzieren.
Anwendungsbeispiele findest du in den ThemeWare® Demoshops:
Drei Spalten, 8-2-2
Der ThemeWare® CMS-Block "Drei Spalten, 8-2-2" (ca. 66.667% | ca. 16.667% | ca. 16.667%) ist ein universeller CMS-Block. In diesen kannst du diverse CMS-Elemente platzieren.
Anwendungsbeispiele findest du in den ThemeWare® Demoshops:
Hero-Countdown
Der ThemeWare® CMS-Block "Hero-Countdown" hat keine spezielle Funktion. Du musst diesen CMS-Block aber nutzen um das entsprechende CMS-Element in deiner Erlebniswelt zu platzieren.
Der CMS-Block "Hero-Countdown" besteht aus zwei CMS-Elementen:
Breadcrumb-Navigation
Der ThemeWare® CMS-Block "Breadcrumb-Navigation" ist eine Variante vom Shopware CMS-Block "Breadcrumb-Navigation".
Der CMS-Block hat keine spezielle Funktion. Du musst diesen CMS-Block aber nutzen um das entsprechende CMS-Element in deiner Erlebniswelt zu platzieren.
Mehr Informationen zum CMS-Element findest du hier:
Wähle einen CMS-Block aus und ziehe diesen einfach per Drag’n’Drop in deine Erlebniswelt.
Hinweis: Diese Blöcke findest du in der Rubrik "ThemeWare® Verschiedenes" [Pro]
Grid 'Six'
Grid 'Four'
Testimonials (Vier Spalten)
Der ThemeWare® CMS-Block "Testimonials (Vier Spalten)" hat keine spezielle Funktion. Der Block symbolisiert die Flexibilität des CMS-Elementes "Testimonial (Kundenrezension)", welches in verschiedenen (Spalten-) Blöcken genutzt werden kann.
Mehr Informationen zum CMS-Element findest du hier:
Wähle einen CMS-Block aus und ziehe diesen einfach per Drag’n’Drop in deine Erlebniswelt.
Hinweis: Diese Blöcke findest du in der Rubrik "ThemeWare® Verschiedenes" [Pro]
Grid 'Five' (swapped)
Grid 'Two' (swapped)
Grid 'Six' (swapped)
Bild & Text überlagernd
Mehr Informationen zum CMS-Element findest du hier:
Unterkategorie-Navigation (Sidebar)
Der ThemeWare® CMS-Block "Unterkategorie-Navigation (Sidebar)" ist eine Variante vom Shopware CMS-Block "Kategorie-Navigation".
Der CMS-Block hat keine spezielle Funktion. Du musst diesen CMS-Block aber nutzen um das entsprechende CMS-Element in deiner Erlebniswelt zu platzieren.
Mehr Informationen zum CMS-Element findest du hier:
Text & Bild
Die ThemeWare® "Text & Bild"-Blöcke selber haben keine spezielle Funktion. Du musst diese aber nutzen um die entsprechenden CMS-Elemente in deiner Erlebniswelt zu platzieren.
Wähle einen CMS-Block aus und ziehe diesen einfach per Drag’n’Drop in deine Erlebniswelt.
Hinweis: "Text & Bild"-Blöcke findest du in der Rubrik "ThemeWare® Text & Bild" [Pro]
Individueller Code (HTML/CSS/JS)
Der ThemeWare® CMS-Block "Individueller Code (HTML/CSS/JS)" hat keine spezielle Funktion und dient lediglich der Übersicht in der Auswahl der CMS-Blöcke im Erlebniswelt-Editor.
Du musst diesen CMS-Block nicht unbedingt nutzen um das entsprechende CMS-Element in deiner Erlebniswelt zu platzieren.
Mehr Informationen zum CMS-Element findest du hier:
Wähle einen CMS-Block aus und ziehe diesen einfach per Drag’n’Drop in deine Erlebniswelt.
Hinweis: Diese Blöcke findest du in der Rubrik "ThemeWare® Verschiedenes" [Pro]
Ermöglicht die manuelle Eingabe von CSS-Klassen pro Spalte (z.B. col-12 col-md-6). Der Experten-Modus überschreibt die Spaltenanordnung und die Sichtbarkeits-Konfiguration.
Hinweis: Ohne die erweiterte Konfiguration gelten die Werte für alle Viewports gleichermaßen.
Responsive Spalten-Layout
Erweiterte Konfiguration
Hinweis: Ohne die erweiterte Konfiguration gelten die Werte für alle Viewports gleichermaßen.
Unterstützte Blöcke
Spalten-Blöcke (symmetrisch)
Asymmetrische Spalten-Blöcke
Grid-Blöcke
Eine Spalte
Tipp: Du hast Vorschläge für weitere Konfigurationen oder andere Funktionen für ThemeWare®? Dann sende uns deine Ideen jederzeit gern über das ThemeWare Service Portal:
Der ThemeWare® CMS-Block "Produktname (ohne Hersteller-Logo)" ist eine Variante vom Shopware CMS-Block "Produktname & Hersteller-Logo" nur ohne Hersteller-Logo.
Der CMS-Block ist von Haus aus mit den vorgesehenen Standard-CMS-Elementen von Shopware befüllt. Wir raten davon ab, die Elemente auszutauschen.
Wichtig: Dieser Block ist nur in der ThemeWare® Pro Edition verfügbar.
Mehr Informationen zu den Shopware CMS-Elementen findest du in der Shopware-Dokumentation.
Beispiel
Demo
Anwendungsbeispiele findest du in unseren Demoshops:
Demo folgt...
Drei Spalten, 2-8-2
Der ThemeWare® CMS-Block "Drei Spalten, 2-8-2" (ca. 16.667% | ca. 66.667% | ca. 16.667%) ist ein universeller CMS-Block. In diesen kannst du diverse CMS-Elemente platzieren.
ThemeWare® CMS-Block "Drei Spalten, 2-8-2" [Pro]
Beispiel
ThemeWare® CMS-Block "Drei Spalten, 2-8-2"
Tipp: Die Spaltenabstände kannst du mit den ThemeWare® CSS-Abstandsklassen (siehe ) modifizieren.
Demo
Anwendungsbeispiele findest du in den ThemeWare® Demoshops:
Grid 'One'
Der ThemeWare® CMS-Block "Grid 'One'" ist ein universeller CMS-Block. In diesen kannst du diverse CMS-Elemente platzieren.
ThemeWare® CMS-Block "Grid 'One'"
Wichtig: Dieser Block ist nur in der ThemeWare® Pro Edition verfügbar.
Standard-Einstellungen
Alle Bild-Elemente nutzen den Darstellungsmodus "Füllen".
Die kleinen Bild-Elemente haben eine minimale Höhe von 320 px.
Das große Bild-Element nutzt die komplette Höhe und sollte eine minimale Höhe 2x der minimalen Höhe der beiden linken Bilde-Elemente haben (z.B. 640 px).
Hinweis: In älteren Versionen von ThemeWare® kann es nötig sein noch die Lücke (z.B. 20px) einem Element zu addieren.
Anwendungsbeispiele findest du in den ThemeWare® Demoshops:
Grid 'Modern'
Der ThemeWare® CMS-Block "Grid 'Modern'" ist ein universeller CMS-Block. In diesen kannst du diverse CMS-Elemente platzieren.
ThemeWare® CMS-Block "Grid 'Modern'"
Wichtig: Dieser Block ist nur in der ThemeWare® Pro Edition verfügbar.
Standard-Einstellungen
Alle Bild-Elemente nutzen den Darstellungsmodus "Füllen".
Die kleinen Bild-Elemente haben eine minimale Höhe von 300 px.
Die beiden großen Bild-Element haben eine minimale Höhe von 640 px.
Tipp: Achte darauf, dass die Summe minimalen Höhen auf beiden Seiten gleich sind.
Anwendungsbeispiele findest du in den ThemeWare® Demoshops:
Sechs Spalten
Der ThemeWare® CMS-Block "Sechs Spalten" (jeweils ca. 16,667%) ist ein universeller CMS-Block. In diesen kannst du diverse CMS-Elemente platzieren.
ThemeWare® CMS-Block "Sechs Spalten" [Pro]
Beispiel
ThemeWare® CMS-Block "Sechs Spalten"
Tipp: Die Spaltenabstände kannst du mit den ThemeWare® CSS-Abstandsklassen (siehe ) modifizieren.
Demo
Anwendungsbeispiele findest du in den ThemeWare® Demoshops:
Sale
Die ThemeWare® "Sale"-CMS-Blöcke selber haben keine spezielle Funktion. Du musst diese aber nutzen um die entsprechenden CMS-Elemente in deiner Erlebniswelt zu platzieren.
Hinweis: Mehr zu den ThemeWare® "Sale"-Elementen findest du hier:
Wähle einen CMS-Block aus und ziehe diesen einfach per Drag’n’Drop in deine Erlebniswelt.
Hinweis: "Sale"-CMS-Blöcke findest du in der Rubrik "ThemeWare® Sale" [Pro]
Produktseite
Hinweis: Dieser Artikel ist in Arbeit.
Die ThemeWare® CMS-Blöcke für Produktseiten haben keine spezielle Funktion. Du kannst diese aber nutzen um die entsprechenden CMS-Elemente in deiner Erlebniswelt zu platzieren.
Hinweis: Mehr zu den ThemeWare® Elementen für Produktseiten findest du hier:
Wähle einen CMS-Block aus und ziehe diesen einfach per Drag’n’Drop in deine Erlebniswelt.
Hinweis: Diese Blöcke findest du in der Rubrik "ThemeWare® Produktseite" [Pro]
Fünf Spalten
Der ThemeWare® CMS-Block "Fünf Spalten" (jeweils 20%) ist ein universeller CMS-Block. In diesen kannst du diverse CMS-Elemente platzieren.
ThemeWare® CMS-Block "Fünf Spalten" [Pro]
Beispiel
ThemeWare® CMS-Block "Fünf Spalten"
Tipp: Die Spaltenabstände kannst du mit den ThemeWare® CSS-Abstandsklassen (siehe ) modifizieren.
Demo
Anwendungsbeispiele findest du in den ThemeWare® Demoshops:
Galerie und Buybox (mit Produktname & Hersteller-Logo)
Hinweis: Dieser Artikel ist in Arbeit.
Der ThemeWare® CMS-Block "Galerie und Buybox (mit Produktname & Hersteller-Logo)" ist eine Variante vom Shopware CMS-Block "Galerie und Buybox" und stellt zusätzlich den Produktnamen samt Hersteller-Logo über der Buybox dar.
ThemeWare® CMS-Block "Galerie und Buybox (mit Produktname & Hersteller-Logo)"
Der CMS-Block ist von Haus aus mit den vorgesehenen Standard-CMS-Elementen von Shopware befüllt. Wir raten davon ab, die Elemente auszutauschen.
Wichtig: Dieser Block ist nur in der ThemeWare® Pro Edition verfügbar.
Mehr Informationen zu den Shopware CMS-Elementen findest du in der Shopware-Dokumentation.
Beispiel
Demo
Anwendungsbeispiele findest du in unseren Demoshops:
Demo folgt...
Drei Spalten, 2-2-8
Der ThemeWare® CMS-Block "Drei Spalten, 2-2-8" (ca. 16.667% | ca. 16.667% | ca. 66.667%) ist ein universeller CMS-Block. In diesen kannst du diverse CMS-Elemente platzieren.
ThemeWare® CMS-Block "Drei Spalten, 2-2-8" [Pro]
Beispiel
ThemeWare® CMS-Block "Drei Spalten, 2-2-8"
Tipp: Die Spaltenabstände kannst du mit den ThemeWare® CSS-Abstandsklassen (siehe ) modifizieren.
Demo
Anwendungsbeispiele findest du in den ThemeWare® Demoshops:
Zwei Spalten, 7-5
Der ThemeWare® CMS-Block "Zwei Spalten, 7-5" (ca. 58.333% | ca. 41.667%) ist ein universeller CMS-Block. In diesen kannst du diverse CMS-Elemente platzieren.
ThemeWare® CMS-Block "Zwei Spalten, 7-5" [Pro]
Beispiel
ThemeWare® CMS-Block "Zwei Spalten, 7-5"
Tipp: Die Spaltenabstände kannst du mit den ThemeWare® CSS-Abstandsklassen (siehe ) modifizieren.
Demo
Anwendungsbeispiele findest du in den ThemeWare® Demoshops:
Galerie und Buybox (mit Produktname)
Hinweis: Dieser Artikel ist in Arbeit.
Der ThemeWare® CMS-Block "Galerie und Buybox (mit Produktname)" ist eine Variante vom Shopware CMS-Block "Galerie und Buybox" und stellt zusätzlich den Produktnamen über der Buybox dar.
ThemeWare® CMS-Block "Galerie und Buybox (mit Produktname)"
Der CMS-Block ist von Haus aus mit den vorgesehenen Standard-CMS-Elementen von Shopware befüllt. Wir raten davon ab, die Elemente auszutauschen.
Wichtig: Dieser Block ist nur in der ThemeWare® Pro Edition verfügbar.
Mehr Informationen zu den Shopware CMS-Elementen findest du in der Shopware-Dokumentation.
Beispiel
Demo
Anwendungsbeispiele findest du in unseren Demoshops:
Demo folgt...
Drei Spalten, 3-6-3
Der ThemeWare® CMS-Block "Drei Spalten, 3-6-3" (25% | 50% | 25%) ist ein universeller CMS-Block. In diesen kannst du diverse CMS-Elemente platzieren.
ThemeWare® CMS-Block "Drei Spalten, 3-6-3" [Pro]
Beispiel
ThemeWare® CMS-Block "Drei Spalten, 3-6-3"
Tipp: Die Spaltenabstände kannst du mit den ThemeWare® CSS-Abstandsklassen (siehe ) modifizieren.
Demo
Anwendungsbeispiele findest du in den ThemeWare® Demoshops:
Grids
Die ThemeWare® Grid-Blöcke sind universelle CMS-Blöcke. In diesen Blöcken kannst du verschiedene CMS-Elemente platzieren.
Die Grid-Blöcke haben daher keine speziellen CMS-Elemente.
Zwei Spalten (auf Handys getauscht)
Der ThemeWare® CMS-Block "Zwei Spalten (auf Handys getauscht)" (50% | 50%) ist ein universeller CMS-Block. In diesen kannst du diverse CMS-Elemente platzieren.
Der CMS-Block "Zwei Spalten (auf Handys getauscht)" ist eine Variante vom CMS-Block "Zwei Spalten" (siehe ). Hier unterscheidet sich lediglich die Anordnung der beiden Spalten in mobilen Viewports. In dieser Variante wird die zweite Spalte oberhalb der ersten Spalte angeordnet und nicht darunter.
Anwendungsbeispiele findest du in den ThemeWare® Demoshops:
Wähle einen CMS-Block aus und ziehe diesen einfach per Drag’n’Drop in deine Erlebniswelt.
Hinweis: Spalten-Blöcke findest du in der Rubrik "ThemeWare® Grids" [Pro]
Grid CMS-Block hinzufügen
Aufgrund des fluiden Webdesigns von Shopware 6 gibt es keine "perfekte" oder "richtige" Bildgröße. Die Größe der einzelnen Elemente ist variabel und abhängig vom verfügbaren Platz den die Elemente haben. Der verfügbare Platz unterliegt diversen Faktoren wie dem konfigurierbaren Padding des Blocks, der konfigurierbaren Container-Breite, dem Darstellungsmodus der Erlebniswelt und natürlich durch die Fensterbreite selbst in verschiedenen Viewports bestimmt. Dadurch kann es nicht den einen Wert geben.
Wir empfehlen daher für Bild-Elemente in Grid-Blöcken den Darstellungsmodus "Füllen". Dabei wird das Bild so skaliert und ggf. abgeschnitten, dass der Bild-Container immer vollständig ausgefüllt ist. Die Größe der Elemente selber kannst du über die Konfiguration "Minimale Höhe" definieren, mehr Informationen dazu findest du im folgenden Abschnitt.
Als Bild-Elemente kannst du die Teaser von ThemeWare® in den Grids nutzen. (Das Bild-Element von Shopware funktioniert ebenfalls.)
Die Größe der Elemente definierst du über die Konfiguration "Minimale Höhe" im Modus "Füllen" der entsprechenden Elemente. Damit Grids gut funktionieren ist hier etwas Mathematik nötig: Die "Minimale Höhe" der Elemente auf der linken Seite sollte in Summe dieselbe Höhe haben wie die Summe der "Minimale Höhe" aller Elemente auf der rechten Seite. Addiere etwaige Lücken (Standard: 40px) zwischen den Elementen noch dazu.
In den Block-Einstellungen hast du die Möglichkeit CSS-Klassen für den entsprechenden CMS-Block zu definieren.
Für die ThemeWare® Grid-Blöcke sind folgende CSS-Klassen für die Abstände der Elemente im Block interessant:
Anwendungsbeispiele findest du in den ThemeWare® Demoshops:
Hinweis: Ohne "vertikale" und "horizontale" Ausrichtung werden die ThemeWare® Teaser auf die volle Höhe gestreckt. Dadurch kannst du für einzelne Elemente in asymmetrischen Grids (z.B. "Grid 'One'") auch von der oben genannten Rechnung abweichen und musst nicht auf eine identische Höhe beider Spalten achten.
Wähle einen CMS-Block aus und ziehe diesen einfach per Drag’n’Drop in deine Erlebniswelt.
Hinweis: Spalten-Blöcke findest du in der Rubrik "ThemeWare® Spalten" [Pro] bzw. in der Rubrik "Text & Bild" [Cloud]
Die ThemeWare® Spalten-Blöcke sind mit Platzhalter-Elementen befüllt. Du kannst diese Elemente durch beliebige CMS-Elemente austauschen:
Klicke auf den entsprechenden CMS-Block (1) um den Bearbeitungsmodus zu aktivieren
Klicke auf das gewünschte Platzhalter-Element (2) um ein neues CMS-Element auszuwählen
Es öffnet sich das Pop-up "Element auswählen"
Du hast nun das CMS-Element ausgetauscht.
Aufgrund des fluiden Webdesigns von Shopware 6 gibt es keine "perfekte" oder "richtige" Bildgröße. Die Größe der einzelnen Elemente ist variabel und abhängig vom verfügbaren Platz den die Elemente haben. Der verfügbare Platz unterliegt diversen Faktoren wie dem konfigurierbaren Padding des Blocks, der konfigurierbaren Container-Breite, dem Darstellungsmodus der Erlebniswelt und natürlich durch die Fensterbreite selbst in verschiedenen Viewports bestimmt. Dadurch kann es nicht den einen Wert geben.
Wir empfehlen daher für Bild-Elemente in Spalten-Blöcken den Darstellungsmodus "Füllen". Dabei wird das Bild so skaliert und ggf. abgeschnitten, dass der Bild-Container immer vollständig ausgefüllt ist. Alternativ funktioniert auch der Darstellungsmodus "Strecken" recht gut, wenn alle Bilder einer Spalte die selbe Größe/Proportion haben.
In den Block-Einstellungen hast du die Möglichkeit CSS-Klasssen für den entsprechenden CMS-Block zu definieren.
Für die ThemeWare® Spalten-Blöcke sind folgende CSS-Klassen besonders interessant:
Anwendungsbeispiele findest du in den ThemeWare® Demoshops:
Der ThemeWare® CMS-Block "Sechs Spalten (Individuell)" (jeweils ca. 16,667%) ist ein universeller CMS-Block. In diesen kannst du diverse CMS-Elemente platzieren.
Dieser Block kann die Experten-Konfiguration "CSS-Klasse (Spalte)" bestimmter CMS-Elemente berücksichtigen.
Mehr Informationen zu den CSS-Klassen findest du in der ThemeWare® Wissensdatenbank:
Anwendungsbeispiele findest du in den ThemeWare® Demoshops:
Hinweis: Dieser Block richtet sich an Experten die sich mit CMS-Blöcken, CMS-Elementen und dem Bootstrap Grid-System sehr gut auskennen und mit diesem Block umfangreiche individuelle Anpassungen umgehen können.
Wichtig: Bitte beachte, dass sich dieser Block derzeit in einer Testphase befindet und ggf. noch einmal geändert werden kann.
Individuelle Spaltenbreiten
Beispiel
Tipp: Die Spaltenabstände kannst du mit den ThemeWare® CSS-Abstandsklassen (siehe ) modifizieren.