SEO Essentials (Shopware 6)
Steuere grundsätzliche SEO-Einstellungen mit unserem Plugin, um die Seitenladezeit Deines Shopware Shops zu verbessern und Werte bei Google Pagespeed Insights zu erhöhen.
Funktionalitäten
- Natives Lazy Loading ohne Javascript
- Lazy Loading der Bilder wird bei Pagespeed Insights erkannt und positiv bewertet
- Lazy Loading funktioniert auch, wenn Javascript deaktiviert ist
- HTML-Minifier
- Schriften vorladen (font-preloading)
- Canonical auf Elternartikel auf der Produkt-Detailseite
- Wenn ein Produkt im Listing ausgewählt wird, kann nun die URL des Elternartikels angezeigt werden
- Optional können Bilder vom Lazy Loading ausgeschlossen werden
Einstellungsmöglichkeiten / Konfiguration – SEO Essentials
SEO-Einstellungen
HTML-Minifier aktiv
Entscheide, ob der HTML-Minifier aktiv oder inaktiv sein soll.
Schriftarten vorladen aktiv
Entscheide, ob die Schriftarten vorgeladen werden sollen.
Schriftarten vorladen
Hier kannst Du die Schriftarten eintragen, die vorgeladen werden sollen.
Native Lazy-Loading-Einstellungen
<img loading="lazy"> aktiv
Entscheide, ob das Lazyloading aktiviert werden soll.
Lazy-Loading ausgeschlossen für Bilder mit Text im img-Tag
Bilder, die den hier angegebenen Text im img-Tag enthalten, werden vom Lazy-Loading ausgeschlossen. Dies können beispielsweise Klassen sein.
Produkt-SEO-Einstellungen
Canonical auf Elternartikel (Produkt-Detailseite)
Lege fest, ob die URL des Elternartikels als Canonical hinterlegt werden soll.
Von Listings zum Elternartikel verlinken
Lege fest, ob die URL des Elternartikels angezeigt werden soll anstelle der Varianten-URL.
Schriftarten vorladen
Für woff2
Füge die folgenden Zeilen ein:
<link rel="preload" as="font" href="/bundles/storefront/assets/font/Inter-Regular.woff2" type="font/woff2" crossorigin="anonymous">
<link rel="preload" as="font" href="/bundles/storefront/assets/font/Inter-SemiBold.woff2" type="font/woff2" crossorigin="anonymous">
<link rel="preload" as="font" href="/bundles/storefront/assets/font/Inter-Bold.woff2" type="font/woff2" crossorigin="anonymous">
<link rel="preload" as="font" href="/bundles/storefront/assets/font/Inter-Italic.woff2" type="font/woff2" crossorigin="anonymous">
Für woff
Füge die folgenden Zeilen ein:
<link rel="preload" as="font" href="/bundles/storefront/assets/font/Inter-Regular.woff" type="font/woff" crossorigin="anonymous">
<link rel="preload" as="font" href="/bundles/storefront/assets/font/Inter-SemiBold.woff" type="font/woff" crossorigin="anonymous">
<link rel="preload" as="font" href="/bundles/storefront/assets/font/Inter-Bold.woff" type="font/woff" crossorigin="anonymous">
<link rel="preload" as="font" href="/bundles/storefront/assets/font/Inter-Italic.woff" type="font/woff" crossorigin="anonymous">
Beispiel: Bilder vom Lazy-Loading ausschließen
In diesem Beispiel soll das Bild mit der Klasse klasse1 ausgeschlossen werden:
Von der Erweiterung wird im img-Tag der Bereich zwischen "
Nun kann klasse1 im Feld "Lazy-Loading ausgeschlossen für Bilder mit Text in img-Tag" eingeben werden. Da dies im Text enthalten ist, wird kein Lazy-Loading für dieses Bild angewendet.
Wichtig
Sollte es ein Bild geben, dass klasse1 enthält, wird dieses Bild ebenfalls vom Lazy-Loading ausgeschlossen, da der Text dann auch im Text des Bildes enthalten ist.
Installationsanleitung
- Installiere und aktiviere das Plugin.
- Konfiguriere das Plugin nach deinen Wünschen. Eine Anleitung, um Schriftarten vorzuladen, findest du im nächsten Abschnitt.
- Der Cache muss nun geleert werden.
- Fertig. Das Plugin ist einsatzbereit.