ThemeWare® 3.2.0

ThemeWare® 3.2.0 ist da! 🎉

Wie bei allen Updates und besonders bei so umfangreichen Updates wie diesem empfehlen wir dir das Update vorab in einem Testsystem zu installieren. So kannst du etwaige Änderungen in Ruhe prüfen und ggf. Anpassungen vornehmen. Zudem empfehlen wir ein vollständiges Backup deines Shops vor dem Update zu machen.

Bitte beachte zudem, dass sich die Beta-Funktionen noch in der Testphase befinden und sich in einem kommenden Release ändern können.

Der neue Release umfasst folgende Änderungen:

Highlights

• CMS-Block "Grid 'Modern' (getauscht)" hinzugefügt [Pro-Edition] #PremiumRequest
• CMS-Blöcke "Galerie und Buybox" mit zusätzlichen Slots hinzugefügt [Pro-Edition] #FeatureRequest
• CMS-Block/-Element "Produktbeschreibung und -bewertungen (Accordion)" hinzugefügt [Pro-Edition] #FeatureRequest #beta
• CMS-Element "Galerie (Grid)" hinzugefügt [Pro-Edition] #beta
• Neuer Tab "Datenblätter" hinzugefügt
• Neue CSS-"Abstandsklassen" für Grid- und Spalten-Blöcke hinzugefügt
• Neue Erweiterung "Hero-Sektion" hinzugefügt
• Neue Erweiterung "Quickview" hinzugefügt #FeatureRequest #beta
• Neue Funktion "Dropdown Top-Navigation" hinzugefügt #FeatureRequest #beta
• Neue Funktion "Mengenauswahl in Produkt-Boxen" hinzugefügt #beta
• Neue Funktion "Produktbild-Größenanpassung" hinzugefügt #beta
• Neue Funktion "Datenblätter" im Tab "Beschreibung" ergänzt
• Neue Funktion "Downloads" im Tab "Beschreibung" ergänzt
• Neue Funktion "HTML5-Videos" im Tab "Beschreibung" ergänzt
• Neue Funktion "HTML5-Video" im Tab "Produkt-Videos" ergänzt
• Neue Funktion "Kommentar" im Tab "Beschreibung" ergänzt
• Neue Funktion "Weiterführende Links" im Tab "Beschreibung" ergänzt
• Neue Konfiguration für eine Überschrift der "Kategorie-Navigation" (Sidebar) ergänzt
• Neue Option "Listenansicht" im Listing-Element ergänzt [Pro-Edition] #beta
• Neue Produkt-Zusatzfelder für "Datenblätter" hinzugefügt #FeatureRequest
• Neue Produkt-Zusatzfelder für "Downloads" hinzugefügt
• Neue Produkt-Zusatzfelder für "HTML5-Videos" hinzugefügt #FeatureRequest
• Neue Produkt-Zusatzfelder für "Weiterführende Links" hinzugefügt
• Neues Produkt-Zusatzfeld für einen "Kommentar" hinzugefügt
• Neue Kategorie-Zusatzfelder "Spalten pro Zeile" ergänzt
• Neue Kategorie-Zusatzfelder für die "Hero-Sektion" hinzugefügt
• Neues Kategorie-Zusatzfeld für die "Unterkategorien im Listing" hinzugefügt

Änderungen

• Blur-Effekt für das "Cookie-Hinweis"-Overlay kann konfiguriert werden
• Blur-Effekt für das "Vollbildsuche"-Overlay kann konfiguriert werden
• Blur-Effekt für Modal-Overlays kann konfiguriert werden
• CSS-"Abstandsklassen" für Spalten- und Grid-Blöcke aktualisiert und korrigiert
• Darstellung der Tabellen auf Produktseiten verbessert
• Erweiterung "Unterkategorien im Listing" überarbeitet
• Farbkontrast der "Produkt-Badges" verbessert
• Fünf-Spalten-Option für "Listing"-Layouts ergänzt #FeatureRequest #beta
• Fünf-Spalten-Option in der Erweiterung "Unterkategorien im Listing" ergänzt #beta
• Hover-Effekt "slide up (NEU)" vom "Kaufen-Button" verbessert
• Hover-Effekt von Links im "Flyout" der "Top-Navigation" verbessert
• Icon für externe Links im "Flyout" der "Top-Navigation" ergänzt #beta
• Konfiguration der Abstände von "Sidebar-Widgets" erweitert und verbessert
• Padding vom "Copyright-Footer" in mobilen Viewports verbessert
• Tab "Beschreibung" überarbeitet
• Tab "Benutzerdefinierter-Inhalt" überarbeitet
• Tab "Hersteller" überarbeitet
• Tab "Produkt-Videos" überarbeitet
• Vorschau einiger CMS-Elemente verbessert [Pro-Edition]
• Bugfix: Ausrichtung der Footer-Headlines in mobilen Viewports verbessert
• Bugfix: Die Overlay-Farbe vom "Cookie-Hinweis" kann wieder konfiguriert werden
• Bugfix: Eigenschaften-Überschrift und -Infotext im Tab "Beschreibung" korrigiert
• Bugfix: Hintergrundfarbe der Modals korrigiert

