Bevor du mit unseren Anleitungen startest empfehlen wir dir einen Blick in unser Video-Tutorial und das Einführung. Dort erfährst alle wichtigen Grundlagen welche dir bei den Anleitungen sehr weiterhelfen.

Ergänzend dazu empfehlen wir dir unbedingt einen Blick in die offizielle Shopware Dokumentation denn viele Sachen die du in den Anleitungen konfigurieren betreffen einige Shopware Grundfunktionen:

Vorab möchten wir darauf hinweisen, dass erworbene Erweiterungen automatisch in der Erweiterungs-Verwaltung erscheinen. Ein manueller Upload ist daher nicht nötig.

Der manuelle Upload von Erweiterungen ist auf zwei Wegen möglich:

• Upload über die (empfohlen)

Die ThemeWare® Mietversion enthält einen kostenlosen Probemonat. Die Miete kann jederzeit monatlich gekündigt werden oder wird zu den bei der Buchung angegebenen Preisen automatisch verlängert.

1. Öffne die Administration deines Shops

2. Wechsel über die Hauptnavigation in den "Store" (1) (2) ("Erweiterungen" => "Store")

Generell ist es beim Erwerb von Erweiterungen (Apps, Plugins oder Theme) im Shopware Store zunächst immer sinnvoll, diese vorab als "Testversion" in Form eines kostenlosen Probemonats zu installieren. So kannst du die entsprechende Erweiterung 30 Tage kostenfrei testen und sicher gehen, dass diese auch seine Erwartungen erfüllt.

Sollte es trotz dessen versehentlich zu einem "Fehlkauf" einer Erweiterung gekommen sein, melde dich bitte einmal über das folgende Kontaktformular beim Shopware-Vertrieb:

1. Öffne die Administration deines Shops

2. Wechsel über die Hauptnavigation in die "Erweiterungs-Verwaltung" (1) (2) ("Erweiterungen" => "Meine Erweiterungen")

Wie du die Startseite deines Themes erstellen kannst, erfährst du in folgendem Artikel:

Wie wir die Kategorie "Höhenluft & Abenteuer" in unseren Demoshops erstellt haben findest du in folgender Schritt-für-Schritt-Anleitung:

Wie wir die Kategorie "Kochlust & Provence" in unseren Demoshops erstellt haben findest du in folgender Schritt-für-Schritt-Anleitung:

Wie wir die Kategorie "Handwerk & Tradition" in unseren Demoshops erstellt haben findest du in folgender Schritt-für-Schritt-Anleitung:

Erlebniswelten sind eine Grundfunktion von Shopware 6 und ersetzen die Einkaufswelten aus Shopware 5. Mit Erlebniswelten kannst du Content-Seiten wie Landingpages, Shopseiten, Kategorieseiten und Produktseiten erstellen und gestalten.

In diesem Bereich findest du viele nützliche Anleitungen rund um das Thema Erlebniswelten.

Mehr Grundlagen und Informationen zum Thema Erlebniswelten findet du hier:

In Shopware 6 können CMS-Blöcke sowie CMS-Sektionen in verschiedenen Viewports ausgeblendet werden.

Wie dies funktioniert erfährst du in folgenden Anleitungen:

Ab Shopware 6.4.19.0 kannst du CMS-Blöcke als Favoriten markieren.

Klicke dazu einfach auf das Herzsymbol . Filtere im Dropdown-Menü nach Favoriten, um direkt die Blöcke zu finden, die du oft benutzt.

Ab Shopware 6.4.19.0 kannst du CMS-Elemente als Favoriten markieren.

Klicke dazu einfach auf das Herzsymbol . Deine Favoriten findest du nun immer oben im "Element austauschen"-Overlay.

Der Erste Schritt bei Problemen oder vermeintlichen Fehlern ist immer ein Blick in den Bereich "Häufige Fehler". Dort findest du sowohl für die Storefront als auch für die Administration Lösungen für die häufigsten, bekannten Probleme und Fehler.

Durch unsere über 3.000 Kunden haben wir fast jedes Problem schon gesehen und gelöst. Es ist daher sehr wahrscheinlich, dass das Problem bereits bekannt ist und es bereits eine Lösung gibt.

Schaue also immer zuerst einmal in den Bereich "Häufige Fehler":

Für Darstellungsfehler in der Storefront ist in den allermeisten Fällen ein veralteter Cache die Ursache. Auch ein nicht korrekt kompiliertes Theme kann zu Darstellungsfehlern führen.

Aktualisiere daher, bei Problemen oder Darstellungsfehlern, bitte immer zuerst einmal die Shopware Storefront. Dies geht ganz einfach und schnell mit wenigen Klicks:

Bevor du ein Problem meldest, kannst du ganz einfach selber überprüfen, ob deine individuelle Konfiguration einen Fehler hat.

Nutze dafür einfach die "Validieren"-Funktion von Shopware.

Dies ist beispielsweise Sinnvoll wenn du eine Fehlermeldung wie Ungültige Konfiguration – Die Konfiguration ist fehlerhaft. Das Theme kann nicht gespeichert werden., erhältst bzw. das Theme nicht gespeichert werden konnte.

Um deine Konfiguration zu validieren öffne die Theme-Konfiguration und klicke auf den Pfeil neben dem Speichern-Button. Dort hast du die Option "Validieren".

Die Validierung sollte dir einen Hinweis geben, welcher Wert nicht stimmt.

In der ThemeWare® Plugin-Konfiguration (nicht Theme-Konfiguration) hast du die Möglichkeit den ThemeWare® "Debug-Modus" zu aktivieren.

Ist der "Debug-Modus" aktiv, werden beispielsweise die "Experten-Einstellungen" nicht mehr berücksichtigt.

Hast du Fehler in deinem Shop, aktiviere einmal den "Debug-Modus", leere den Shopware- sowie deinen Browser-Cache und prüfe dann die Storefront erneut.

So kannst du, mit einem Klick, prüfen ob es Probleme mit deinen "Experten-Einstellungen" gibt.

Deaktiviere den "Debug-Modus" wenn du mit der Fehlerbehebung fertig bist wieder.

In diesem Bereich findest du viele nützliche Anleitungen rund um das Thema Fonts bzw. Schriften.

Bevor du mit der Schrift-Konfiguration startest empfehlen wir dir einen Blick in unser Video-Tutorial. Im Video "" erklären wir dir wichtige Grundlagen.

Mehr Informationen zum Thema "Schriftkonfiguration" findest du in der ThemeWare® Einführung: und im Artikel: .

In diesem Bereich findest du nützliche Anleitungen rund um das Thema "Kategorien".

