# Shopware 6 - Wissensdatenbank ![](/files/-MZWK0kJCTaM9hYL0pmj) # Support Wir helfen Dir. Kurzfristig und kostenlos! ## Dokumentation prüfen Bevor Du ein Ticket an unseren Support sendest, solltest Du prüfen, ob Dein Anliegen nicht bereits in unserer Dokumentation erläutert wird. Im Bereich [FAQ](broken://pages/-MCG6SvXkr7E8TPA7qzl) findest Du Hilfe zu häufig gestellten Fragen. ## Plugin als Ursache eines Fehler identifizieren Die Ursachenforschung ist der erste Schritt zur Behebung eines Fehlers. Oftmals ist nicht klar, ob ein Theme, eine Erweiterung oder Shopware selbst Auslöser eines Fehlers ist. Die folgende Anleitung wird daher häufig im ersten Schritt der Support-Antwort abgefragt. Wenn Du dies vor dem Erstellen eines Tickets bereits geprüft hast, können wir bereits bei der ersten Antwort gezielter auf Dein Anliegen eingehen. Das spart im Endeffekt auch Deine Zeit. Du kannst die Erweiterung daher ganz einfach als Ursache einer Fehldarstellung identifizieren oder auch ausschließen. Gehe dazu wie folgt vor: * Wähle die Erweiterung aus, welche als Ursache einer Fehldarstellung vermutet wird oder nicht erwartungsgemäß funktioniert. * Deaktiviere die Erweiterung * Wird eine Fehldarstellung oder eine Fehlfunktion durch eine Erweiterung hervorgerufen, sollte das Problem verschwinden, wenn die Erweiterung deaktiviert wird. * Ist die Fehldarstellung oder Fehlfunktion noch immer vorhanden, liegt die Ursache möglicherweise woanders. ## Plugin funktioniert nicht erwartungsgemäß * Prüfe die betroffene Funktion in der Storefront mit dem Standard Theme * Wird eine Fehldarstellung oder eine Fehlfunktion durch ein Theme hervorgerufen, sollte das Problem verschwinden, wenn das Standard-Theme des Systems aktiviert wird. * Ist die Fehldarstellung oder Fehlfunktion noch immer vorhanden, liegt die Ursache möglicherweise woanders. * Aktiviere nach der Prüfung wieder das ursprüngliche Theme für den Verkaufskanal ## Support beantragen Um ein Support-Ticket zu eröffnen, besuche bitte Deinen [Shopware Account](https://account.shopware.com). Ein Support-Ticket kannst Du über den **Shopbetreiberbereich > Support** einstellen. Hier findest Du oben rechts die Buttons "Support anfragen". Häufig benötigen wir zur Bearbeitung Deiner Anfrage zusätzliche Informationen, wie die eingesetzte Shop- oder Plugin-Version, welche wir über das Ticket-System einsehen können. Wie Du ein Support-Ticket erstellen kannst, erfährst Du hier: # Plugin als Ursache identifizieren Bevor Du ein Problem meldest kannst Du ganz einfach herausfinden, ob ein bestimmtes Plugin für eine Fehldarstellung verantwortlich ist oder nicht. Wird eine Fehldarstellung durch ein Plugin hervorgerufen, sollte das Problem verschwinden, wenn das Plugin deaktiviert wird. **Ist die Fehldarstellung noch immer vorhanden, ist das Plugin als Ursache ausgeschlossen.** Einstellungen eines Plugins bleiben erhalten, wenn das Plugin deaktiviert wird. Konnte das Plugin erfolgreich als Ursache identifiziert werden, erstelle ein Ticket über den [Shopware Account.](https://account.shopware.com/)​ # SVG Logo wird nicht angezeigt ## **Problembeschreibung** Das eingebundene Logo als SVG-Grafik wird nicht angezeigt. ## **Erläuterung** Eine SVG Grafik wird auf eine Art Leinwand (engl. canvas) angelegt. Dies ist ein eigentlich unendlich große Fläche, die aber in einem Viewport mit festen Maßen angezeigt wird. Teile des canvas außerhalb des Viewports werden abgeschnitten und sind nicht sichtbar. Beim Einbinden des Logos ist es nötig eine vorhandene SVG so zu skalieren, dass diese in ein bestimmtes Elternelement passt - dem Headerbereich. Mit dem viewBox-Attribut kannst Du ein Rechteck mit fester Pixelbreite bestimmen, das dann innerhalb des verfügbaren Viewports des Header skaliert werden kann. Voraussetzung für eine korrekte Darstellung von SVGs ist also, dass diese für das Web korrekt angelegt werden: Soll eine SVG Datei wie eine JPG oder PNG Grafik behandelt werden, benötigt diese eine **viewbox**, eine **width** sowie eine **height** Angabe. Weitere Inforamtionen dazu findest Du hier: In der SVG Datei fehlen daher möglicherweise Angaben zu Breite und Höhe der Grafik. Falls du die Datei aus Illustrator gespeichert hast, werden diese nicht standardmäßig mitgegeben. ## **Lösungsvorschlag** Öffne die SVG-Grafik in einem Editor und setze die Werte für viewbox, width und height nachträglich. Hilfe: ​ # Plugin Speichern - Theme Kompilieren Unsere Plugins verwenden die von Shopware bereitgestellten Technologien zum Verarbeiten von SCSS-Variablen und Javascript. Um die Ladezeiten zu optimieren stellen wir daher alle aussehensverändernden Einstellungen der Plugin-Konfigurationen so bereit, dass diese mit den CSS- und Javascript-Dateien in der Storefront minifiziert und konkateniert werden. {% hint style="info" %} **Konkatenieren** beschreibt das Zusammenfügen mehrere Dateien zu einer einzigen Datei.\ **Minifizieren** beschreibt einen Vorgang des Reduzierens von Codes mit dem unnötige Zeichen aus dem Quellcode entfernt werden, ohne die Funktionalität des Quellcodes zu verändern. {% endhint %} Das verringert die Anzahl an Requests und sorgt für die bestmögliche Integration unserer Plugin-Funktionen. Erst wenn das Theme erneut gespeichert wird, wird der Vorgang des Kompilierens in Shopware angestoßen. {% hint style="warning" %} Viele Nutzer und Hersteller wünschen sich die Funktion des automatischen Kompilierens beim Speichern einer Plugin-Konfiguration: {% endhint %} ### Wie kann ich mein Theme kompilieren? Um das Theme zu kompilieren wähle aus der linken Sidebar Deinen **Verkaufskanal (1)** aus, dessen Storefront Du aktualisieren möchtest. Bei mehreren Verkaufskanälen ist dieser Vorgang für alle Verkaufskanäle zu wiederholen. ![](/files/-MNP9RCFOfYOa3YwXTSF) Wechsle in den Tab **Theme (2)** und klicke auf den Button **Theme bearbeiten (3)**. Danach musst Du nur noch das Theme speichern. ![](/files/-MNP9vEwatmnWdJAIcLj) Es ist normal, dass dieser Vorgang einen Moment dauern kann, da hier einiges verarbeitet wird. # Eigenes CSS Unsere Plugins bieten in der Regel die Möglichkeit in der Plugin-Konfiguration eigene CSS-Regeln zu hinterlegen. Am unteren Ende der Plugin-Konfiguration befinden sich die **Erweiterten Einstellungen** und ein Textfeld zur Eingabe von weiteren Styles. ![](/files/-MSbhsxteuipf9xKEm4G) Im Feld **Eigenes CSS** kannst Du deine eigenen CSS-Regeln hinterlegen. Beispiel: ```css body { background: #ffffff; } ``` {% hint style="warning" %} Achte darauf, dass hier keine zusätzlichen \ Tags benötigt werden. {% endhint %} # Mehrsprachigkeit Plugin-Konfigurationen lassen sich zwar für jeden Verkaufskanal unterschiedlich einstellen - Übersetzungen für mehrsprachige Shops sind in Shopware 6 jedoch nur über Umwege möglich... In den neuen Versionen unserer Plugins werden die Übersetzungen über die Textbausteine gesteuert. ## Anleitung Navigiere zum Textbausteine Modul unter Einstellungen > Shop > Textbausteine. ![](/files/kxrdpW4wqQGSxh81Cmxk) Wähle im Bereich der Textbausteine das **Sprach-Set (1)** aus, welches die Übersetzung Deines Shops darstellt. In den meisten Fällen wird dies BASE en-GB für die englische Übersetzung sein. Über das Kontextmenü kann das Set **bearbeitet (2)** werden. ![](/files/mwHecnrc9CZhKCk0vufu) In der Plugin-Konfiguration findest Du einen **Hilfe-Eintrag (1)**, in welchem die **Phrase (2)** steht, welche im folgenden in den Textbausteinen gesucht werden kann. Diese unterscheidet sich von Plugin zu Plugin. ![](/files/LSy9fLWxXghwFcWvCMBU) Füge in der **Suchfunktion (1)** der Textbausteine die Phrase aus der Plugin-Konfiguration ein. Im Ergebnis-Listing der Textbausteine findest Du nun alle Einträge zum Plugin. Klicke in die jeweilige **Spalte (2)** um den Platzhalter `%placeholder%` gegen die Übersetzung auszutauschen. **Speichere (3)** den bearbeiteten Platzhalter. ![](/files/il48Q274G9mCVoHo3PNS) # Umschreiben von Lizenzen Häufig wird der Shopware Onlineshop unter einer vorläufigen Domain aufgesetzt und erst beim Livegang auf die eigentliche Domain umgeschrieben. Oder aber ein Plugin wurde erst auf einer Testumgebung mit anderer Domain getestet. In beiden Fällen ist ein Umschreiben der Lizenz notwendig sofern die Testumgebung nicht in einem Unterordner des eigentlichen Onlineshops betrieben wird. Eine Anleitung zum **Umschreiben der Shopdomain** findest Du hier: Eine Anleitung zum **Umschreiben einer Plugin Lizenz** findest Du hier: # Testversion vs Vollversion **Es gibt keinen funktionellen oder inhaltlichen Unterschied** zwischen Testversion und Vollversion eines Plugins oder Themes. Dir stehen daher bereits in der Testversion alle Funktionen des Plugins oder Themes zur Verfügung. Du kannst somint in Ruhe alle Funktionen ausprobieren und testen. Daher ist nach dem Kauf der Vollversion auch keine Neuinstallation eines Plugins oder Themes notwendig. Bei einer Testversion ist lediglich die Lizenz beschränkt. Nach dem Ablauf des Testzeitraums von 30 Tagen kannst Du entscheiden, ob Du das Plugin kaufen und weiter nutzen möchtest. # Theme als Ursache identifizieren ## Theme als Ursache identifizieren Du kannst Dein Theme ganz einfach als Ursache einer Fehldarstellung identifizieren oder auch ausschließen. Gehe dazu wie folgt vor: Bevor Du ein Problem meldest kannst Du ganz einfach herausfinden, ob das Theme für eine Fehldarstellung verantwortlich ist oder nicht. Wird eine Fehldarstellung durch ein Theme hervorgerufen, sollte das Problem verschwinden, wenn kurz das Standard-Theme des Systems aktiviert wird. **Ist die Fehldarstellung noch immer vorhanden, ist das Theme als Ursache ausgeschlossen.** Konnte das Theme erfolgreich als Ursache identifiziert werden, erstelle ein Ticket über den [Shopware Account.](https://account.shopware.com/)​ # Conversion Header # Mehrsprachigkeit > Verfügbar ab Plugin Version 2.2.0 ## Anleitung Navigiere zum Textbausteine Modul unter Einstellungen > Shop > Textbausteine. ![](/files/kxrdpW4wqQGSxh81Cmxk) Wähle im Bereich der Textbausteine das **Sprach-Set (1)** aus, welches die Übersetzung Deines Shops darstellt. In den meisten Fällen wird dies BASE en-GB für die englische Übersetzung sein. Über das Kontextmenü kann das Set **bearbeitet (2)** werden. ![](/files/mwHecnrc9CZhKCk0vufu) In der Plugin-Konfiguration findest Du einen **Hilfe-Eintrag (1)**, in welchem die **Phrase (2)** steht, welche im folgenden in den Textbausteinen gesucht werden kann. Diese unterscheidet sich von Plugin zu Plugin. ![](/files/dUv3octE94rWLUXlcMeN) Füge in der **Suchfunktion (1)** der Textbausteine die Phrase aus der Plugin-Konfiguration ein. Im Ergebnis-Listing der Textbausteine findest Du nun alle Einträge zum Plugin. Klicke in die jeweilige **Spalte (2)** um den Platzhalter `%placeholder%` gegen die Übersetzung auszutauschen. **Speichere (3)** den bearbeiteten Platzhalter. ![](/files/U0SPKXLE4lbxRObgWDIN) # Font Change # Lokale Schriften Die mit dem Plugin ausgelieferten Schriften Lokale Schriften sind Schriftarten, welche über das Plugin beim Installieren zur Verfügung stehen. Sie werden intern geladen und sind daher im Zuge der DSGVO die erste Wahl. ![](/files/-MTC3LYwOF5aOdsHi8Jb) Das Plugin liefert Schriftarten aus, welche Du über das **Select-Feld (2)** auswählen kannst. Die Bezeichnung setzt sich aus `'Schriftname'`, der [generischen Schriftfamilie](/apps/font-change/generische-schriftfamilie) und den Schriftschnitten (auch Font-Styles genannt) in eckigen Klammern zusammen. Damit die Schriftarten geladen werden, muss der Schalter **Lokale Schriften verwenden (1)** aktiv sein. Außerdem solltest Du den Schalter **Schriftart zuweisen (3)** aktivieren, damit die Schriftart beim Kompilieren des Themes mit der Standard Schrift ausgetauscht wird. {% hint style="info" %} Wird der Schalter **Schriftart zuweisen (3)** nicht aktiviert, wird die Schriftart bereits geladen aber in der Storefront nicht genutzt. Die Schriftart kann auch manuell in der Theme-Konfiguration im Bereich Typografie eingetragen werden oder mit Hilfe von CSS nur bestimmten Elementen zugewiesen werden. {% endhint %} Verfahre mit der Schriftart für Überschriften auf gleiche Weise. {% hint style="warning" %} Kompiliere das Theme damit die Änderungen wirksam werden! {% endhint %} ### Nur eine Schrift ändern Solltest Du nur eine Schrift für Texte oder Überschriften ändern wollen, kannst Du das **Auswahlfeld (1)** der nicht zu ändernden Elemente auf `- Standard-Schrift -` stellen. In unterem Beispiel wird nur die Schriftart für Überschriften geändert, alle Fließtexte verbleiben in der Standard-Schriftart von Shopware. ![](/files/-MTCF-FksAmRvgqJ47ei) ### Kombinieren von Schriften Lokale Schriftarten können auch mit externen oder eigenen Schriftarten kombiniert werden. So kann beispielsweise eine Schriftart für Überschriften aus dem Portfolio der lokalen Schriften gewählt werden und gleichzeitig eine Schriftart für Fließtexte aus den externen Schriften geladen werden. ### Gleiche Schriftart für Texte und Überschriften Sollen Inhalte und Überschriften die selbe Schriftart verwenden, lege diese einfach für beide Bereiche fest. Wir kümmern uns darum, dass nicht zwei Requests mit der selben Schriftart erzeugt werden. ### Warum gibt es nur eine begrenzte Auswahl an lokalen Schriften? Jede zusätzliche Schriftart muss mit dem Plugin ausgeliefert werden. Derzeit hat Shopware eine maximale Dateigröße eines Plugins von 10 MB. Diese können wir nicht überschreiten. # Externe Schriften (Google Fonts) Externe Fonts automatisch einbinden mit Google Fonts Api Nicht immer findet man die Schriftart, die man unbedingt nutzen möchte in der Auswahl der lokalen Schriften. Dann gibt es neben der Einbindung von eigenen Schriften auch die Möglichkeit diese bequem über die Google API extern zu laden. Das ist einfach und geht schnell. ### Schriftart bei Google Fonts aussuchen Besuche nun die Seite von Google Fonts um Dir eine Schriftart auszusuchen, in unserem Beispiel entscheiden wir uns für **Rubik**: {% embed url="" %} ![](/files/-MTCHigcPSCXIqBer9hT) In der Detailansicht der Schriftart klicke auf einen beliebigen style **"+ Select this style"**. Es erscheint im rechten Bereich die Informationen zur **font-family (2).**
{% hint style="success" %} **Du benötigst lediglich den Namen der Schrift - keinen weiteren Code:** **`'Rubik', sans-serif`** {% endhint %} Die verfügbaren **Schriftschnitte (3)** findest Du unter Styles. ### Schriftart laden Schalte zum Laden der Schriften in diesem Bereich den **Schalter "Verwende externe Schriften" (1)** ein, um die weiter unten konfigurierten Schriften zu laden. ![](/files/-MTC3hS4MyX6ZAvl6cH4) In das **Schriftart Feld (2)** der Konfiguration kopierst Du nun den Namen und die [generische Schriftfamilie](/apps/font-change/generische-schriftfamilie): `'Rubik', sans-serif` {% hint style="info" %} Der Schriftname sollte von Anführungszeichen eingeschlossen werden. {% endhint %} Unter **Styles (3)** wählst Du die Schriftschnitte aus, die Du in der Storefront nutzen möchtest. Achte darauf, dass mindestens ein Style geladen werden muss. Um die geladene Schriftart in der Storefront zu nutzen, solltest Du den Schalter **Schriftart zuweisen (4)** aktivieren, damit die Schriftart beim Kompilieren des Themes mit der Standard Schrift ausgetauscht wird. {% hint style="info" %} Wird der Schalter **Schriftart zuweisen (4)** nicht aktiviert, wird die Schriftart bereits geladen aber in der Storefront nicht genutzt. Die Schriftart kann auch manuell in der Theme-Konfiguration im Bereich Typografie eingetragen werden oder mit Hilfe von CSS nur bestimmten Elementen zugewiesen werden. {% endhint %} Verfahre mit der Schriftart für Überschriften auf gleiche Weise. {% hint style="warning" %} Kompiliere das Theme damit die Änderungen wirksam werden! {% endhint %} ### Kombinieren von Schriften Externe Schriftarten können auch mit lokalen oder eigenen Schriftarten kombiniert werden. So kann beispielsweise eine Schriftart für Überschriften aus dem Portfolio der externen Schriften gewählt werden und gleichzeitig eine Schriftart für Fließtexte aus den eigenen Schriften geladen werden. ### Gleiche Schriftart für Texte und Überschriften Sollen Inhalte und Überschriften die selbe Schriftart verwenden, lege diese einfach für beide Bereiche fest. Wir kümmern uns darum, dass nicht zwei Requests mit der selben Schriftart erzeugt werden. # Eigene Schriften Beliebige Webfonts auf den Server laden und nutzen Neben den schnellen Methoden zum Einbinden von Schriften gibt Dir das Plugin ebenfalls die Möglichkeit eigene Webfonts von beliebigen Quellen auf deinen Server zu laden und dadurch lokal und ohne externen Verbindung zu irgendeinem Dienst zu nutzen. Anstatt die Schriften also vom z.B. Google Server zu laden, kannst Du diese auch lokal auf dem eigenen Server ablegen und einbinden. ## Wo finde ich Webfonts? Es gibt im Internet verschiedenste Quellen für Webfonts. Der bekannteste Dienst ist hierbei [Google Fonts](https://fonts.google.com/). Aber auch auf [Font Squirrel](https://www.fontsquirrel.com/) oder andere Plattformen lassen sich kostenlose Webfonts finden. Kostenpflichtige Webfonts kannst Du beispielsweise bei [Adobe Fonts](https://fonts.adobe.com) lizensieren. Die Schriften bei Google Fonts können dort nicht direkt als Webfont heruntergeladen werden - um die Schriften von Google Fonts herunterladen zu können, kannst Du den kostenlosen Dienst von [Herokuapp](https://google-webfonts-helper.herokuapp.com/fonts) nutzen. {% embed url="" %} Google Schriften herunterladen {% endembed %} ## Wie nutze ich Webfonts lokal? Die folgenden Schritte sind prinzipiell immer gleich - egal ob Du die Schriften von Font Squirrel oder sogar lizensierte Schriften von Adobe Fonts nutzen möchtest. Der jeweilige Anbieter wird Dir immer Schriftdateien zum Download bereitstellen. Das folgende Beispiel greift die Nutzung von Google Fonts auf: ### 1. Schriften wählen In diesem Beispiel nutzen wir den kostenlosen Dienst von [Herokuapp](https://google-webfonts-helper.herokuapp.com/fonts) und suchen uns eine beliebige Schrift aus. Wir entscheiden uns für die Schriftart `Lora` und haben uns diese bereits bei [Google Fonts](https://fonts.google.com/?query=Lora) angesehen: ![](/files/-MTGlN3WIJx0wWhAshXi) Gib den Schriftnamen `Lora` oben links in der **Suche (1)** ein und klicke auf das Ergebnis. Google Webfonts Helper bietet die Möglichkeit das **Character-Set (2)** zu wählen. Für den westeuropäischen Raum ist der Standard `Latin`. Im nächsten Schritt müssen die **Schriftschnitte(3)** gewählt werden, welche verwendet werden sollen. In diesem Beispiel wählen wir `regular, italic, 500, 500italic`. {% hint style="info" %} Eine Liste der Schriftschnitte findest Du weiter unten: [Zuordnung von Namen und Werten](https://docs-sw6.zenit.design/plugins/font-change/eigene-schriften#zuordnung-von-namen-und-werten) {% endhint %} ### 2. Code kopieren? Nicht notwendig! Den Code anzupassen und in irgendwelche Dateien des Themes zu kopieren ist mit unserem Plugin **nicht notwendig**. Das Plugin übernimmt diese Aufgabe automatisch für Dich. Also, ab zu Schritt 3! {% hint style="success" %} Optional kannst Du hier noch zwischen **`Best Support`** und **`Modern Browsers` (1)** wählen. Diese Option legt fest, welche Dateiformate ausgeliefert werden. Es gibt die Dateiformate `eot` `woff` `woff2` `ttf` `svg` Laut der [Kompatibilitäts-Tablle](https://caniuse.com/woff) reicht es heutzutage vollkommen aus die Schriften nur noch für moderne Browser bereitzustellen. Das beinhaltet die Dateiformate `woff` und `woff2`. {% endhint %} ![](/files/-MTGqbdFyPGd8k5RARl2) ### 3. Schriften herunterladen Klicke auf den blauen Button, um die gewählten Schriften auf deinen Computer zu laden. In der Regel werden diese im Downloads-Ordner auf Deinem Computer gespeichert. ![](/files/-MTGpMNn3kNd_wwbWWr9) Entpacke das Zip-Archiv - Du findest nun alle gewählten Schriftschnitte und Dateiformate:\ `regular, italic, 500, 500italic` in den Dateiformaten `eot, woff, woff2, ttf, svg` - das macht also 4 x 5 = 20 Dateien. ![](/files/-MTGps3L2Xo9kBMZggNY) ### 4. Schriften auf den Server laden Mit einem FTP-Programm (z.B. Filezilla) und deinen FTP-Zugängen schaltest Du dich auf Deinen Server auf und navigierst in das Hauptverzeichnis deines Shops. Darin solltest Du einen Ordner `/public/fonts` finden. Lade alle heruntergeladenen Schriftschnitte in diesen Ordner. {% hint style="warning" %} Bitte erstelle keine Unterordner, da sonst die Dateipfade falsch wären. {% endhint %} ![](/files/-MTGsGru5VM0l0Yr_thn) ### 5. Konfiguration im Plugin Die Vorarbeit ist getan - nun kommt die eigentliche Konfiguration in den Plugin-Einstellungen. Dazu muss zunächst die **Verwendung von eigenen Schriften (1)** `aktiv` geschaltet werden. Die Schriften wurden bereits in den **`/public/fonts` Ordner (2)** geladen werden. ![](/files/-MTGuv2X3Ctg8Zf9Q313) Der Name der Schriftart wird inklusive der [generischen Schriftfamilie](/apps/font-change/generische-schriftfamilie) in das Konfigurationsfeld **Schriftart (3)** eingetragen. Der Name sowie die [generische Schriftfamilie](/apps/font-change/generische-schriftfamilie) steht in der Regel immer da, wo Du die Schriftart heruntergeladen hast. In diesem Fall stehen Name `Lora` und die [generische Schriftfamilie](/apps/font-change/generische-schriftfamilie) `serif` in der Überschrift. ``` 'Lora', serif ``` {% hint style="info" %} Der Schriftname sollte von Anführungszeichen eingeschlossen werden. {% endhint %} Beispiel: ![](/files/-MTGu4VLzYagd8Ba9g8E) Wähle nun aus, welche **Dateiformate (4)** verwendet werden sollen. Anhand der Dateiendungen der Schrift-Dateien auf dem Server kannst Du dies bestimmen oder Du schaust einfach nochmal auf der Seite nach. Beispiel: ![](/files/-MTGvlBOuCGyc93kaTgi) Schließlich gibst Du die Dateinamen und den dazugehörigen Schriftschnitt an. Je ein Dateiname pro Zeile. {% hint style="success" %} Da Du die Dateiformate in der **Auswahl (4)** bereits ausgewählt hast, müssen hier nicht 20 Dateinamen nebst Schriftschnitt angegeben werden. Das Plugin generiert im Hintergrund den richtigen Code. {% endhint %} ``` lora-v27-latin-regular: regular lora-v27-latin-italic: italic lora-v27-latin-medium: 500 lora-v27-latin-medium-italic: 500italic ``` Diese Auflistung erscheint auf den ersten Blick sehr redundant, da der Schriftschnitt im Dateinamen enthalten ist. Prinzipiell kann der Dateiname aber beim Download von einem anderen Anbieter völlig anders aussehen. Beispiel: ``` lora-normal-dick: regular lora-schraegschrift: italic lora-bisschen-dick: 500 lora-bisschen-dick-und-schraeg: 500italic ``` Um die geladene Schriftart in der Storefront zu nutzen, solltest Du den Schalter **Schriftart zuweisen (4)** aktivieren, damit die Schriftart beim Kompilieren des Themes mit der Standard Schrift ausgetauscht wird. {% hint style="info" %} Wird der Schalter **Schriftart zuweisen (6)** nicht aktiviert, wird die Schriftart bereits geladen aber in der Storefront nicht genutzt. Die Schriftart kann auch manuell in der Theme-Konfiguration im Bereich Typografie eingetragen werden oder mit Hilfe von CSS nur bestimmten Elementen zugewiesen werden. {% endhint %} Verfahre mit der Schriftart für Überschriften auf gleiche Weise. {% hint style="warning" %} Kompiliere das Theme damit die Änderungen wirksam werden! {% endhint %} ### Kombinieren von Schriften Eigene Schriftarten können auch mit lokalen oder externen Schriftarten kombiniert werden. So kann beispielsweise eine Schriftart für Überschriften aus dem Portfolio der eigenen Schriften gewählt werden und gleichzeitig eine Schriftart für Fließtexte aus den externen Schriften geladen werden. ### Gleiche Schriftart für Texte und Überschriften Sollen Inhalte und Überschriften die selbe Schriftart verwenden, lege diese einfach für beide Bereiche fest. Wir kümmern uns darum, dass nicht zwei Requests mit der selben Schriftart erzeugt werden. ### Zuordnung von Namen und Werten | Wert | Deutsch | Englisch | | ---- | ------------ | ------------------------- | | 100 | fein | Thin (Hairline) | | 200 | extraleicht | Extra Light (Ultra Light) | | 300 | leicht | Light | | 400 | normal | Normal (Regular) | | 500 | medium | Medium | | 600 | halbfett | Semi Bold (Demi Bold) | | 700 | fett | Bold | | 800 | extrafett | Extra Bold (Ultra Bold) | | 900 | schwarz | Black (Heavy) | | 950 | extraschwarz | Extra Black (Ultra Black) | # Externe Files Externe Schriftarten oder Icons anderer Anbieter Externe Schriftarten oder Icons anderer Anbieter können auch per URL von einer externen Quelle geladen werden. Einige Icon-Fonts und auch Google Fonts stellen solche URLs zur Verfügung. Befolge beim Einbinden einfach die Anleitung der jeweiligen Anbieter zur Nutzung der Fonts oder Icons. ![](/files/-MTC4O0qyCVOCd1g8jkZ) # Generische Schriftfamilie Was sind generische Schriftfamilien? Generische Schriftfamilien dienen als Fallback-Mechanismus, ein Mittel, um etwas von der Absicht des Stylesheet Autors zu erhalten für den Fall, wenn keine der angegebenen Schriftarten verfügbar sind. Generische Familiennamen sind Schlüsselwörter und dürfen nicht in Anführungszeichen eingeschlossen werden. Eine generische Schriftfamilie sollte die letzte Alternative in einer Liste von Schriftfamiliennamen sein. (Quelle: ) | Bezeichnung | Beschreibung | | ----------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | | serif | Schriftzeichen haben abschließende Striche, ausgeweitete oder zugespitzte Enden oder serifenbetonte Enden. | | sans-serif | Schriftzeichen haben gerade Strichenden. | | monospace | Alle Schriftzeichen haben die gleiche Breite. | | cursive | Schriftzeichen in kursiven Schriftarten haben üblicherweise verbindende Striche oder andere kursive Charakteristiken, die über die von kursiven Schriftzügen hinausgehen. Die Schriftzeichen sind teilweise oder ganz verbunden und das Ergebnis ähnelt eher einer Handschrift als gedruckten Lettern. | | fantasy | Fantasie Schriftarten sind überwiegend dekorative Schriftarten, die verspielte Darstellungen von Schriftzeichen beinhalten. | # Schriftschnitte Welche Schriftschnitte sollte ich verwenden? ## Welche Schriftschnitte sollte ich wählen? Shopware 6 verwendeet im Standard hauptsächlich | Wert | Deutsch | Englisch | | ---- | -------- | --------------------- | | 400 | normal | Normal (Regular) | | 600 | halbfett | Semi Bold (Demi Bold) | | 700 | fett | Bold | Es ist aber durchaus möglich, dass Plugins und Themes auch andere Schriftschnitte nutzen. Ebenfalls kann über die Editoren der Administration im Code-Modus auch etwas anderes definiert werden. Beispiel: ```