Hinweise

• Die Erweiterung "Unterkategorien im Listing" wurde in eine andere Template-Datei verschoben
• Die Template-Dateien für den "Benutzerdefinierten-Tab" wurden überarbeitet
• Die Template-Dateien für den "Video-Tab" wurden überarbeitet
• Die "Vollbildsuche" hat eine neue Konfiguration für die Hintergrundfarbe des Overlays
• Modals haben eine neue Konfiguration für die Hintergrundfarbe des Overlays

---

Highlights

ThemeWare® 3.2.0 ist rappelvoll mit vielen neuen Features. Nachfolgend findest du eine Übersicht der neuen Funktionen und Möglichkeiten die du mit diesem Update erhältst:

CMS-Block "Grid 'Modern' (getauscht)" hinzugefügt [Pro-Edition] #PremiumRequest

Im Rahmen eines Kundenprojektes haben wir einen neuen CMS-Block erstellt. Der Block "Grid 'Modern' (getauscht)" ist, wie der Name vermuten lässt, eine "invertierte" Variante vom "Grid 'Modern'"-Block.

CMS-Block/-Element "Produktbeschreibung und -bewertungen (Accordion)" hinzugefügt [Pro-Edition] #FeatureRequest #beta

Teste gerne einmal unser neues CMS-Element "Produktbeschreibung und -bewertungen (Accordion)". Damit wird die Produktbeschreibung auf Produktseiten als "Accordion" anstatt mit Tabs dargestellt.

CMS-Blöcke "Galerie und Buybox" mit zusätzlichen Slots hinzugfügt [Pro-Edition] #FeatureRequest

Ein "Verbesserungsvorschlag" für einen frei belegbaren Slot in den "Galerie und Buybox" CMS-Blöcken wurde umgesetzt. So können ganz einfach weitere Elemente unter der Galerie bzw. unter der Buybox ergänzt werden.

CMS-Element "Galerie (Grid)" hinzugefügt [Pro-Edition] #beta

Teste gerne einmal unser neues CMS-Element "Galerie (Grid)". Dieses bietet dir neue und individuelle Layout-Möglichkeiten für die Galerie auf deinen Produktseiten.

Neuer Tab "Datenblätter" hinzugefügt

Ein neuer Tab für "Datenblätter" wurde hinzugefügt. Datenblätter kannst du in Form von PDFs über neue Zusatzfelder im jeweiligen Produkt hinterlegen.

Tab "Produktseiten" => Bereich "Tab "Datenblätter"" => Datenblätter-Tab anzeigen

Neue CSS-"Abstandsklassen" für Grid- und Spalten-Blöcke hinzugefügt

Mit diesem ThemeWare®-Release haben wir neue Abstandsklassen für Erlebniswelten ergänzt. Diese definieren die Abstände der einzelnen CMS-Elemente in Grid- und Spalten-Blöcken.

Die CSS-Klasse .twt-cms-gap-10 sorgt beispielsweise für einen Abstand (Gap) von 10px. Dies entspricht einem padding left/right von 5px sowie einem margin-bottom von 10px in Grids.

Zudem gilt dies auch für den Abstand (margin-bottom) von "Spalten" in mobilen Viewports. So kannst du nun eine CSS-Klasse für alle Abstände nutzen.

Neue Erweiterung "Hero-Sektion" hinzugefügt