Bevor du mit der Bearbeitung deiner Kategorien bzw. Kategorie-Layouts startest empfehlen wir dir einen Blick in unser Video-Tutorial. Im Video "" erklären wir dir wichtige Grundlagen welche dir beim Erstellen und Bearbeiten sehr weiterhelfen.

Ergänzend dazu empfehlen wir dir einen Blick in die offizielle Shopware Dokumentation:

Wie wir die Kategorie "Handwerk & Tradition" in unseren Demoshops erstellt haben findest du in folgender Schritt-für-Schritt-Anleitung:

Wie wir die Kategorie "Höhenluft & Abenteuer" in unseren Demoshops erstellt haben findest du in folgender Schritt-für-Schritt-Anleitung:

Wie du Produkt-Boxen in Produkt-Listings oder Slidern kompakter gestalten können, erfährst du im folgenden Artikel:

Bevor du ein Problem meldest, kannst du ganz einfach selber überprüfen, ob eine bestimmte Erweiterung (Plugin oder App) für das Problem verantwortlich ist.

Erweiterungen deaktivieren

Deaktiviere (nicht deinstalliere!) einmal alle verwendeten Erweiterung (Plugins oder Apps). Besteht das Problem nach Deaktivierung aller Erweiterungen nicht mehr, liegt das Problem wahrscheinlich an einer Erweiterung.

Weiterführende Informationen

Bevor du ein Problem meldest, kannst du ganz einfach selber überprüfen, ob eine individuelle Anpassung, eine bestimmte Erweiterung (Plugin oder App) oder das Theme für das Problem verantwortlich ist.

Prüfe ob das Problem vom Theme verursacht wird

Um zu prüfen ob der Fehler bzw. das Problem überhaupt beim Theme liegt, nutze bitte den folgenden Artikel:

Prüfe ob eine individuelle Anpassung den Fehler verursacht

Um zu prüfen ob der Fehler bzw. das Problem durch eine individuelle Anpassung verursacht wird, nutze bitte den folgenden Artikel:

Prüfe ob eine Erweiterung den Fehler verursacht

Um zu prüfen ob der Fehler bzw. das Problem durch eine bestimmte Erweiterung (Plugin oder App) verursacht wird, nutze bitte den folgenden Artikel:

Du kannst die CSS-Hierarchie beim Überschreiben von CSS/SCSS-Anweisungen ganz einfach mit der "Body-Klasse" in der ThemeWare® Konfiguration beeinflussen. Dadurch kannst du unschöne !important Anweisungen vermeiden.

• Body-Klasse: Tab "Weiteres" => Bereich "Experten-Einstellungen" => Abschnitt "Individuelle CSS-Klasse"

Trage hier beispielsweise "meinshop" ein und stelle dies an den Anfang des entsprechenden CSS/SCSS-Selektors.

CSS

// Vorher
.product-detail-ordernumber-container .product-detail-ordernumber-label {
    font-weight: 300 !important; 
}

// Besser
.meinshop .product-detail-ordernumber-container .product-detail-ordernumber-label {
    font-weight: 300; 
}

SCSS

Die ThemeWare® Mietversion enthält einen kostenlosen Probemonat. Die Miete kann jederzeit monatlich gekündigt werden oder wird zu den bei der Buchung angegebenen Preisen automatisch verlängert.

1. Öffne die Administration deines Shops

2. Wechsel über die Hauptnavigation in den "Store" (1) (2) ("Erweiterungen" => "Store")

3. Wechsel in den Tab "Themes" (3)

4. Optional: Gebe "ThemeWare" oder z.B. "Outdoor" in der Suche ein

5. Klicke nun in der Übersicht auf das gewünschte ThemeWare® Theme

6. Es öffnet sich nun die Detailseite des ThemeWare® Themes

7. Klicke auf den Button "Theme hinzufügen" (4)

8. Es öffnet sich nun ein Pop-up

9. Hier findest du alle Details zu den Kosten nach Ablauf des Probemonats (5)

10. Lese und akzeptiere die AGB (6)

11. Und bestätige die Buchung jetzt mit "Miete jetzt diese Erweiterung" (7)

Du hast ThemeWare® nun gemietet.

1. Öffne die Administration deines Shops

2. Wechsel über die Hauptnavigation in die "Erweiterungs-Verwaltung" (1) (2) ("Erweiterungen" => "Meine Erweiterungen")

3. Wechsel in den Tab "Themes" (3)

4. ThemeWare® wird nun in der Übersicht angezeigt

5. Installiere die Erweiterung nun über die Option "Installieren" (5)

ThemeWare® wurde nun installiert.

1. Öffne die Administration deines Shops

2. Wechsel über die Hauptnavigation in die "Erweiterungs-Verwaltung" (1) (2) ("Erweiterungen" => "Meine Erweiterungen")

3. Wechsel in den Tab "Themes" (3)

4. Aktiviere ThemeWare® über dem Switch-Button (4) links neben dem ThemeWare® Logo

5. Leere den gesamten Shopware-Cache und lade die Administration neu

ThemeWare® wurde nun aktiviert.

1. Öffne die Administration deines Shops

2. Wechsel über die Hauptnavigation in die "Theme-Verwaltung" (1) (2) ("Inhalte" => "Themes")

   • Hinweis: In der Shopware Cloud findest du den Bereich "Themes" direkt in der Hauptnavigation.

3. Klicke nun auf dein ThemeWare® Theme um die Theme-Konfiguration zu öffnen

4. Scrolle im Tab "Allgemein" zum Abschnitt mit der Zuweisung deines Themes

5. Klicke auf den Kontext-Button (3) oben rechts um ein Kontextmenü zu öffnen

6. Wähle die Option "Theme zurücksetzen" (4) aus

7. Es erscheint ein Pop-up "Theme zurücksetzen"

8. Setze die Theme-Konfiguration mit dem Button "Theme zurücksetzen" (5) zurück

Erfahrene Anwender können die Konfiguration manuell über die Datenbank zurücksetzen. Eine Anleitung dazu findest du im folgenden Artikel:

Mit ThemeWare® profitierst du von einer kontinuierlichen Weiterentwicklung. Von Zeit zu Zeit kann es daher vorkommen, dass wir Konfigurationsfelder entfernen oder ersetzen.

Verbleiben "verwaiste Konfigurationsfelder" in der Konfiguration kannst du diese wie folgt entfernen:

1. Öffne die Administration deines Shops

2. Wechsel über die Hauptnavigation in die "Theme-Verwaltung" (1) (2) ("Inhalte" => "Themes")

   • Hinweis: In der Shopware Cloud findest du den Bereich "Themes" direkt in der Hauptnavigation.

3. Klicke nun auf dein ThemeWare® Theme um die Bearbeitung zu beginnen

4. Klicke auf das Dropdown-Icon am "Speichern"-Button

5. Speicher deine Konfiguration mit der Option "Bereinigen" (4)

