Shopware-Seiten eine eigene ID bzw. CSS-Klasse automatisch zuweisen Tutorial

06.08.19 08:00

Sie möchten jeder Shopware Kategorie und jeder Shopware Shopseite (Contentseite) eine eigene CSS Styles vergeben?

Kein Problem denn jede Shopware 5 Kategorie erhält beim anlegen eine eigen Kategorie ID.
Genauso verhält es sich mit den Shopseiten. Auch hier vergibt Shopware eine Shopseiten ID.
Dies haben wir uns zu nutzen gemacht und übertragen diese Kategorie ID und Shopseiten ID in den HTML Code des Shopware 5 Shopsystem.
In unserem Beispiel haben wir die Kategorie Lebensmittel angelegt und diese hat die ID 5 erhalten.
Diese ID findet Ihr im Shopware Backend unter Artikel > Kategorien > Lebensmittel (unsere Beispiel Kategorie).
Auf der rechten Seite steht unter Allgemeine Einstellungen - Kategorie: Lebensmittel (System-ID: 5).
Unserem Shopware Plugin "Style Editor Plus" legen nun für Sie in der Kategorie Lebensmittel ganz automatisch den
DIV Container <div class=”cat-5 “ an. Mit dieser individuellen Kategorie CSS Klasse kann man nun eigene Styles bestimmen.
Hier ein Beispiel für einen Farbverlauf als Hintergrund der nur in der Kategorie Lebensmittel angezeigt werden würde:

.cat-5 {
background: #fafafa;background: -webkit-linear-gradient(top,#e0daf7 250px,#fafafa 900px) no-repeat #fafafa;
background: linear-gradient(to bottom,#e0daf7 250px,#fafafa 900px) no-repeat #fafafa;
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=#e0daf7, endColorstr=#fafafa, GradientType=0 );
}

Das selbe gilt auch für Shopware "Shopseiten" wie zum Beispiel der Impressum Shopseite.

Auch hier wird ein automatischer DIV Container <div class="custom-3" (Beispielcode Impressum Shopseite) angelegt.
Ihr habt noch offene Fragen? Gerne sind wir für Euch da. Schreibt uns bitte an support@ultra-media.de oder nutzt unser Chat Tool der Webseite.
Tags: CSS Klasse Shopseite, CSS Klasse Kategorieseite, Shopware Seiten, Shopware Kategorien