Mit diesem ThemeWare®-Release haben wir eine neue Theme-Erweiterung "Hero-Sektion" hinzugefügt. Diese stellt den Kategorienamen und -text in einem ansprechenden "Banner" dar.

Hast du zudem ebenfalls ein Kategoriebild hinterlegt, wird dies als Hintergrundbild genutzt. Du kannst aber auch ein individuelles Hintergrundbild über ein entsprechendes Kategorie-Zusatzfeld nutzen.

Darüber hinaus hast du die Möglichkeit die Breadcrumb in den Banner zu integrieren.

Tab "Erweiterungen" => Bereich "Hero-Sektion (auf Kategorieseiten)" => Hero-Sektion anzeigen (CMS-Listingseiten)

Neue Erweiterung "Quickview" hinzugefügt #FeatureRequest #beta

Teste gerne einmal die neue Theme-Erweiterung "Quickview". Diese ist eine Schnellansicht für Produkte in Produktlistings.

Tab "Weiteres" => Bereich "Beta" => Quickview

Neue Funktion "Dropdown Top-Navigation" hinzugefügt #FeatureRequest #beta

Teste gerne einmal die neue "Dropdown Top-Navigation". Diese ersetzt das Standard-Flyout von Shopware durch kompakte Dropdown-Menüs.

Tab "Weiteres" => Bereich "Beta" => Abschnitt "Dropdown Top-Navigation" => Dropdown Top-Navigation

Neue Funktion "Mengenauswahl in Produkt-Boxen" hinzugefügt #beta

Teste gerne einmal die neue "Mengenauswahl" in Produkt-Boxen. Mit dieser können im Produktlisting mehr als ein Produkt in den Warenkorb gelegt werden.

Tab "Weiteres" => Bereich "Beta" => Mengenauswahl (in Produkt-Boxen)

Neue Funktion "Produktbild-Größenanpassung" hinzugefügt #beta

Teste gerne einmal die neue Funktion "Produktbild-Größenanpassung". Mit dieser Funktion passen sich Produktbilder in mobilen besser an und werden dadurch größer dargestellt.

Tab "Weiteres" => Bereich "Beta" => Abschnitt "Produkt-Box" => Produktbild-Größenanpassung

Neue Funktion "Datenblätter" im Tab "Beschreibung" ergänzt

Du kannst nun "Datenblätter" im Tab "Beschreibung" anzeigen lassen. Die Datenblätter kannst du in Form von PDFs über neue Zusatzfelder im jeweiligen Produkt hinterlegen.

Tab "Produktseiten" => Bereich "Tab "Beschreibung"" => Abschnitt "Datenblätter" => Datenblätter anzeigen

Neue Funktion "Downloads" im Tab "Beschreibung" ergänzt

Du kannst nun "Downloads" im Tab "Beschreibung" anzeigen lassen. Downloads kannst du in Form von PDFs über neue Zusatzfelder im jeweiligen Produkt hinterlegen.

Tab "Produktseiten" => Bereich "Tab "Beschreibung"" => Abschnitt "Downloads" => Downloads anzeigen

Neue Funktion "HTML5-Videos" im Tab "Beschreibung" ergänzt

Du kannst nun "HTML5-Videos" aus der Medienverwaltung im Tab "Beschreibung" anzeigen lassen. Die Videos kannst du mit neuen Zusatzfeldern im jeweiligen Produkt hinterlegen.

Neue Funktion "HTML5-Video" im Tab "Produkt-Videos" ergänzt

Du kannst nun "HTML5-Videos" aus der Medienverwaltung im Tab "Produkt-Videos" anzeigen lassen. Die Videos kannst du mit neuen Zusatzfeldern im jeweiligen Produkt hinterlegen.

Neue Funktion "Kommentar" im Tab "Beschreibung" ergänzt

Du kannst nun einen "Kommentar" im Tab "Beschreibung" anzeigen lassen. Den Kommentar kannst du in einem neuen Zusatzfeld im jeweiligen Produkt hinterlegen.

Tab "Produktseiten" => Bereich "Tab "Beschreibung"" => Abschnitt "Kommentar" => Kommentar anzeigen

Neue Funktion "Weiterführende Links" im Tab "Beschreibung" ergänzt