ThemeWare® wurde nun bereinigt.

1. Öffne die Administration deines Shops

2. Wechsel über die Hauptnavigation in die "Erweiterungs-Verwaltung" (1) (2) ("Erweiterungen" => "Meine Erweiterungen")

3. Wechsel in den Tab "Themes" (3)

4. Deaktiviere ThemeWare® über den Switch-Button (4) links neben dem ThemeWare® Logo

   • ℹ️ Hinweis: Damit du ein Theme deaktivieren kannst, darf dieses keinem Verkaufskanal mehr zugewiesen sein!

5. Leere den gesamten Shopware-Cache und lade die Administration neu

ThemeWare® wurde nun deaktiviert.

1. Öffne die Administration deines Shops

2. Wechsel über die Hauptnavigation in die "Erweiterungs-Verwaltung" (1) (2) ("Erweiterungen" => "Meine Erweiterungen")

3. Wechsel in den Tab "Themes" (3)

4. Klicke auf den Kontext-Button (4) neben dem Theme um das Kontextmenü zu öffnen und darin auf "Entfernen" (5)

5. Melde dich im Tab "Shopware Account" mit deinen Account-Zugangsdaten an, damit die Löschung der Erweiterung im gesamten System aktualisiert wird.

Erweiterungen mit gültigen Lizenzen werden auch nach dem "Löschen" in der Erweiterungs-Verwaltung angezeigt, da der entsprechende Account nach wie vor im Besitz dieser Lizenz ist. Die Lizenz selber kannst du in deinem Shopware-Account endgültig entfernen/archivieren:

• Wechsle in deinen Shopware Account unter und kündige dort die Miete. Ohne diese Kündigung wird der Mietvertrag weiter berechnet.

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.

CSS-Klasse einem CMS-Block hinzufügen

1. Klicke auf den gewünschten CMS-Block um den CMS-Block auszuwählen (1)

2. Wechsel rechts in der Sidebar in den Tab "Block-Einstellungen" (2)

3. Öffne dort den Abschnitt "Layout" (3)

4. Trage im Konfigurationsfeld "CSS-Klassen" deine eigene CSS-Klasse ein (4)

   • Tipp: Trenne mehrere Klassen mit einem Leerzeichen.

5. Speichere die Änderungen deiner Erlebniswelt

Nach dem Neuladen der Storefront sollte dein Styling nun auf den CMS-Block angewendet werden.

Wie du CSS-Styles hinzufügen kannst erfährst du in folgender Anleitung:

Die Shopware 6 Storefront basiert auf dem Bootstrap-Framework. Aufgrund unserer HC-Architecture® ist ThemeWare® selbstverständlich ebenfalls vollständig kompatibel mit Bootstrap.

Auf dieser Seite findest du die gängigsten Bootstrap-Elemente welche du in deinen Erlebniswelten nutzen kannst.

Shopware 6.4

In Shopware 6.4 nutzt die Storefront Bootstrap 4.

Shopware 6.5

In Shopware 6.5 nutzt die Storefront Bootstrap 5.

Bitte beachte, dass der HTML-Editor von Shopware 6 (z.B. in CMS-Elementen) individuellen HTML-Code – aus Sicherheitsgründen – nicht alle HTML-Tags erlaubt und den Code automatisch bereinigt. Das bedeutet nicht, dass Shopware bzw. ThemeWare® nicht kompatibel mit Bootstrap ist. Alles was du auf dieser Seite findest kann mit dem HTML-Editor von Shopware umgesetzt werden. Dafür wurde der eigentlich Bootstrap-Code ggf. leicht modifiziert.

In Template-Dateien kannst du Bootstrap entsprechend der Bootstrap-Dokumentation nutzen. Hier gibt es lediglich die Einschränkung das Shopware ggf. nicht alle Bootstrap-Elemente bereitstellt.

Im Bereich Erlebniswelten gibt es spezielle CMS-Elemente im Shopware Store, welche alternative HTML-Editoren bereitstellen und dir damit mehr Freiheiten bieten als der HTML-Editor von Shopware 6.

Folgt bald...

Wir haben es uns zur Aufgabe gemacht mit ThemeWare® das beste Erlebnis für dich und deine Kunden zu bieten. Wie du an unseren über 380 Bewertungen sehen kannst, liegt uns viel daran, einen großartigen Support zu leisten.

Durch unsere über 3.000 Kunden haben wir fast jedes Problem schon unzählige Male gesehen und gelöst. Bitte vertraue uns, sowie diesem Prozess und folge Schritt für Schritt der Anleitung.

Über 95% aller "Probleme" werden nicht durch ThemeWare® ausgelöst. Es ist sehr wahrscheinlich, dass du das Problem mit Hilfe dieses Prozesses selber lösen kannst und nicht erst auf eine Antwort von uns warten musst.

Mögliche Ursachen:

• das Problem resultiert aus einer veralteten Storefront

• das Problem besteht bereits im Shopware Standard-Theme (bzw. Shopware default theme)

• das Problem entsteht durch (eine) individuelle Anpassung(en)

• das Problem wird durch (eine) Erweiterung(en) Dritter verursacht

All dies kann mit unseren Prozess geprüft werden und falls du das Problem doch nicht selber lösen kannst, eröffnest du im Laufe dieses Prozesses automatisch ein Support-Ticket. Es ist aber unbedingt notwendig, dass du die Schritte genau befolgst. Nur so können wir unseren exzellenten Support leisten, den alle so sehr lieben.

Bitte starte die Fehlerbehebung jetzt unter:

Wenn Shopware im Produktivmodus betrieben wird, werden i.d.R. nur allgemeine Meldungen wie "Theme konnte dem Verkaufskanal nicht zugewiesen werden" ausgegeben. Anhand dieser allgemeinen Meldungen ist es leider nicht möglich, die Ursache des Fehlers genauer zu identifizieren.

Der erste Schritt bei Fehlermeldungen in der Administration sollte sein, eine detailliertere Fehlermeldung zu erhalten.

Detailliertere Fehlermeldung erhalten

Um eine detailliertere Fehlermeldungen zu erhalten nutze eine oder beide der folgenden Optionen:

• Prüfe deinen PHP-Error-Log auf weitere Informationen.

  • Falls du nicht weißt, wie du den Wert ändern kannst, ist dir dein Hoster sicherlich gerne behilflich.

• Versetze Shopware (temporär) in den Debugmodus.

  • Eine Anleitung findest du in der .

Bevor du ein Problem meldest, kannst du ganz einfach selber überprüfen, ob dein Theme für das Problem verantwortlich sein kann.

Shopware Standard-Theme zuweisen

Weise einmal das "Shopware Standard-Theme" (bzw. Shopware default theme) deiner Storefront zu. Besteht das Problem auch im Standard-Theme, ist zu 99,9% davon auszugehen, dass ThemeWare® nicht der Verursacher ist.

