Das Widget "Versandarten" ist ein Widget mit welchem du die von dir angebotenen Versandarten mit Logos anzeigen lassen kannst.
Das Widget "Versandanbieter-Logos" kannst du in der Theme-Konfiguration konfigurieren.
Die Konfiguration findest du im Tab "Widgets".
Passe die Überschrift über den Textbaustein twt.widget.shipping.headline an.
Optional: Passe den Link der Logos über den Textbaustein twt.widget.shipping.link an.
Für individuelle Logos pflegst du Alt- und Title-Texte über twt.widget.shipping.customImage1–3.alt / .title (siehe Abschnitt "Barrierefreiheit").
Die eigentlichen Versandarten konfigurierst du in Shopware 6 über die entsprechende Verwaltung in den Shopware-Einstellungen ("Einstellungen" > "Shop").
Deine Logos für die entsprechenden Versandanbieter kannst du über die Versandarten-Verwaltung in den Shopware-Einstellungen hochladen.
Den Tooltip-Text (title-Attribut) kannst du über folgende Textbausteine pflegen:
twt.widget.shipping.customImage1.title
twt.widget.shipping.customImage2.title
twt.widget.shipping.customImage3.title
Der title wird beim Mouseover angezeigt, ist aber nicht barrierefrei relevant, da er von Screenreadern meist ignoriert wird.
Den alt-Text der Logos kannst du über folgende Textbausteine pflegen:
twt.widget.shipping.customImage1.alt
twt.widget.shipping.customImage2.alt
twt.widget.shipping.customImage3.alt
Beschriftung des Links: Als Text wird der title-Text des jeweiligen Logos verwendet, bei den automatisch ermittelten Versandart-Logos der Name der Versandart. Ein aria-label am Link wird nicht ausgegeben: Der versteckte Text ist gleichwertig, weil er als echter Textinhalt vorgelesen wird und zusätzlich von Übersetzungsfunktionen des Browsers erfasst wird.
Logos verlinken
Macht die Logos anklickbar; den Link hinterlegst du über den Textbaustein twt.widget.shipping.link.
Fallback-Badge anzeigen
Tab "Widgets" => Bereich "Versandanbieter-Logos"
Tab "Widgets" => Bereich "Versandanbieter-Logos" => Abschnitt "Basiskonfiguration" => Logos verlinken / Fallback-Badge anzeigen / Nur benutzerdefinierte Bilder anzeigen
Überschrift
twt.widget.shipping.headline
Link für Logos (optional)
Zeigt für Versandarten ohne hinterlegtes Logo stattdessen ein Text-Badge an.
Nur benutzerdefinierte Bilder anzeigen
Zeigt ausschließlich deine eigenen Logos statt der automatisch ermittelten Versandart-Logos.
twt.widget.shipping.link
Individuelle Logos
twt.widget.shipping.customImage1.alt
twt.widget.shipping.customImage1.title
twt.widget.shipping.customImage2.alt
twt.widget.shipping.customImage2.title
twt.widget.shipping.customImage3.alt
twt.widget.shipping.customImage3.title
Hinweis: Wie du Textbausteine bearbeitest erfährst du in folgender Anleitung: Texte bearbeiten und übersetzen
Tipp: Wirkt sich eine Änderung nicht auf die Storefront aus, leere einfach einmal den Shopware Cache: Shopware Cache leeren / aufwärmen
Tipp: In den kostenfreien ThemeWare® Utilities findest du ein Logo-Set mit 40 Pagespeed optimierten Grafiken für Versandanbieter.
Hinweis: Werden die Logos verlinkt, bleibt das alt-Attribut des Bildes leer (alt=""), weil das Bild dann nur "dekorativ" ist. Die Beschriftung übernimmt in diesem Fall ein visuell versteckter Text (<span class="visually-hidden">) innerhalb des Links.