Du kannst nun "Weiterführende Links" im Tab "Beschreibung" anzeigen lassen. Die Links kannst du über neue Zusatzfelder im jeweiligen Produkt hinterlegen.

Tab "Produktseiten" => Bereich "Tab "Beschreibung"" => Abschnitt "Weiterführende Links" => Weiterführende Links anzeigen

Neue Konfiguration für eine Überschrift der "Kategorie-Navigation" (Sidebar) ergänzt

Eine Konfiguration zum Einblenden einer Überschrift für die "Kategorie-Navigation" in der Sidebar wurde hinzugefügt.

Tab "Erlebniswelten" => Bereich "Kategorie-Navigation (Kategorie "Sidebar")" => Abschnitt "Basiskonfiguration" => "Kategorie-Navigation"-Überschrift anzeigen

Neue Option "Listenansicht" im Listing-Element ergänzt [Pro-Edition] #beta

Teste gerne einmal die neue Option "Listenansicht" im Listing-Element von Shopware. Mit dieser wird das Listing-Layout "Listenansicht" dargestellt.

Neue Produkt-Zusatzfelder für "Datenblätter" hinzugefügt

Du kannst nun "Datenblätter" in Form von PDFs über neue Zusatzfelder im jeweiligen Produkt ergänzen und auf Produktseiten anzeigen lassen.

Neue Produkt-Zusatzfelder für "Downloads" hinzugefügt

Du kannst nun "Downloads" in Form von PDFs über neue Zusatzfelder im jeweiligen Produkt ergänzen und auf Produktseiten anzeigen lassen.

Neue Produkt-Zusatzfelder für "HTML5-Videos" hinzugefügt #FeatureRequest

Du kannst nun "HTML5-Videos" aus der Medienverwaltung über neue Zusatzfelder im jeweiligen Produkt ergänzen und auf Produktseiten anzeigen lassen.

Neue Produkt-Zusatzfelder für "Weiterführende Links" hinzugefügt

Du kannst nun "Weiterführende Links" über neue Zusatzfelder im jeweiligen Produkt ergänzen und auf Produktseiten anzeigen lassen.

Neues Produkt-Zusatzfeld für einen "Kommentar" hinzugefügt

Du kannst nun einen "Kommentar" über ein neues Zusatzfeld im jeweiligen Produkt ergänzen und auf Produktseiten anzeigen lassen.

Neue Kategorie-Zusatzfelder "Spalten pro Zeile" ergänzt

Mit diesem Release kannst du über neue Kategorie-Zusatzfelder die "Spalten pro Zeile" (bzw. Anzahl der Produkte pro Zeile) für die jeweilige Kategorie individuell – also abweichend von der "globalen" Konfiguration – konfigurieren.

Neue Kategorie-Zusatzfelder für die "Hero-Sektion" hinzugefügt

Die neue Theme-Erweiterung "Hero-Sektion" kannst du über Kategorie-Zusatzfeld für die jeweilige Kategorie individuell – also abweichend von der "globalen" Konfiguration – konfigurieren.

Neues Kategorie-Zusatzfeld für die "Unterkategorien im Listing" hinzugefügt

Mit diesem ThemeWare®-Release kannst du über ein neues Kategorie-Zusatzfeld einstellen ob die Theme-Erweiterung "Unterkategorien im Listing" in der jeweiligen Kategorie – als abweichend von der "globalen" Konfiguration – angezeigt werden soll. (Dies betrifft die Theme-Erweiterung – nicht die CMS-Erweiterung.)

---

Änderungen im Detail

Neben den vielen neuen Features gibt es auch einige Verbesserungen in ThemeWare® 3.2.0. Nachfolgend findest du eine Übersicht der Änderungen:

Blur-Effekt für das "Cookie-Hinweis"-Overlay kann konfiguriert werden

Moderne Browser unterstützen einen "Blur"-Effekt für überlagernden Elemente. Diesen Effekt kannst du nun für das Overlay vom "Cookie-Hinweis" konfigurieren.

Tab "Inhalt" => Bereich "Cookie-Hinweis" => Abschnitt "Basiskonfiguration" => Unschärfe-Effekt [px] (Overlay)

Blur-Effekt für das "Vollbildsuche"-Overlay kann konfiguriert werden"