Weiterführende Informationen

Wie du das Shopware Standard-Theme (bzw. Shopware default theme) zuweisen und prüfen kannst, erfährst du in folgendem Artikel:

Mit ThemeWare® hebst du eine einzelne Kategorie in der Top-Navigation farbig hervor – zum Beispiel deine Sale-, Neuheiten- oder Aktions-Kategorie. So lenkst du die Aufmerksamkeit deiner Kunden gezielt auf den Menüpunkt, der dir besonders wichtig ist.

Voraussetzungen

• eine Kategorie, die du in der Top-Navigation hervorheben möchtest

• die Darstellungsart "Top-Navigation" im Header (die Hervorhebung gilt nicht für den "Einstiegspunkt für die Haupt-Navigation")

Schritt 1: Aussehen der Hervorhebung festlegen

"Theme-Manager" => dein ThemeWare®-Theme => Tab "Header" => Bereich "Top-Navigation" => Abschnitt "Menüpunkt (hervorgehoben)"

Lege hier fest, wie ein hervorgehobener Menüpunkt aussehen soll – etwa über die "Textfarbe (hervorgehoben)", "Hintergrundfarbe (hervorgehoben)" und "Iconfarbe (hervorgehoben)" (jeweils auch für den @hover- und @active-Zustand). Speichere deine Änderungen.

"Kataloge" => "Kategorien" => Kategorie wählen => "Zusatzfelder"

Setze im Zusatzfeld "Kategorie hervorheben" die Option auf "ja" und speichere die Kategorie.

Die gewählte Kategorie erscheint nun im gewählten Look in der Top-Navigation. Wird die Hervorhebung nicht angezeigt, leere einmal den Shopware-Cache.

Alle Konfigurationsmöglichkeiten und das Zusatzfeld im Detail findest du im ThemeWare® Handbuch:

In diesem Bereich findest du viele nützliche Anleitungen rund um das Thema "individuelle Anpassungen".

Individuelle Anpassungen sind individuelle Programmierungen (= individueller Code) die über den Rahmen der von ThemeWare® bereitgestellten Funktionen und CSS-Klassen hinaus gehen. Dazu gehören beispielsweise:

• CSS-Anpassungen

  • Also das Schreiben und/oder Hinzufügen von individuellen CSS-/SCSS-Code

  • z.B. .my-shop { color: red; }

• JavaScript-Anpassungen

  • Das Schreiben und/oder Hinzufügen von individuellem JavaScript-Code

  • z.B. <script src="myScript.js">

• Template-Anpassungen

  • Das Schreiben und/oder Hinzufügen von individuellen HTML-/Twig-Code

ThemeWare® bietet dir mit den Anleitungen in diesem Bereich, der Experten-Konfiguration oder dem kostenfreien Customizing-Plugin verschiedene Möglichkeiten eigenen Code in der Storefront zu ergänzen. Dies richtet sich in erster Linie an Profis und Experten, die genau wissen, was Sie tun, denn durch individuellen Code können diverse Problem in der Storefront entstehen oder potentielle Schwachstellen aufgemacht werden!

Wenn du dir nicht absolut sicher bist, kannst du über das ThemeWare® Service-Portal Unterstützung bei der Erstellung deiner gewünschten Anpassung anfragen:

In diesem Artikel erfährst du, wie du Bootstrap in der Shopware 6 Storefront nutzen kannst.

Es gibt verschiedene Bestandteile von Bootstrap welch du in der Storefront von Shopware 6 nutzen kannst:

• CSS-Klassen

• HTML-Elemente

CSS-Klassen

...

Mit HTML-Elementen sind wir im Bereich "individuelle Anpassung", da es hierbei um die individuelle Programmierung bzw. um individuellen Code geht.

...

Darüber hinaus gibt es verschiedene Möglichkeiten diese Bestandteile einzubinden:

• Erlebniswelten

• Template-Dateien

...

...

Folgt bald...

Die Theme-Konfiguration von ThemeWare® kannst du über zwei Wege erreichen:

1. Über die (empfohlen)

2. Über den entsprechenden

Nachfolgend zeigen wir dir beide Wege im Detail.

1. Öffne die Administration deines Shops

2. Wechsel über die Hauptnavigation in die "Erweiterungs-Verwaltung" (1) (2) ("Erweiterungen" => "Meine Erweiterungen")

1. Öffne die Administration deines Shops

2. Wechsel über die Hauptnavigation in die "Erweiterungs-Verwaltung" (1) (2) ("Erweiterungen" => "Meine Erweiterungen")

Du kannst ein bestimmtes CMS-Element individuell stylen, indem du ihm in den Element-Einstellungen eine eigene CSS-Klasse zuweist und die gewünschten Styles in deiner CSS-Datei oder der Theme-Konfiguration definierst.

Darüber hinaus kannst du auch die automatisch generierte nutzen – insbesondere bei CMS-Elementen, denen du keine eigene CSS-Klasse zuweisen kannst.

1. Klicke auf den entsprechenden CMS-Block um den Bearbeitungsmodus zu aktivieren

2. Fahre mit der Maus über das gewünschte CMS-Element (1)

ThemeWare® stellt dir eine umfangreiche Auswahl an CSS-Animationen zum Verschönern deiner Erlebniswelten bereit. Nachfolgend erklären wir dir, wie du die "CSS-Scroll-Animationen" in nur 2 Schritten aktivieren und nutzen kannst.

1. Öffne die Administration deins Shops

2. Wechsel über die Hauptnavigation in den Theme-Manager ("Inhalte" => "Themes")

ThemeWare® stellt dir individuelle CSS-Headline-Klassen zur Verfügung mit welchen du, die aus unseren Shopware 5 Themes bekannten Überschriften, auch für deine Shopware 6 Erlebniswelten erstellen kannst.

Diese CSS-Klassen stehen dir zur Verfügung, wenn du die folgende Theme-Konfiguration aktivierst:

• Tab "Weiteres" => Bereich "Erweiterte Einstellungen" => Abschnitt "Zusätzliche CSS-Klassen" => CSS-Klassen für Überschriften laden (optional)

Um zu prüfen ob ein Fehler oder Problem durch eine bestimmte Erweiterung (Plugin oder App) verursacht wird, folge bitte den nachfolgenden Schritten:

1. Erweiterungen deaktivieren (nicht deinstallieren!)

2. Shopware Cache leeren

Um invalide Konfigurationsfelder zu korrigieren, folge bitte der folgenden Anleitung.

Hintergrundwissen

Kannst du deine Konfiguration nicht speichern und/oder erhältst beim Speichern einen entsprechenden Hinweis (z.B. "Ungültige Konfiguration"), liegt das in der Regel an einem falsch befüllten Konfigurationsfeld.

