Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Lade dir die ThemeWare® Utilities herunter.
Sieh dir das ThemeWare® Video-Tutorial am.
Lese die ThemeWare® Einführung.
Speicher dir den Link zu unserem .
Speicher dir den Link zum .
Beachte stets die Hilfe-Texte in der ThemeWare® Konfiguration.
Schaue regelmäßig in den Bereich .
Schaue vor Updates in den .
Aktualisiere Shopware und dein ThemeWare® Theme regelmäßig.
Deaktiviere dein Theme vor einem Update.
Info: Dieser Artikel ist in Arbeit.
Info: Dieser Artikel ist in Arbeit.
Bevor du mit der Konfiguration deines Themes jetzt richtig durchstartest, möchten wir dir ein paar Tipps zur idealen Vorgehensweise bei der Konfiguration deines Themes geben.
Das ist besonders wichtig wenn du Einsteiger bei Shopware oder Einsteiger bei ThemeWare® bist.
Nachfolgend findest du wichtige Tipps, die wir aus der Erfahrung der letzten 3 Jahre mit tausenden Kunden gewonnen haben und die wir selber berücksichtigen, wenn wir Themes konfigurieren.
Zuerst empfehlen wir dir, direkt mit Live-Daten oder möglichst genauen Demo-Daten zu arbeiten!
Denn die Wahrnehmung eines Designs wird nicht nur davon beeinflusst wie groß die Schrift ist, welche Farbe die Schrift hat oder was für eine Schriftart du nutzt, sondern beispielsweise auch wie lang beispielsweise einzelnen Navigationspunkte sind.
Wenn du das Design richtig schön machen möchtest und einfach schreibst "Menüpunkt 1", "Menüpunkt 2", "Menüpunkt 3", "...", "Menüpunkt 6", dann kann es sein, dass du die Navigation nett konfigurierst, später erstellst du die richtigen Kategorien und plötzlich sieht es nicht mehr ganz so gut aus.
Der nächste Tipp ist: Konfiguriere Shopware direkt mit!
ThemeWare® ist so umfangreich hat so viele Funktionen, die in so viele Bereiche reingehen, die so tief und eng mit Shopware verdrahtet sind, dass es einfach viele Konfigurationen gibt bei denen einige Sachen in ThemeWare® eingestellt werden und einige direkt in Shopware.
Deshalb ist es wichtig, dass du wirklich Bereich für Bereich durchgehst und schaust was du in ThemeWare® konfigurieren musst. Und wenn es dann Einstellungen gibt die du innerhalb von Shopware konfigurieren solltest, die mit einer ThemeWare® Funktion zu tun haben, dann ist unser Tipp, dass du das direkt machst damit du wirklich zum finalen Erscheinungsbild deines Shops kommst.
In unserer Einführung bzw. unserem Video-Tutorial legen wir genau darauf unser Augenmerk. Das Ziel ist, dass du am Ende einen erfolgreichen Online-Shop hast. Einen Online-Shop der super aussieht. Deswegen haben wir in unsere Einführung sehr viele Dinge mit reingenommen, die eigentlich innerhalb von Shopware konfiguriert werden, mit denen wir als Theme-Hersteller eigentlich gar nicht so viel zu tun haben, die aber sehr entscheidend bei der Wahrnehmung eines Designs eines Shops sind.
Das solltest du gleich mit konfigurieren:
Kategorien und damit die Navigation
Produkte
Eigenschaften von Produkten
Wenn du in der Theme-Konfiguration bist – die ThemeWare® Konfiguration hat sehr viele Einstellungsmöglichkeiten – und du diese einmal komplett durchgehst und dann 20, 50 oder gar 100 Konfigurationsfelder in einem Rutsch änderst und die Änderung speicherst, dann wirst du in der Storefront viele Dingen sehen welche dir sehr gut gefallen. Es wird aber sicherlich auch einige Dinge geben, welche dir noch nicht 100% gefallen. Wahrscheinlich weißt du nun gar nicht mehr, welche Konfiguration jetzt was genau bewirkt hat.
Auch wenn du das Gefühl hast, dass dieses Vorgehen vielleicht länger dauert, im Endeffekt geht es schneller, wenn du viele kleine Schritte machst. Du hast zwar einen "langsameren" aber dafür zielgerichteteren Vorschritt. Du weißt immer sofort, der Header ist fertig, die Navigation ist fertig usw.
Deswegen empfehlen wir viele kleine Schritte zu machen.
Sehr hilfreich ist es auch sich die vorherigen (ursprünglichen) Werte kurz zu notieren!
Wenn du beispielsweise eine Farbe änderst, kopiere dir die aktuelle Farbe in ein Textdokument oder in die Zwischenablage. Falls dir die neue Farbe nicht gefällt, kannst du ganz einfach wieder die alte Farbe einfügen ohne viel Aufwand beim zurück konfigurieren.
Dieser Tipp ist vor allem für Einsteiger oder nicht Designerfahrene bzw. nicht Webdesignaffine Benutzer wichtig.
Halte die Anpassungen eher gering und orientiere dich am fertigen Theme!
Wir haben verschiedene Designs bzw. Theme-Varianten im Store, verwende einfach das Theme welches am besten passt.
Du kannst dir auch die Testversion von einem weiteren Theme installieren und dort in die Konfiguration schauen. Wenn dir beispielsweise in einem anderen Theme der Footer besser gefällt, kannst du dir gerne beide Themes installieren, die Testversion kostet ja kein Geld. Dann kannst du einfach schauen wie wurde in dem anderen Theme der Footer konfiguriert und dies in dein eigentliches Theme übertragen.
Sehr wichtig ist es auch die Hilfe-Texte zu lesen! Darin stehen immer wichtige Details zu den Optionen einer Konfiguration bzw. grundsätzlich zu der entsprechenden Konfiguration.
Schau dir unbedingt das Video-Tutorial und die Online-Kurse vollständig an!
Alles wurde bewusst nach dem Prinzip geringster Aufwand – größter Nutzen produziert. Viele kurze Videos mit vielen Inhalten.
Nimm dir die Zeit und schau dir alles an auch wenn du siehst, da kommen noch einige Videos. Schau dir die Videos nach und nach an konfiguriere dabei begleitend deinen Shop.
Wir sind nicht nur Theme-Entwickler sondern auch Grafiker und Designer. Daher sind wir uns der Bedeutung des Shop-Logos für das Erscheinungsbild deines Shops durchaus bewusst. Unsere Empfehlung ist daher, dein Logo von einem Profi erstellen zu lassen – zumindest sofern du noch kein Logo hast.
Du kannst natürlich auch selber ein Logo erstellen, einen Online "Logo Maker" nutzen oder ein Logo bei einem Stock-Anbieter kaufen. Alternativ gibt es auch die Möglichkeit ein Logo über einschlägige Freelancer-Portale zu beauftragen oder einfach unsere Logo-Vorlage zu nutzen.
Vielleicht trifft auf dich keiner der Punkte zu, denn du möchtest einfach dein bestehendes Logo weiternutzen oder für deinen Online-Shop anpassen bzw. anpassen lassen.
Egal für welche Variante du dich entscheidest: Beachte, dass dein Logo DAS Markenzeichen für deinen Shop ist und sein wird. Es ist damit ein wesentlicher Bestandteil deines visuellen Erscheinungsbildes und ein Schlüssel zur Wiedererkennbarkeit deines Shops.
Nachfolgend haben wir ein paar Tipps die dir bei der Logo-Gestaltung helfen werden:
Nutze nicht zu kleinteilige bzw. detaillierte Grafiken für dein Shop-Logo. Diese eignen sich in der Regel nicht gut für kleine Viewports. Hinterlege darum zumindest für kleine Logos eine weniger detaillierte Variante.
Um Interpolations-Unschärfen durch eine Browser-Skalierung bei Pixelgrafiken zu vermeiden nutze ein Logo in einer möglichst passenden Größe – am besten etwas größer als benötigt. Orientiere dich gerne an unseren Bildvorlagen.
Komprimiere eine Pixelgrafik ggf. mit einem kostenfreien Online-Tool wie TinyPNG.
Für eine perfekte Skalierbarkeit nutze am besten eine Vektorgrafik deines Logos.
Logos im Querformat bieten sich an, da diese in den meisten Viewports platzsparend in die verschiedenen Header bzw. Header-Layouts passen.
Vermeide unnötigen Leerraum um die eigentliche Grafik. Dies erleichtert die Platzierung und Ausrichtung des Logos erheblich.
Detailgrad des Logos:
Unnötiger Leerraum in der Grafik:
Einführung: Eine Einführung in das Thema "Logo konfigurieren" findest du im Artikel
Grundwissen: Mehr Informationen zum Thema "Shop-Logo" findest du im Artikel
Shopseiten
Zahlung & Versand
Sprachen & Währungen
Tipp: Lass dich von den vielen Möglichkeiten nicht verleiten und übernimm dich nicht. Taste dich Stück für Stück voran.
Tipp: Zusätzlich findest du dort häufig auch Links zu verwendeten Textbausteinen um diese direkt bearbeiten zu können.
Tipp: Sie dir auch gerne unseren in ThemeWare® enthaltenen Online-Kurs "Grafik-Gestaltung" an. Den Zugang erhältst du über die .
Info: Dieser Artikel ist in Arbeit.
In diesem Artikel zeigen wir dir, wie du jedes Konfigurationsfeld in der Theme-Konfiguration sehr schnell finden kannst.
Angenommen du möchtest die Hintergrundfarbe der USP-Bar ändern, öffnest die Theme-Konfiguration und denkst dir "Nun, die USP-Bar ist im Header" und durchsuchst den gesamten Tab "Header". Nun findest du dort aber keine Konfiguration für die USP-Bar, also schaust du in den Tab "Footer", weil die USP-Bar ist ja auch im Footer. Aber auch dort findest du keine Konfiguration.
Bevor du nun lange weitersuchst, wechsle in den Tab "Allgemein" und öffne unsere legendäre "Feldsuchmaschine", den ThemeWare® Config-Finder.
Der ThemeWare® Config-Finder haben wir bereits vor einigen Jahren entwickelt, weil wir irgendwann mit ThemeWare® hunderte Konfigurationsfelder hatten und selbst gemerkt haben, dass es recht lange dauern kann ein bestimmtes Feld zu finden.
Trage als Suchbegriff einfach ein was du bearbeiten möchtest und dann zeigt der ThemeWare® Config-Finder dir sofort wo du Konfigurationsfelder findest.
Wir tragen einmal "usp" in das Suchfeld ein, denn wir wollen ja die USP-Bar konfigurieren. Dann wollen wir eine Farbe bearbeiten, also geben wir nun "farbe" ein und wir wollen nicht irgendeine Farbe bearbeiten sondern die Hintergrundfarbe, also geben wir zusätzlich "hintergrund" ein.
Im Suchfeld steht nun "usp farbe hintergrund" ("usp hintergrundfarbe" würde natürlich ebenfalls funktionieren). Während der Eingabe der einzelnen Wörter siehst du wie das Suchergebnis immer weiter reduziert wird.
Die Ergebnisse werden gemäß der ThemeWare-Konfiguration (Tabs, Bereiche, Abschnitte, Konfigurationsfeld) strukturiert und gruppiert.
Die Suche nach "usp farbe hintergrund" hat in unserem Fall 2 Konfigurationsfelder gefunden. Die Anzahl der Treffer in dieser Gruppe wird dir als blaue Badge, rechts neben dem Pfad zur Konfiguration angezeigt.
Wir klicken auf den Pfad um die Gruppe zu öffnen und bekommen eine Liste mit passenden Konfigurationsfeldern.
Jetzt siehst du die Konfigurationsfelder "Hintergrundfarbe (Header)" und "Hintergrundfarbe (Footer)". Das erste Feld ist bereits aufgeklappt und zeigt die alle Details an.
Neben der Bezeichnung des Konfigurationsfeldes siehst du ein Icon welches den Feldtyp symbolisiert. In unserem Fall eine Farbpalette, da es sich um Konfigurationsfelder vom Typ "Farbauswahl" handelt.
Zusätzlich zeigt dir der ThemeWare® Config-Finder weitere Informationen wie "Technischer Name", "Pfad zur Einstellung", einem "Beispiel-Wert" und ggf. dem "Hilfe-Text" des Konfigurationsfeldes an.
Der technischer Name ist die eigentlich Theme-Variable für das entsprechende Feld, dies ist relevant für Profis, die mit Variablen arbeiten wollen. Dem "Pfad zur Einstellung" folgst du einfach in der Theme-Konfiguration um das entsprechende Konfigurationsfeld zu finden.
In unserem Beispiel findest du die Konfigurationsfelder für die Hintergrundfarbe im Tab "Erweiterungen" => Bereich "USP-Bar" => Abschnitt "Farbkonfiguration".
Wir erhalten gelegentlich Fragen zu der Kompatibilität von ThemeWare® und Erweiterung "XY". Diese Frage beruht meist auf "schlechten" Erfahrungen mit Erweiterungen (Plugins oder Apps) und Custom-Themes zu Shopware 5 Zeiten. Aber seit Shopware 5 hat sich diesbezüglich bei Shopware, Erweiterungs-Herstellern und Theme-Herstellern viel getan.
Tatsächlich gab und gibt es unserer Erfahrung nach extrem wenig Probleme zwischen Erweiterungen und Custom-Themes. Wenn ist die Grundfunktion äußerst selten eingeschränkt, meist geht es lediglich um visuelle "Probleme" die sich leicht lösen lassen.
Dennoch haben wir auf Basis unserer Erfahrung (seit 2017) als Marktführer im Bereich Themes bei der Neuentwicklung unserer Themes für Shopware 6 besonderen Wert auf eine maximale Kompatibilität zu Erweiterungen Dritter gelegt. Diese erreichen wir durch unsere neue HC-Architecture®.
Durch diese Architektur ist ThemeWare® von Grund auf höchst kompatibel zu fast allen Shopware Erweiterungen (Plugins oder Apps). Sollte es doch mal zu einer Inkompatibilität kommen, kannst du diese selber mit wenigen Klicks lösen, indem du den jeweiligen Funktionsbereich einfach abschaltest und dadurch auf den Shopware Standard setzt.
Leider sind manche Hersteller (oftmals Hersteller besonders kleiner Erweiterungen) recht unflexibel und teils unkooperativ und entwickeln ausschließlich für das Standard-Theme von Shopware (wobei sogar Shopware selbst Custom-Themes im Angebot hat).
Ideal wäre hier natürlich, ein entsprechender Hinweis in der Store-Beschreibung der entsprechenden Erweiterung auf diese gravierende Einschränkung aber auch das ist leider nicht immer der Fall. Von solchen Herstellern raten wir beim Einsatz von Custom-Themes unbedingt ab.
Das alles ist aber nicht so groß wie es scheint. Es gibt viele Hersteller die Ihre Erweiterung gerne kompatibel mit dem marktführenden Theme für Shopware 5 und Shopware 6 halten.
von Valerius Karch
Die ideale Bildgröße hängt von deinem Design und dem gewünschten Detailgrad ab.
Bilder in einer passenden Größe hochladen
Orientiere dich an den Thumbnail-Größen die im entsprechenden Ordner der Medienverwaltung konfiguriert wurden.
Bilder mit 1920x1920px sind eine gute Wahl, da Shopware oftmals ein 1920px Thumbnail generiert.
Alternativ kannst du auch ein kleineres Format nutzen und die größeren Thumbnails deaktivieren.
Füge bei Bedarf eine benutzerdefinierte Größe als zusätzliche Thumbnail-Größe hinzu.
Nutze die Vorlagen aus den deines Themes.
Performance berücksichtigen
Bilder sollten weder zu klein noch unnötig groß sein. Wähle eine Größe, die eine gute Balance zwischen Bildqualität und Ladezeit bietet.
Bilder sollten gut komprimiert sein, um die Dateigröße möglichst gering zu halten.
Empfohlene Bildoptimierung
Thumbnails anpassen: Passe die Thumbnail-Größen in der Medienverwaltung an dein Shop-Design an und entferne ggf. unnötige Formate. So verhinderst du überflüssige Daten und stellst sicher, dass Bilder in der optimalen Größe und Qualität geladen werden.
Bilder gut komprimieren: Unkomprimierte Bilder können die Ladezeit des Shops erheblich verlangsamen. Nutze Tools wie TinyPNG, um die Dateigröße zu reduzieren, ohne sichtbaren Qualitätsverlust.
In diesem Artikel findest du, nützliche Links und Tools welche dir bei der Arbeit an und mit deinem Shop weiterhelfen werden.
Moderne Bildformate nutzen: WebP bietet eine deutlich bessere Komprimierung als JPG oder PNG bei gleicher oder sogar besserer Bildqualität. Shopware unterstützt WebP nativ, sodass sich dieses Format für schnellere Ladezeiten und bessere Performance empfiehlt.
Automatische Bildoptimierung: Im Shopware Store gibt es Erweiterungen, die Bilder automatisch optimieren, sobald sie hochgeladen werden. Diese Tools übernehmen die Komprimierung und Konvertierung in WebP, sodass keine manuelle Bearbeitung erforderlich ist.
Adminer für das Admin von: Friends of Shopware (Github)
Tipp: Den ThemeWare® Config-Finder erreichst du über folgenden Link: https://config.themeware.design/
Tipp: Der ThemeWare® Config-Finderhat hat zwei Modi "UND" bzw. "ODER". Zusätzlich gibt es einen Button "Kategorien ein-/ausblenden" um dir alle Gruppen auf einmal anzeigen zu lassen und diese über die Browser-Suche (Strg + F) durchsuchen zu können.
Info: Dieser Artikel ist in Arbeit.
In diesem Artikel erklären wir dir einige wichtige Begriffe, mit denen du beim Konfigurieren deines Themes sehr wahrscheinlich in Berührung kommen wirst:
Die Administration ist ein Bereich deines Shops, welcher nur für dich als Administrator (und ggf. weitere Benutzer) zugänglich ist. In Shopware 5 auch "Backend" genannt.
Die Storefront ist ein Verkaufskanal, welcher für deine Besucher bzw. Kunden erreichbar ist. Es ist der öffentliche Bereich deines Shops. Häufig auch "Frontend" genannt.
Verkaufskanäle bieten dir die Möglichkeit, über dein Shopsystem verschiedene Absatzwege anzubinden. Dies ist in der Regel die klassische Storefront.
Der Header (dt.: Kopf) ist der obere Bereich bzw. der Kopfbereich in der Storefront welcher z.B. das Logo, die USP-Bar, die Navigation, die Sprachauswahl oder die Service-Navigation enthält.
Technische Bedeutung: Der HTML <head> ist ein Element welches z.B. die Meta-Titel oder die Meta-Description enthält und nicht direkt im Webbrowser gezeigt wird. Es gibt nur ein <head>-Element in einem HTML-Dokument.
Der Body (dt.: Körper) bezeichnet den Teil der Storefront, der den eigentlichen Inhalt des Shops darstellt.
Technische Bedeutung: Das HTML <body>-Element repräsentiert den Inhalt eines HTML Dokuments. Es gibt nur ein <body>-Element in einem HTML-Dokument..
Der Footer (dt.: Fußzeile) ist der untere Bereich bzw. der Fußbereich in der Storefront welcher z.B. den Newsletter, die Footer-Elemente wie Zahlungslogos und das Copyright enthält.
Technische Bedeutung: Der HTML <footer> ist ein Element welches sich am unteren Ende eines Dokuments befindet. Es gibt nur ein <footer>-Element in einem HTML-Dokument.
HTML steht für Hypertext Markup Language und ist eine Sprache in welcher die Storefront ausgegeben, vom Webbrowser interpretiert und dann dargestellt werden kann.
Hinweis: In verschiedenen Editoren der Shopware Administration hast du die Möglichkeit vom WYSIWYG-Modus (What You See Is What You Get) in einen HTML-Modus zu wechseln um dort mit HTML-Code zu arbeiten
Content (dt.: Inhalt) ist der eigentliche Inhalt eines Shops. Content meint neben Text auch die Bilder und Videos. Weitgefasst könnte man auch sagen die Artikel/Produkte sind Content.
Tipp: Viele weitere Begriffe und Erklärungen zu ThemeWare® und Shopware 6 findest du im ultimativen "ThemeWare® Lexikon" für Shopware 6:
Wenn etwas "full-width" ist, geht das entsprechende HTML-Element bzw. der entsprechende Inhalt über die volle Breite des Browserfensters.
Wenn etwas "boxed" ist, geht das entsprechende HTML-Element bzw. der entsprechende Inhalt nicht über die volle Breite des Browserfensters sondern wird in einer definierten Breite mittig zentriert ausgerichtet im Browserfenster dargestellt.
Container sind HTML-Elemente im Shop welche verschiedene Inhaltselemente (z.B. Texte, Artikel, Slider etc.) zusammenfassen.
Der Haupt-Container umschließt beispielsweise den gesamten Content der Seite. Du kannst für diesen Container beispielsweise das Layout "full-width" oder "boxed" konfigurieren. Wie Breite der Container im Boxed-Layout ist kannst du ebenfalls konfigurieren.
Beispielsweise kann die Hauptnavigation in deinem Shop "Sticky" sein. In diesem Fall verschwindet die Navigation beim Scrollen nicht aus dem Browserfenster sondern bleibt am oben Rand "kleben".
Der Layer der Top-Navigation welcher aufklappt wenn man mit der Maus über einen Menüpunkt fährt und die Unterkategorien der entsprechenden Kategorie anzeigt.
Offcanvas Element sind Elemente die außerhal vom Browserfenster platziert sind und durch bestimmte Aktionen in das Fenster fahren können.
Es gibt in Shopware beispielsweise den Offcanvas-Warenkorb und die mobile Offcanvas-Navigation.
Dies ist eine Angabe die mit der Größe des Browserfensters (bzw. dem Viewport) zu tun hat. Der Wert gibt an, dass ein Element beispielsweise erst ab einer Fensterbreit von >= 1200 Pixeln angezeigt wird.
Dies wird dir an verschiedenen Stellen der Konfiguration z.B. bei der USP-Bar begegnen.
In Shopware gibt es diverse Logos. Beispielsweise gibt es das Shop-Logo, Hersteller-Logos oder Logos für Zahlungs- und Versandarten.
Das App-Icon wird bei mobilen Geräten genutzt wenn dein Shop auf dem Startbildschirm eines Mobile-Gerätes gespeichert wird.
Share-Icons sind wie der Name sagt für das Teilen von Links relevant. Das Share-Icon wird beispielsweise angezeigt, wenn ein Kunde einen Link zu deinem Shop per WhatsApp teilt.
Ein Favicon ist ein kleines meist 16×16 Pixel großes Icon, welches von Webbrowsern verwendet wird, um eine Website im entsprechenden Browser-Tab zu kennzeichnen.
Thumbnails sind Vorschaubilder bzw. Miniaturbilder eines Bildes, die als Vorschau für die größere Version dienen.
Headlines sind die Überschriften in deinem Shop. Sie dienen zur Gliederung einer Seite. Eine h1-Überschrift sollte auf einer Unterseite nur einmal vorkommen. Alle anderen Überschriften kannst du beliebig oft nutzen.
Überschriften sind für die Suchmaschinen-Optimierung sehr relevant.
Google bietet dir als Service kostenfreie Schriften an, welche du für deinen Shop nutzen kannst. Mehr dazu findest du auch in unserem Video-Tutorial oder im Bereich "Anleitungen".
Dies ist ein Hexadezimal-Farbwert. Diesen wirst du recht oft in der Theme-Konfiguration nutzen. Der Wert beginnt immer mit einer Raut #. Danach folgen 6 Zeichen (Buchstaben oder Zahlen).
Shopware hat in der Theme-Konfiguration Color-Picker die diese Farbwerte automatisch generieren.
Dieser Wert mit einem Dollar-Zeichen am Anfang stellt eine bestimmte Variable in einem Theme dar und ist der technische Name für ein Konfigurationsfeld.
Mit diesen Variablen kannst du im Theme-Manager eine Farbe die du einmal definiert hast an anderen Stellen wiederverwenden, damit du es ein bisschen einfacher hast.
So musst du nur einen Farbwert ändern und diese Farbe ändert sich an vielen Stellen im Theme.
Hover beschreibt den Zustand eines Elements auf einer Website welches gerade mit der Maus berührt wird.
Beispiels berührst du mit der Maus einen Menüpunkt mit der Maus, ändert sich dessen Farbe. Das ist dann die Hover-Farbe.
Oder du berührst ein Bild mit der Maus und das Bild wird vergrößert. Das ist der sogenannte Hover-Effekt.
Active beschreibt ein Element auf einer Webseite welches gerade aktiv ist.
Klickst du auf einen Menüpunkt und wechselst auf die entsprechende Seite, dann ist dieser Menüpunkt "aktiv" und hat eine individuelle Farbe. Das ist die active-Farbe.
Badges sind Hinweise im Shop, kleine Informationen die an Elementen drankleben.
Auf Produkten gibt es oft Badges die anzeigen ob ein Produkt z.B. versandkostenfrei oder gerade im Angebot ist.
Modals (oftmals auch Pop-ups genannt) sind Elemente die in einem Shop als Layer über dem eigentlichen Inhalt aufgehen.
Beispielsweise wenn du auf einen Button klickst um Informationen zu Versandkosten zu erhalten. Dann öffnet sich ein Modal mit den entsprechenden Informationen.
Erweiterungen in ThemeWare® sind Zusatzfunktionen welche an einer bestimmten Stelle ausgegeben werden.
Beispielsweise ist die USP-Bar eine Extension.
Widgets sind in ThemeWare® sind Zusatzfunktionen welche an verschiedenen Stellen im Shop ausgegeben werden können.
Beispielsweise kannst du die Zahlungsarten im Footer oder auf der Artikelseite anzeigen.
Die Brotkrumennavigation einer Webseite. Sie stellt den Navigations-Pfad zur aktuellen Seite unterhalb vom Header dar. So kann der Nutzer schnell an jede beliebige Stelle des gewählten Navigations-Pfades zurückkehren.
Tabs sind "Registerkarten" beispielsweise auf der Produktseite (Beschreibung, Bewertung etc.) oder im Theme-Manager.
CMS steht für Content Managment System. Das Content Managment System von Shopware sind die Erlebniswelten, damit verwaltest du Inhalte deiner Seiten.
Mit den Erlebniswelten kannst du sehr umfangreiche Seiten erstellen und gestalten. Beispielsweise die Startseite die du in unseren Demoshops sehen kannst.
Du kannst mit Erlebniswelten Landingpages, Kategorieseiten und Produktseiten erstellen und gestalten.
Selbst reine Contentseiten, die sogenannten Shopseiten, wie z.B. das Impressum sind eine Erlebniswelt.
Das Listing auf einer Kategorieseite ist eine Auflistung aller Produkte der aktuellen Kategorie.
Viele weitere Begriffe und Erklärungen zu ThemeWare® und Shopware 6 findest du im ultimativen "ThemeWare® Lexikon" für Shopware 6:
Lexikon