Du kannst nun einen "Blur"-Effekt für das Overlay der "Vollbildsuche" konfigurieren.

Tab "Inhalt" => Bereich "Cookie-Hinweis" => Abschnitt "Basiskonfiguration" => Unschärfe-Effekt [px] (Overlay)

Blur-Effekt für Modal-Overlays kann konfiguriert werden

Du kannst nun einen "Blur"-Effekt für das Overlay von Modals bzw. dem Offcanvas-Warenkorb konfigurieren.

Tab "Layout" => Bereich "Modals" => Abschnitt "Farbkonfiguration" => Unschärfe-Effekt [px] (Overlay)

CSS-"Abstandsklassen" für Spalten- und Grid-Blöcke aktualisiert und korrigiert

Wir haben in diesem Release die CSS-Abstandsklassen für Spalten- und Grid-Blöcke aktualisiert und korrigiert. Dies betrifft die Abstandsklassen .twt-cms-col-padding-* sowie .twt-cms-col-margin-*.

Darstellung der Tabellen auf Produktseiten verbessert

Die Preis- und Eigenschaften-Tabelle haben nun ein verbessertes "Spacing".

Erweiterung "Unterkategorien im Listing" überarbeitet

Die Erweiterung "Unterkategorien im Listing" wurde überarbeitet und verbessert.

Farbkontrast der "Produkt-Badges" verbessert

Der Farbkontrast der "Produkt-Badges" wurde im Hinblick auf die Web Content Accessibility Guidelines (WCAG) verbessert.

Fünf-Spalten-Option für "Listing"-Layouts ergänzt #beta

Teste gerne einmal die neue "Fünf-Spalten"-Option für "Listing"-Layouts. Das Bootstrap-Grid bietet zwar von Haus aus keine 5-Spalten an, wir haben das Grid daher diesbezüglich erweitert.

z.B. Tab "Kategorieseiten" => Bereich "Layout (Layout-Typ "Standard")" => Abschnitt "Spalten pro Zeile" => Desktop (≥1200px)

Fünf-Spalten-Option in der Erweiterung "Unterkategorien im Listing" ergänzt #beta

Teste auch gerne einmal die neue "Fünf-Spalten"-Option in der Erweiterung "Unterkategorien im Listing".

Hover-Effekt "slide up (NEU)" vom "Kaufen-Button" verbessert

Der Hover-Effekt "slide up (NEU)" vom "Kaufen-Button" wurde überarbeitet und verbessert. Der Text "verdeckt" jetzt nicht mehr das Produktbild.

Tab "Kategorieseiten" => Bereich "Produkt-Box" => Abschnitt "Basiskonfiguration" => Hover-Effekt (Kaufen-Button / Details-Button)

Hover-Effekt von Links im "Flyout" der "Top-Navigation" verbessert

Der Hover-Effekt von Links im "Flyout" der "Top-Navigation" wurde überarbeitet und verbessert.

Icon für externe Links im "Flyout" der "Top-Navigation" ergänzt #beta

Ein Icon zur Kennzeichnung von externen Links im "Flyout" der "Top-Navigation" wurde ergänzt.

Tab "Weiteres" => Bereich "Beta" => Abschnitt "Top-Navigation Flyout" => Icon für externe Links anzeigen

Konfiguration der Abstände von "Sidebar-Widgets" erweitert und verbessert

Die Konfiguration der Abstände von "Sidebar-Widgets" wurde erweitert und verbessert. Prüfe die Abstände deiner Widgets nach dem Update einmal und passe die Abstände ggf. an.

Padding vom "Copyright-Footer" in mobilen Viewports verbessert

Das "Padding" vom "Copyright-Footer" in mobilen Viewports verbessert. Der Footer ist nun kompakter.

Tab "Beschreibung" überarbeitet

Der Tab "Beschreibung" wurde überarbeitet. Es wurden diverse Funktionen ergänzt und damit einhergehend viele Template-Änderungen vorgenommen.

Tab "Benutzerdefinierter-Inhalt" überarbeitet

Die Template-Dateien vom Tab "Benutzerdefinierter-Inhalt" wurden überarbeitet und erweitert.

Tab "Produkt-Videos" überarbeitet

Die Template-Dateien vom Tab "Produkt-Videos" wurden überarbeitet und erweitert.