Bei einem Fehler gibt es die beiden folgenden Möglichkeiten:

1. Du hast vor dem Speichern ein Feld falsch befüllt.

Um auszuschließen, dass etwaige Probleme bereits mit einem Update behoben wurden ist es sinnvoll Shopware, alle Erweiterungen (Apps bzw. Plugins) und ThemeWare® selber auf die jeweils neuste Version zu aktualisieren.

1. Shopware auf die neuste Version aktualisieren:

   1. Navigiere über die Hauptnavigation zum "Shopware-Updater" ("Einstellungen" => "System" => "Shopware-Update")

Um zu prüfen ob ein Fehler oder Problem überhaupt im Zusammenhang mit ThemeWare® stehen könnte, reicht es das Shopware Standard-Theme (bzw. Shopware default theme) deinem Verkaufskanal zuzuweisen. Folge dazu einfach der folgenden Anleitung:

1. Shopware Standard-Theme zuweisen (bzw. Shopware default theme zuweisen)

2. Shopware Cache leeren

ThemeWare® bietet dir die Möglichkeit Google Fonts automatisiert zu importieren.

1. Suche dir einen gewünschten aus

2. Klicke neben einem Style des Fonts auf den Button "+ Select this style" (1)

In diesem Artikel zeigen wir dir, wie du einfach prüfen kannst ob dein Shop Google Fonts importiert oder Fonts von deinem Server lädt.

1. Rufe die Entwicklerkonsole in deinem Browser auf:

   1. Windows: Strg +Umschalt +J

Im sogenannten ThemeWare® Erlebniswelt-Header überlagert der Header die Erlebniswelt auf der Startseite oder auf ausgewählten Kategorieseiten. Dies ist ein konfigurierbarer Effekt um einen bestimmten Look in ThemeWare® zu ermöglichen.

In Themes wie , oder ist der "Erlebniswelt-Header" bereits konfiguriert. Den entsprechenden Look kannst du dir in den entsprechenden Demoshops anschauen:

Mit ThemeWare® stattest du deine Kategorieseiten mit einer großen "Hero-Sektion" aus – einem einladenden Kopfbereich mit Kategorie-Name, Hintergrundbild und optionaler Breadcrumb. So gibst du deinen Kategorien ein hochwertiges Gesicht, stärkst deine Marke und führst deine Kunden gezielt ins Sortiment.

• eine Kategorie, die du mit einer "Hero-Sektion" versehen möchtest

• optional ein Hintergrundbild (empfohlene Bildgröße: 1920 x 1080 Pixel)

Wie wir die Kategorie "Kochlust & Provence" in unseren Demoshops erstellt haben findest du in folgender Schritt-für-Schritt-Anleitung:

Ab Shopware 6.4.19.0 kannst du die Sichtbarkeit von Sektionen und Blöcken ganz einfach im Erlebniswelt-Editor einstellen.

1. Erlebniswelt bearbeiten

1. Wechsel über die Hauptnavigation in die Erlebniswelt-Verwaltung ("Inhalte" => "Erlebniswelten")

2. Klicke auf die gewünschte Erlebniswelt um diese zu bearbeiten

3. Die Erlebniswelt öffnet sich nun im Erlebniswelt-Editor

1. Klicke auf den Button oben links in der CMS-Sektion die du bearbeiten möchtest (1)

2. Die Sektion-Einstellungen öffnen sich rechts im Fenster (2)

3. Öffne den Abschnitt "Sichtbarkeit" (3)

1. Klicke auf CMS-Block den du bearbeiten möchtest (1)

2. Die Block-Einstellungen öffnen sich rechts im Fenster (2)

3. Öffne den Abschnitt "Sichtbarkeit" (3)

Im Abschnitt "Sichtbarkeit" (3) kannst du die Sektion bzw. den Block nun für drei Viewports konfigurieren (4).

Im Editor werden unsichtbare CMS-Sektionen bzw. CMS-Blöcke "eingeklappt".

• Mit einem Klick auf den Link "Sektion einklappen" bzw. "Sektion ausklappen" (5) kannst du eine unsichtbare CMS-Sektion ein-/ausklappen um sie zu bearbeiten.

• Mit einem Klick auf den Link "Block einklappen" bzw. "Block ausklappen" (5) kannst du einen unsichtbaren CMS-Block ein-/ausklappen um ihn zu bearbeiten.

Mit ThemeWare® erweiterst du das Flyout deiner Hauptnavigation um bis zu drei Teaser mit Bild, Text und Link. So hebst du im Mega-Menü Aktionen, Themenwelten oder Top-Produkte hervor und führst deine Kunden direkt aus der Navigation zum passenden Ziel.

Voraussetzungen

• eine Kategorie in der Hauptnavigation, deren Flyout du mit Teasern erweitern möchtest

• ein bis drei Bilder für die Teaser im Shopware-Medienmanager

• optional die Zieladressen (Links) für die Teaser

"Theme-Manager" => dein ThemeWare®-Theme => Tab "Header" => Bereich "Top-Navigation Flyout"