Aut et et saepe in minima et autem...

``` {% hint style="warning" %} Ist ein im CSS Code angegebener Schriftschnitt nicht als Webfont hinterlegt, simuliert ein Internet Browser (z.B. Safari, Chrome oder Firefox) diesen. D.h., die Typometrie ist willkürlich und sieht in jedem Browser anders aus. {% endhint %} ## Zuordnung von Namen und Werten | Wert | Deutsch | Englisch | | ---- | ------------ | ------------------------- | | 100 | fein | Thin (Hairline) | | 200 | extraleicht | Extra Light (Ultra Light) | | 300 | leicht | Light | | 400 | normal | Normal (Regular) | | 500 | medium | Medium | | 600 | halbfett | Semi Bold (Demi Bold) | | 700 | fett | Bold | | 800 | extrafett | Extra Bold (Ultra Bold) | | 900 | schwarz | Black (Heavy) | | 950 | extraschwarz | Extra Black (Ultra Black) | # Countdown / Notification Banner Countdown Banner für Angebote, Sales & Nachrichten | Banner für Hinweise, Nachrichten & Angebote # Close Button einrichten Ab Version 2.1.0 verfügen die Plugins über einen zusätzlichen Schließen-Button als Alternative zum Auf- / Zuklappen Button. Der Banner kann in den beiden Plugins in vier Kombinationen dargestellt werden. Dazu kann der Button Einklappbar (1) und Ausklappbar (2) und in den folgend aufgelisteten Kombinationen eingestellt werden: | Einklappbar (1) | Ausklappbar (2) | Darstellung | | --------------- | --------------- | ------------------------------------------------------------------ | | Aktiv | Inaktiv | Schließen Button, danach kein erneutes Öffnen | | Aktiv | Aktiv | Ein- / Ausklappen Button, erneutes Öffnen möglich | | Inaktiv | Inaktiv | Kein Button zur Interaktion des Kunden | | Inaktiv | Aktiv | Initial geschlossen Ein- / Ausklappen Button für Kundeninteraktion | ![Kombinationen der Einklappen und Ausklappen Funktion möglich](/files/-MMdi8tRwclZR7T0xT5i) Beispiele: ![Einklappbar, aber nicht ausklappbar](/files/-MMdktrkJfWUdgiL0D9M) ![Einklappbar & ausklappbar](/files/-MMdkxflLvgcgGB-swna) # Anpassen der Texte durch Textbausteine Gilt für: Countdown Banner ## Was sind Textbausteine / Snippets? Um die Übersetzung und die Anpassung von Texten in Templates zu vereinfachen benutzt Shopware **Textbausteine**, die im Template durch Twig-Variablen abgerufen werden. Somit müssen für Änderungen des Textes keine Anpassungen am Plugin vorgenommen werden. Diese können einfach über die Administration geändert werden. Die Texte für den **Countdown-Banner** sind als Textbausteine angelegt und können einfach über das Backend angepasst werden. Dazu kannst Du eine Phrase in die Suche der Textbausteine eingeben. Das Modul zur Pflege der Textbausteine des Shops befindet sich unter *Einstellungen > Shop (1) >Textbausteine (2)*. ![](/files/-MN4-Les6WUAQBttJkpQ) Im Textbaustein-Modul von Shopware 6 wähle nun die Sprache, in deren Übersetzung du Änderungen vornehmen möchtest über das **Kontextmenü (3)** aus. ![Über das Kontextmenü (3) gelangt man in die Übersetzungen](/files/-MN4-vdXEjGhPc6BYVr8) Über die Suchfunktion kannst Du nach der Phrase aus der Storefront **suchen (1)** und erhältst direkt Treffer in der unten stehenden Tabelle. In der linken Spalte steht der eindeutige technische Name des Textbausteins. In der Spalte BASE de-DE befindet sich der Inhalt. Über das **Kontextmenü (2)** des Snippets kannst Du dessen Inhalt mehrsprachig bearbeiten. ![Suche nach "Angebote" führt zu den richtigen Ergebnissen](/files/-MN4-C3O8meAeNY7Oej6) ### Alle Textbausteine / Snippets eines Plugins finden Durch die Eingabe des techischen Namens bzw. einer Phrase davon können so auch ganz einfach die übrigen Snippets des Plugins gefunden und über das Kontextmenü bearbeitet werden. ![](/files/-MN40QVpcpSHZQiWTJTP) # Mehrsprachigkeit > Verfügbar ab Plugin Version 2.2.0 ## Anleitung Navigiere zum Textbausteine Modul unter Einstellungen > Shop > Textbausteine. ![](/files/kxrdpW4wqQGSxh81Cmxk) Wähle im Bereich der Textbausteine das **Sprach-Set (1)** aus, welches die Übersetzung Deines Shops darstellt. In den meisten Fällen wird dies BASE en-GB für die englische Übersetzung sein. Über das Kontextmenü kann das Set **bearbeitet (2)** werden. ![](/files/mwHecnrc9CZhKCk0vufu) In der Plugin-Konfiguration findest Du einen **Hilfe-Eintrag (1)**, in welchem die **Phrase (2)** steht, welche im folgenden in den Textbausteinen gesucht werden kann. Diese unterscheidet sich von Plugin zu Plugin.
Nachrichten Banner Countdown Banner
Füge in der **Suchfunktion (1)** der Textbausteine die Phrase aus der Plugin-Konfiguration ein. Im Ergebnis-Listing der Textbausteine findest Du nun alle Einträge zum Plugin. Klicke in die jeweilige **Spalte (2)** um den Platzhalter `%placeholder%` gegen die Übersetzung auszutauschen. **Speichere (3)** den bearbeiteten Platzhalter. ![](/files/YhN4PXjj4uf3NubGDWAy) ![](/files/hM6VJM84Uhtx6jWNLBhi) {% hint style="info" %} Als **Trenner (4)** für die einzelnen Zeilen / Slides trage bitte ein Semikolon ein. {% endhint %} # Payment / Shipping Bar Payment-Icons / Zahlungs-Icons / Zahlungsarten | Versand-Icons / Versandarten / Shipping-Icons # Icon Tooltips einrichten Mit dem Plugin ist es Möglich bei Mouse-Over über der Zahlungsart einen Tooltip anzuzeigen. Dazu muss in der Konfiguration des Plugins die Funktion Grundeinstellungen > Tooltips aktiviert sein. Die Tooltips werden in der Administration von Shopware 6 im Bereich der Textbausteinen abgelegt: **"Einstellungen" > "Textbausteine"** Für jedes Icon findet sich dort ein Snippet, welches in allen installierten Sprachen gesetzt werden kann. Sobald der Textbaustein einen Inhalt besitzt, wird dieser als Tooltip im Frontend des Shops am entsprechenden Icon ausgegeben. Soll ein Tooltip nicht mehr angezeigt werden, kann der Wert des Tooltips gelöscht werden. Um die Textbausteine (Snippets) unter den vielen Bausteinen zu identifizieren, können in der Suche die Namen der Bausteine eingegeben werden: **Payment-Icons:** "zenit.payment.icon" oder auch "zenit.payment.icon.paypal" für Paypal Icons **Shipping-Icons:** "zenit.shipping.icon" oder auch "zenit.shipping.icon.dhl" für DHL Icons ![](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/9088749776/original/qyfJ3h7UnZCU42YZXpBTkLZGdCHY_z8Kyg.jpg?1571992476) # Payment Icons mit Shipping Icons kombinieren Optional kannst Du mit dem Plugin der Versandarten das Plugin Zahlungsarten / Payment-Icons um Versandartenicons erweitern, wenn das Plugin für die Anzeige von Zahlungsarten installiert ist. {% hint style="success" %} Die Versandicons werden dabei in das Zahlungsarten-Icons Plugin implementiert. {% endhint %} ## Problembeschreibung: Dabei kann es vorkommen, dass die Versandarten-Icons nicht dargestellt werden, obwohl alles korrekt eingestellt ist. Das liegt an der Laderreihenfolge der Plugins. Wird das Versandarten-Plugin vor dem Zahlungsarten-Plugin geladen, kennt es nicht den Block, in welchen es integriert werden soll. {% hint style="warning" %} Bisher gibt es noch keine Möglichkeit auf die Vererungs- oder Ladereihenfolge Einfluss zu nehmen: {% endhint %} Mehr Informationen zum Thema: {% embed url="" %} {% hint style="info" %} The order of the loaded plugins has changed. Before, the plugins has been sorted by the ID column. Because of the UUIDs stored here, the order was random and changed on every (re)installation of Shopware. **From now on, the plugins are loaded in the order of their installation date. So the first installed plugin is the first, which is initialised on kernel boot.** This is temporary solution, as this will not fully resolve dependencies problems between plugins. There are already tickets open, which have the goal to improve the whole plugin loading process. {% endhint %} ## Lösungsvorschlag Damit das möglich ist, muss das Plugin für die Versandarten **vor** dem Zahlungsarten-Plugin installiert werden. **Du hast das Zahlungsarten-Plugin bereits installiert?** Kein Problem. Du kannst das Zahlungsarten-Plugin deinstallieren, das Versandarten-Plugin installieren und danach das Zahlungsarten-Plugin wieder installieren. # Mehrsprachigkeit > Verfügbar ab Plugin Version 2.2.0 ## Anleitung Navigiere zum Textbausteine Modul unter Einstellungen > Shop > Textbausteine. ![](/files/kxrdpW4wqQGSxh81Cmxk) Wähle im Bereich der Textbausteine das **Sprach-Set (1)** aus, welches die Übersetzung Deines Shops darstellt. In den meisten Fällen wird dies BASE en-GB für die englische Übersetzung sein. Über das Kontextmenü kann das Set **bearbeitet (2)** werden. ![](/files/mwHecnrc9CZhKCk0vufu) In der Plugin-Konfiguration findest Du einen **Hilfe-Eintrag (1)**, in welchem die **Phrase (2)** steht, welche im folgenden in den Textbausteinen gesucht werden kann. Diese unterscheidet sich von Plugin zu Plugin. ![](/files/KmYlo1EPlbGoe0Mxrf1s) ![](/files/6drkeNoxl2kUobOFZgYY) Füge in der **Suchfunktion (1)** der Textbausteine die Phrase aus der Plugin-Konfiguration ein. Im Ergebnis-Listing der Textbausteine findest Du nun alle Einträge zum Plugin. Klicke in die jeweilige **Spalte (2)** um den Platzhalter `%placeholder%` gegen die Übersetzung auszutauschen. **Speichere (3)** den bearbeiteten Platzhalter. ![](/files/jZzu49YNc1v0UFcg5zYD) ![](/files/ik3B6Ac9j7EZPjJpLD2Z) # Individuelle Labels & Badges # Verwendung individueller Labels Es können bis zu drei individuelle Labels pro Produkt angezeigt werden. Individuelle Hinweise am Produkt lassen sich über individuelle Labels für jedes Produkt einzeln aber auch global für alle Produkte hinterlegen. ![](/files/-MN7psnkFQ7V94g923-y) ### Grundeinstellungen Öffne die Konfiguration der Erweiterung unter *Erweiterungen > Meine Erweiterungen > Individuelle Labels & Badges*. Im unteren Bereich kannst Du bis zu drei individuelle Labels konfigurieren. ![](/files/4vP4usSHTL9Uy2cfNylV) Setze das individuelle Label über die Einstellungen **Artikel-Listings (1)** und **Artikel-Detailseiten (2)** in den gewünschten Bereichen global aktiv. (Erst dann werden die im Produkt hinterlegten individuellen Informationen angezeigt.) Die **Farbe (5)** des Labels ist die Einstellung für den Hintergrund und ist erst nach erneutem Speichern und kompilieren des Themes sichtbar. Die Textfarbe des Labels wird automatisch berechnet. ### Globaler Inhalt Die Einstellung des **Standardtext (3) und** des **Tooltip (4)** dienen als globaler Inhalt, und werden an jedem Produkt ausgegeben, wenn in den Stammdaten des Produkts keine anderen Einstellungen getroffen wurden. {% hint style="info" %} Hinterlege in diesen Textbaustein-Feldern daher nur Inhalte, **wenn alle Produkte den selben Inhalt verwenden sollen** und Du diesen nur gezielt bei einzelnen Produkten deaktivieren oder durch einen anderen Inhalt ersetzen möchtest. {% endhint %} ### Einstellungen pro Produkt In den meisten Anwendungsfällen soll ein individuelles Label bestimmte Inhalte eines einzelnen Artikels anzeigen, wobei der Inhalt von Artikel zu Artikel variieren kann. Meistens erhalten nur einzelne Artikel gezielt ein Label. Über die *Kataloge > Produkte* wird dazu das Produkt gewählt, welches ein zusätzliches Label erhalten soll. Im unteren Bereich des *Tab: Spezifikationen* der Produkt-Stammdaten befinden sich die Zusatzfelder. Im Tab **Individuelle Labels** befindet sich die Konfiguration der individuellen Labels. ![](/files/4FqHIuk69aSu3AbXf0iT) Die Option **Deaktiviert (1)** ist sinnvoll, wenn die Mehrheit aller Artikel ein globales individuelles Label erhalten haben und es bei bestimmten Artikeln nicht angezeigt werden soll, siehe [Globaler Inhalt](#globaler-inhalt). Über die Eingabefelder für **Text (2)** und **Tooltip (3)** lassen sich Inhalt und Erläuterung in Form eines Tooltips pro Produkt hinterlegen und der globale Inhalt aus der Konfiguration der Erweiterung überschreiben. Die Felder **Hintergrundfarbe (4)** und **Textfarbe (5)** sind optional und bieten die Möglichkeit jedes Label individuell zu gestalten. Auf diese Weise können bis zu drei individuelle Labels pro Artikel gepflegt werden. # Hersteller im Listing # Darstellung CMS Elemente Derzeit gibt Shopware keine Informationen zum Hersteller in CMS-Elementen aus. Hierzu gibt es ein [Issue bei Shopware](https://issues.shopware.com/issues/NEXT-18890). # Preloader Bisher gibt es keine Artikel in diesem Bereich - das wird sich in Zukunft ändern, sodass wir bisher erhaltene Fragen oder Probleme hier auflisten werden. Solltest Du Fragen zur Erweiterung haben, eröffne bitte ein Support-Ticket über den Shopware Account. Wir nehmen uns der Sache gerne an. # Mitscrollender Warenkorb Bisher gibt es keine Artikel in diesem Bereich - das wird sich in Zukunft ändern, sodass wir bisher erhaltene Fragen oder Probleme hier auflisten werden. Solltest Du Fragen zur Erweiterung haben, eröffne bitte ein Support-Ticket über den Shopware Account. Wir nehmen uns der Sache gerne an. # Vererbung Plugin-Konfiguration ## Problembeschreibung {% embed url="" %} In der Plugin-Konfiguration gibt es häufig **Schalter (1)** zum Aktivieren oder Deaktivieren einer Funktion - sogenannte Bool / Switch. Ist dieser im **Verkaufskanal (2)** `Alle Verkaufskanäle` aktiv, besteht das Problem, dass abweichende Einstellungen in einem anderen Verkaufskanal diese default-true Einstellung nicht mehr überschreiben können. ![Der Switch ist "default-true"](/files/-MSm5m1zHYiM6WkY5IxZ) Wird nun ein **anderer Verkaufskanal (2)** gewählt kann der **Schalter (1)** auf inaktiv gestellt werden. Die Einstellung ist nach aktuellen Stand jedoch nicht in der Lage die default-true Einstellung aus `Alle Verkaufskanäle` zu überschreiben. ![](/files/-MSm6XVSchrpN7Sgg-n-) ## Lösungsvorschlag Einstellung für `Alle Verkaufskanäle` auf des Schalters auf **inaktiv** (bool = false) setzen und die Verkaufskanäle einzeln auf aktiv (bool = true) setzen. # Mehrsprachigkeit der Plugin-Konfiguration Plugin-Konfigurationen lassen sich zwar für jeden Verkaufskanal unterschiedlich einstellen - Übersetzungen für mehrsprachige Shops sind in Shopware 6 derzeit aber noch nicht möglich. ## Problembeschreibung {% embed url="" %} Altes Shopware Ticket NEXT-4749 {% endembed %} {% embed url="" %} Neues Shopware Ticket NEXT-16289 {% endembed %} #### Ist-Zustand * Plugin Konfigurationen pro Sales Channel definierbar * jeder Sales Channel kann mehrere Sprachen beinhalten * daraus ergibt sich, dass Konfigurationen nicht sprachabhängig gesetzt werden können Mit Shopware 4 und 5 war es immer gut gelöst, Konfigurationen pro Subshop setzen zu können, um Multi-Shop als auch Multi-Sprach Systeme konfigurieren zu können. Mit dem aktuellen Setup ist das leider nicht mehr möglich. Ohne eine Änderung von Shopware müssten wir nun Plugin Konfigurationen splitten, um sprachabhängige Daten im Shop konfigurieren zu können (Snippets). Diese wären dann aber auch "nur" sprachabhängig - nicht SalesChannels abhängig. #### Soll-Zustand Vorschlag * Sprach-Combobox neben der Verkaufskanal-Combobox innerhalb der Plugin Konfigurationen * Plugin Konfigurationen werden nicht nur pro Verkaufskanal, sondern auch pro Sprache gesetzt (nur Sprachen, die im Verkaufskanal definiert sind) * jede Art von Shop-Use-Case (Multi-Shop, Multi-Lingual, Multi-Shop-Multi-Lingual) können hier alle notwendigen Konfigurationen treffen, um wirklich passende und individuelle Einstellungen vornehmen zu können. * Erweiterung des SystemConfigService, um nicht nur Konfigurationen pro Saleschannel abzufragen, sondern auch pro Sprache (wahrscheinlich getSalesChannelContext()- >getContext()->getLanguageId())