Vorschau einiger CMS-Elemente verbessert [Pro-Edition]

Die Vorschau einiger CMS-Elemente im Erlebniswelt-Editor wurde verbessert.

Bugfix: Ausrichtung der Footer-Headlines in mobilen Viewports verbessert

Die Zentrierung der Footer-Headlines in mobilen Viewports wurde verbessert.

Bugfix: Die Overlay-Farbe vom "Cookie-Hinweis" kann wieder konfiguriert werden

Die Farbkonfiguration vom "Cookie-Hinweis"-Overlay hatte keine Auswirkung. Dies wurde in diesem Update korrigiert.

Bugfix: Eigenschaften-Überschrift und -Infotext im Tab "Beschreibung" korrigiert

Die Darstellung der Eigenschaften-Überschrift und vom Eigenschaften-Infotext im Tab "Beschreibung" wurde korrigiert.

Bugfix: Hintergrundfarbe der Modals korrigiert

Modals haben nun wieder die korrekte Hintergrundfarbe.

---

Hinweise

Im Zuge der Ergänzung von neuen Tabs und der Entwicklung des neuen CMS Elements "Produktbeschreibung und -bewertungen (Accordion)" wurden sämtliche Template-Dateien der von ThemeWare® bereitgestellten Tabs überarbeitet, aufgeräumt und verbessert. Hast du in diesem Bereich individuelle Anpassungen vorgenommen bzw. vornehmen lassen prüfe bitte deine Anpassungen vor dem Update in einem Testsystem.

Zudem wurden die Textbausteine der Tabs auf Produktseiten überarbeitet, vereinheitlicht und geändert:

• Der Textbaustein twt.detail.headlineProperties wurde in zwei separate Textbausteine gesplittet:
  • Headline im Tab "Beschreibung": twt.detail.properties.title
  • Headline im Tab "Eigenschaften": twt.detail.tabProperties.headline
• Es gibt nun einen separaten Textbaustein für die Headline im "Benutzerdefinierten Tab"
  • twt.detail.tabCustom.headline
• Der Textbaustein twt.detail.tabManufacturer.headlineManufacturer wurde durch den Textbaustein twt.detail.tabManufacturer.headline ersetzt.
• Der Textbaustein twt.detail.tabVideos.headlineVideos wurde durch den Textbaustein twt.detail.tabVideos.headline ersetzt.
• Der Textbaustein twt.detail.customFields.productVideos.title wurde durch den Textbaustein twt.detail.productVideos.title ersetzt.

Die Erweiterung "Unterkategorien im Listing" wurde in eine andere Template-Datei verschoben

Die Erweiterung "Unterkategorien im Listing" wurde in eine andere Template-Datei verschoben.

Die Template-Dateien für den "Benutzerdefinierten-Tab" wurden überarbeitet

Der "Benutzerdefinierte-Inhalt" wurde aus der Datei twt-product-detail-tab-custom.html.twig in die neue Datei includes/twt-product-custom-content.html.twig verschoben.

Die Template-Dateien für den "Video-Tab" wurden überarbeitet

Die Template-Dateien für den "Video-Tab" wurden überarbeitet. Es wurden diverse Funktionen ergänzt und damit einhergehend viele Template-Änderungen vorgenommen.

Die "Volbildsuche" hat eine neue Konfiguration für die Hintergrundfarbe des Overlays

Prüfe bitte die Konfiguration der Hintergrundfarbe vom Overlay der Volbildsuche (Tab "Header" -> Bereich "Suche"). Es gibt nun eine neue Konfiguration . Die alte Konfiguration findest du, zum Vergleich, noch ein paar Wochen lang im Tab "Weiteres" -> Bereich "Veraltet".

Modals haben eine neue Konfiguration für die Hintergrundfarbe des Overlays

Prüfe bitte die Konfiguration der Hintergrundfarbe von Modal-Overlays (Tab "Layout" -> Bereich "Modal"). Es gibt nun eine neue Konfiguration . Die alte Konfiguration findest du, zum Vergleich, noch ein paar Wochen lang im Tab "Weiteres" -> Bereich "Veraltet".

---

Soweit zu den Änderungen in ThemeWare® 3.2 für Shopware 6.6.

Viele Grüße, Sebastian und das Team von ThemeWare®