Das Feld "Top-Navigation Flyout" bietet mehrere Darstellungen für die Untermenüs (siehe Abschnitt „Weitere Flyout-Modi" unten). Für die Teaser wählst du "ThemeWare® Flyout mit Teasern" und speicherst deine Änderungen.

"Kataloge" => "Kategorien" => Kategorie wählen => Tab "Allgemein" => Bereich "Zusatzfelder" => Zusatzfeld-Set "Flyout (... Pro)"

Pflege je Teaser die folgenden Zusatzfelder (bis zu 3 Teaser stehen zur Verfügung):

• Flyout-Teaser 1–3 – Bild – das Teaserbild aus dem Medienmanager

• Flyout-Teaser 1–3 – Text – der Text unter dem Bild

• Flyout-Teaser 1–3 – Link – die Ziel-URL; der gesamte Teaser ist klickbar

Speichere die Kategorie.

Öffnest du das Flyout der Kategorie in der Hauptnavigation, erscheinen die Teaser nun neben den Unterkategorien. Wird nichts angezeigt, leere einmal den Shopware-Cache.

Über das Feld "Top-Navigation Flyout" bestimmst du generell, wie die Untermenüs deiner Hauptnavigation dargestellt werden – die Teaser sind nur einer von mehreren Modi:

• Shopware-Standard – die native Shopware-Navigation (ohne ThemeWare®-Flyout)

• ThemeWare® Flyout – das Standard-Flyout mit den Unterkategorien

• ThemeWare® Dropdown – die Untermenüs als kompaktes Dropdown

Alle Flyout-Modi mit Beispielbildern findest du im ThemeWare® Handbuch:

Die Teaser-Zusatzfelder im Detail:

Mit ThemeWare® blendest du im Produktlisting ein zweites Produktbild ein, sobald deine Kunden mit der Maus über eine Produktkachel fahren. So zeigst du z.B. die Rückseite, ein Detail oder das Produkt im Einsatz – ganz ohne die Produktseite zu öffnen.

Voraussetzungen

• ein Produkt, dem du ein zweites Bild zuordnen möchtest

• ein passendes Bild für den Hover-Effekt im Shopware-Medienmanager

Schritt 1: Hover-Effekt im Theme aktivieren

"Theme-Manager" => dein ThemeWare®-Theme => Tab "Kategorieseiten" => Bereich "Produkt-Box" => Abschnitt "Produktbild"

Stelle die Konfiguration "Hover-Effekt" auf "Bilder überblenden (Zusatzfeld)" und speichere deine Änderungen.

"Kataloge" => "Produkte" => Produkt wählen => Tab "Spezifikationen" => Bereich "Zusatzfelder" => Zusatzfeld-Set deines Themes

Wähle im Zusatzfeld "Hover-Bild" das gewünschte Bild aus dem Medienmanager und speichere das Produkt.

Fahren deine Kunden im Listing über die Produktkachel, wird das Cover-Bild sanft durch das Hover-Bild ausgetauscht. Wird nichts angezeigt, leere einmal den Shopware-Cache.

Alle Details zum Zusatzfeld findest du im ThemeWare® Handbuch:

In dieser Anleitung erfährst du, wie du eine Kategorie-Seite anlegen kannst.

Kategorie anlegen

1. Wechsel über die Hauptnavigation in die "Kategorie-Verwaltung" (1) (2) deines Shops ("Kataloge" => "Kategorien")

2. Wähle die gewünschte Kategorie aus in welcher die neue Kategorie erscheinen soll

3. Klicke auf den Kontext-Button (3) um das Kontextmenü zu öffnen und eine neue Kategorie anzulegen

4. Wähle ob die neue Kategorie vor, nach oder als Subkategorie innerhalb der ausgewählten Kategorie erstellt werden soll (4)

5. Benne die Seite (5) und lege die Seite an (6)

6. Nun kannst du die Kategorie-Seite bearbeiten

7. Aktiviere die Seite damit Sie auch in der Storefront angezeigt wird (7)

Du hast nun eine Kategorie erstellt.

Weitere Informationen zu Kategorien in Shopware 6 findest du in der Shopware Dokumentation:

Die Theme-Konfiguration von ThemeWare® kannst du über zwei Wege erreichen:

1. Über den entsprechenden (empfohlen)

2. Über die

Nachfolgend zeigen wir dir beide Wege im Detail.

Wir freuen uns immer über eine ehrliche Bewertung. Die Bewertung muss auch gar nicht lang sein, 1-2 Sätze reichen.

Es gibt zwei Möglichkeiten wie du ThemeWare® bewerten kannst:

1. Über deinen (empfohlen)

2. Über deine

ThemeWare® bietet dir diverse Gap-Klassen für CMS-Blöcke. In dieser Anleitung stellen wir dir diese CSS-Klassen vor.

Diese CSS-Klassen stehen dir zur Verfügung, wenn du die folgende Theme-Konfiguration aktivierst:

• Tab "Weiteres" => Bereich "Erweiterte Einstellungen" => Abschnitt "Zusätzliche CSS-Klassen" => CSS-Klassen für Spaltenabstände laden (optional)

Elemente in CMS Grid-Blöcken haben in Shopware 6 einen fest definierten Abstand von 40px

Mit ThemeWare® erhältst du eine große Auswahl an CSS-Hover-Klassen für Bilder in CMS-Blöcken. Diese CSS-Klassen ermöglichen dir, verschiedene Hover-Effekte für Bilder in CMS-Blöcken zu nutzen.

Diese CSS-Klassen stehen dir zur Verfügung, wenn du die folgende Theme-Konfiguration aktivierst:

• Tab "Weiteres" => Bereich "Erweiterte Einstellungen" => Abschnitt "Zusätzliche CSS-Klassen" => CSS-Klassen für Bild-Hover-Effekte laden (optional)

Zusatzfelder sind eine Grundfunktion von Shopware 6 und bieten dir die Möglichkeit, Produkte, Kategorien oder Hersteller individuell zu erweitern. Mit Zusatzfeldern kannst du flexibel zusätzliche Informationen speichern und bei Bedarf in der Storefront ausgeben.

Da weder Shopware noch ThemeWare® wissen können, in welche Datei bzw. in welchem Twig-Block dein individuelles Zusatzfeld integriert werden soll, müssen individuelle Zusatzfelder manuell in die Storefront eingebunden werden.

Dies geht entweder mit einem CMS-Element in einem Erlebniswelt-Layout oder über eine individuelle Template-Anpassung.

• Vorteile

Um zu prüfen ob ein Fehler oder Problem durch eine individuelle Anpassung verursacht wird, folge bitte der folgenden Anleitung:

1. Theme-Duplikat ausschließen (falls verwendet)

2. Individuelle Anpassungen ausschließen (falls verwendet)

In seltenen Fällen entsteht ein Problem dadurch, dass Dateien von Erweiterungen (Plugins, Apps oder Themes) nicht vollständig in die Storefront übertragen wurden. Dies kann man im Fall von ThemeWare® mit einem "Soft Reset" lösen.

1. Weise deinem Verkaufskanal das Shopware Standard-Theme zu:

   1. Navigiere über die Hauptnavigation zu deinem Verkaufskanal ("Verkaufskanäle" => "..." => Tab "Theme")'

Wie du eigene Fonts oder Google Fonts selber hostest bzw. lokal auf deinem Webserver hinterlegst und dann in deinen Shopware 6 Shop (self-hosted) einbinden kannst, erfährst du in diesem Artikel.

Damit du die Font-Dateien und die entsprechenden CSS-Anpassungen problemlos hinterlegen kannst solltest du eine separate Erweiterung (Plugin oder App) für individuellen Anpassungen nutzen.

• Prüfe ob es im bereits eine passende Erweiterung gibt.

Du hast mit ThemeWare® verschiedene Möglichkeiten, um eigenen JS-Code in deinen Shop einzubinden.

Bitte beachte, dass individueller Code nicht automatisch komprimiert wird. Komprimiere deinen individuellen Code am besten manuell, bevor du diesen einbindest.

Beachte zudem, dass individuelle Skript nicht in automatisch in den Cookie-Consent-Manager von Shopware übernommen werden. Nutzt du Cookie relevanten JS-Code, sorge für eine korrekte Einbindung in den Cookie-Consent-Manager.

Bevor wir zu eigentlichen Einbindungen kommen, möchten wir noch darauf hinweisen, in keinem Fall Originaldateien von Shopware oder Erweiterungen (Plugins, Apps oder Themes) zu bearbeiten. Das kann zu diversen Problemen führen.

Zudem weisen wir darauf hin, das die Funktionalität von Shopware, ThemeWare® und Erweiterungen Dritter durch fehlerhaftem JavaScript-Code erheblich gestört werden können. Achte daher unbedingt darauf, sauberen und fehlerfreien JS-Code zu schreiben!

In dieser Anleitung erfährst du, wie du ein Kategorie-Layout erstellen kannst.

1. Wechsel über die Hauptnavigation in die "Erlebniswelt-Verwaltung" (1) (2) deines Shops ("Inhalte" => "Erlebniswelten")

2. Optional: Du kannst die Layouts über den Reiter "Kategorieseiten" auf diesen Seitentyp eingrenzen (3)

In dieser Anleitung erfährst du, wie du ein Kategorie-Layout mit Sidebar erstellen kannst.

1. Wechsel über die Hauptnavigation in die "Erlebniswelt-Verwaltung" (1) (2) deines Shops ("Inhalte" => "Erlebniswelten")

2. Optional: Du kannst die Layouts über den Reiter "Kategorieseiten" auf diesen Seitentyp eingrenzen (3)

In dieser Anleitung erfährst du, wie du ein Kategorie-Layout einer Kategorie zuweisen kannst.

1. Wechsel über die Hauptnavigation in die "Kategorie-Verwaltung" (1) (2) deines Shops ("Kataloge" => "Kategorien")

2. Wähle die entsprechende Kategorie aus (3)

Mit ThemeWare® zeigst du die Unterkategorien einer Kategorie als Kacheln bzw. Links oberhalb der Produktliste an. So führst du deine Kunden schneller ins passende Sortiment, verbesserst die interne Verlinkung und machst dein Kategoriemenü direkt auf der Seite sichtbar.

• eine Kategorie, die sichtbare Unterkategorien besitzt

• optional ein Anzeigebild je Unterkategorie

Image-Klassen – Dekorationsklassen für Bilder

ThemeWare® bietet dir diverse CSS-Dekorationsklassen für Bilder in CMS-Blöcken. In dieser Anleitung stellen wir dir diese CSS-Klassen vor.

Diese CSS-Klassen stehen dir zur Verfügung, wenn du die folgende Theme-Konfiguration aktivierst:

• Tab "Weiteres" => Bereich "Erweiterte Einstellungen" => Abschnitt "Zusätzliche CSS-Klassen" => CSS-Klassen für Bild-Dekorationen laden (optional)

ThemeWare® CSS-Dekorationsklassen

Rahmen

Fügt Bildern in einem CMS-Block einen 12px dicken Rahmen hinzu.

Beispiel

Fügt Bildern in einem CMS-Block einen Schlagschatten hinzu.

Beispiel

Fügt Bildern in einem CMS-Block einen Schlagschatten hinzu.

Beispiel

Rundet Bilder in einem CMS-Block ab.

Beispiel

Boxed-Klassen – CSS-Klassen für Full-width-Sektionen

Da die CSS-Klasse container nicht in jedem Szenario die perfekte Lösung ist, gibt es seit ThemeWare® 1.1.3 neue CSS-Boxed-Klassen um CMS-Blöcke oder CMS-Sektionen in Erlebniswelten "boxed" zu gestalten.

ThemeWare® CSS-Boxed-Klassen

ThemeWare® bietet dir verschiedene CSS-"max-width"-Klassen um die maximale Breite von CMS-Sektionen/-Blöcken zu definieren.

Diese CSS-Klassen stehen dir zur Verfügung, wenn du die folgende Theme-Konfiguration aktivierst:

• Tab "Weiteres" => Bereich "Erweiterte Einstellungen" => Abschnitt "Zusätzliche CSS-Klassen" => CSS "max-width"-Klassen (optional)

In seltenen Fällen entsteht ein Problem dadurch, dass Dateien von Erweiterungen (Plugins, Apps oder Themes) nicht vollständig in die Storefront übertragen wurden. Dies kann man im Fall von ThemeWare® mit einem "Soft Reset" (siehe ThemeWare® Soft Reset durchführen) lösen.

Reicht dies nicht (z.B. bei fehlerhaften Schreibrechten durch eine manuelle Bearbeitung von Original-Dateien) hilft es nur ThemeWare® neu zu installieren:

ThemeWare® neu installieren:

1. Empfohlen: Erstelle ein vollständiges Backup deines Shops

2. Weise deinem Verkaufskanal das Shopware Standard-Theme zu:

   1. Navigiere über die Hauptnavigation zu deinem Verkaufskanal ("Verkaufskanäle" => "..." => Tab "Theme")'

   2. Weise bitte das Shopware Standard-Theme (bzw. Shopware default theme) dem entsprechenden Verkaufskanal zu

3. Deaktiviere ThemeWare®:

   1. Wechsel über die Hauptnavigation in die "Erweiterungs-Verwaltung" ("Erweiterungen" => "Meine Erweiterungen")

   2. Wechsel in den Tab "Themes"
4. Deinstalliere ThemeWare® (ohne die App-Daten zu entfernen):

   1. Klicke auf den Kontext-Button neben dem Theme um das Kontextmenü zu öffnen und darin auf "Deinstallieren"

   2. WICHTIG : Deaktiviere im folgenden Pop-up die Option "Alle App-Daten endgültig entfernen" damit deine Theme-Konfiguration erhalten bleibt!

5. Installiere ThemeWare® wieder:

   1. Installiere ThemeWare® nun wieder mit einem Klick auf "Installieren"

6. Aktiviere ThemeWare® wieder:

   1. Aktiviere ThemeWare® über dem Switch-Button links neben dem ThemeWare® Logo

7. Weise ThemeWare® nun wieder deinem Verkaufskanal zu:

   1. Wechsel über die Hauptnavigation in den Verkaufskanal deiner Storefront im Bereich "Verkaufskanäle"

   2. Wechsel in den Tab "Theme"
8. Shopware Cache leeren:

   1. Navigiere danach über die Hauptnavigation in den Bereich "Cache & Indizes" ("Einstellungen" => "System")

   2. Klicke auf "Caches leeren"

9. Webseite und Browser-Cache neu laden:

   • Lade danach die Seite, auf welcher das Problem aufgetreten ist, in deinem Web-Browser mit einem Cache-Refresh neu:

     • Windows: Strg + F5

• Anleitung:

• Anleitung:

• Anleitung:

Zusatzfelder sind eine Grundfunktion von Shopware 6 und bieten dir die Möglichkeit, Produkte, Kategorien oder Hersteller individuell zu erweitern. Mit Zusatzfeldern kannst du flexibel zusätzliche Informationen speichern und bei Bedarf in der Storefront ausgeben.

Da weder Shopware noch ThemeWare® wissen können, in welche Datei bzw. in welchem Twig-Block dein individuelles Zusatzfeld integriert werden soll, müssen individuelle Zusatzfelder manuell in die Storefront eingebunden werden.

Dies geht entweder mit einem CMS-Element in einem Erlebniswelt-Layout oder über eine individuelle Template-Anpassung:

CMS-Element

• Vorteile

  • Umsetzung ist sehr einfach

• Nachteile

  • erst ab Shopware 6.6.9 verfügbar

  • keine Abfrage ob ein Zusatzfeld leer ist möglich

• Vorteile

  • schon vor Shopware 6.6.9 verfügbar

  • eine Abfrage ob ein Zusatzfeld leer ist möglich

In dieser Anleitung erklären wir dir wie du Zusatzfelder mit einer Template-Anpassung in der Storefront ausgeben kannst.

In der folgenden Schritt-für Schritt-Anleitung binden wir das individuelle Zusatzfeld "Sicherheitshinweis" mit unserem kostenfreien auf der Produktdetailseite (PDS) in die Storefront ein.

Die Produktbeschreibung wird über die Template-Datei description.html (siehe ) in die Storefront geladen.

Erstelle also die Datei description.html.twig in folgendem Ordner vom Customizing Plugin:

Leite nun die Originaldatei von Shopware wie folgt ab:

Die Beschreibung befindet sich im Twig-Block component_product_description_content. Wir vererben den Block nun wie folgt:

Füge nun nach dem eigentlichen Twig-Block-Inhalt (⇒ {{ parent }}) das Zusatzfeld (z.B. custom_gpsr_sicherheitshinweis) ein:

Optional: Du kannst die Einbindung auch noch mit einem if verbinden, das prüft, ob das Zusatzfeld überhaupt befüllt ist und einen Überschrift ergänzen:

Lade die neue Template-Datei nun auf deinen Webserver in das Verzeichnis:

Leere abschließend einmal den Shopware- sowie deinen Browser-Cache damit die Änderung auch in der Storefront korrekt angezeigt wird.

Mehr Informationen zum Thema "Zusatzfelder" findest du in folgendem Artikel:

Für eine maximale Flexibilität und Kompatibilität, basiert das "ThemeWare® CMS-Styling" auf CMS-Blöcken und kann im Tab "Erlebniswelten" für verschiedene Seitentypen aktiviert/deaktiviert werden.

• Tab "Erlebniswelten" => Bereich "ThemeWare® CMS-Styling" => ThemeWare® CMS-Styling laden (CMS-Shopseiten / CMS-Landingpages / CMS-Kategorieseiten / CMS-Produktseiten)

Das "ThemeWare® CMS-Styling" wird nur in Erlebniswelten mit dem Größenmodus "Zentrierter Inhalt" (=boxed) und angewendet.

Auf CMS-Seiten mit aktivem "ThemeWare® CMS-Styling" bekommen CMS-Blöcke eine Grundkonfiguration. Diese besteht derzeit aus einer Rahmenfarbe, einer Hintergrundfarbe und einem Außenabstand nach unten.

Die Shopware 6 Storefront basiert auf dem Bootstrap-Framework. Aufgrund unserer HC-Architecture® ist ThemeWare® ebenfalls vollständig kompatibel mit Bootstrap.

Nachfolgend stellen wir dir die entsprechenden CSS-Klassen vor und zeigen dir ein paar Anwendungsbeispiele.

Um Erlebniswelt-Blöcke in bestimmten Viewports ein- oder auszublenden, können die nachfolgenden Bootstrap Display-CSS-Klassen genutzt werden. Damit lassen sich beispielsweise Bild-Elemente für verschiedene Viewports optimieren.

Übersicht der Bootstrap Display-CSS-Klassen:

Diese CSS-Klassen kannst du im Erlebniswelt-Editor über das Feld "CSS-Klassen" in den Block-Einstellungen bzw. Sektion-Einstellungen hinzufügen.

Wie du eigene Fonts oder Google Fonts selber hostest bzw. lokal auf deinem Webserver hinterlegst und dann mit unserem kostenfreien "ThemeWare® Customizing Plugin" in deinen Shopware 6 Shop (Self-hosted) einbinden kannst, erfährst du in diesem Artikel.

Damit du die Font-Dateien und die entsprechenden CSS-Anpassungen problemlos hinterlegen kannst solltest du eine separate Erweiterung für individuellen Anpassungen nutzen.

• Prüfe ob es im bereits eine passende Erweiterung gibt.

Wenn du das Erscheinungsbild von ThemeWare® mittels SCSS anpassen möchtest, findest du in diesem Artikel nützliche Tipps für die Arbeit mit SCSS-Dateien.

Damit du die entsprechenden SCSS-Anpassungen problemlos hinterlegen kannst solltest du eine separate Erweiterung für individuellen Anpassungen nutzen.

• Prüfe ob es im bereits eine passende Erweiterung gibt.

Wie du das Erscheinungsbild von ThemeWare® in Shopware 6 (self-managed) mittels einer individuellen Anpassung und mit unserem kostenfreien "ThemeWare® Customizing Plugin" verändern kannst, erfährst du in diesem Artikel.

Für individuelle Anpassungen brauchst du in Shopware 6 ein eigenes Theme oder eine separate Erweiterung (Plugin oder App) und nicht – wie bei Shopware 5 – eine Theme-Ableitung.

• Prüfe ob es im bereits eine passende Erweiterung gibt.

Wie du das Erscheinungsbild von ThemeWare® in der Shopware 6 Cloud mittels einer individuellen Anpassung und mit unserer kostenfreien "ThemeWare® Customizing App" verändern kannst, erfährst du in diesem Artikel.

Für individuelle Anpassungen brauchst du in Shopware 6 ein eigenes Theme oder eine separate Erweiterung (Plugin oder App) und nicht – wie bei Shopware 5 – eine Theme-Ableitung.

• Prüfe ob es im bereits eine passende Erweiterung gibt.

Die "Abstände" oder "Lücken" in Produkt-Boxen - beispielsweise in Produkt-Listings oder in Produkt-Slidern - sind von Shopware beabsichtigt und bereits im Standard-Theme vorhanden.

Technisch gesehen sind dies Platzhalter für Informationen die je nach Produkt-Konfiguration vorhanden sind und dann angezeigt werden sollten.

Damit durch das Fehlen von Informationen in manchen Produkten nicht jede Produkt-Box eine unterschiedliche Höhe hat, gibt es diese "Platzhalter".

Informationen in diesen "Platzhaltern" sind beispielsweise die Bewertungs-Sterne oder die Variantenmerkmale: