1. Home
  2. Konfiguration
  3. Layout und Design
  4. Spezielle Stylesheets für spezielle Seiten in Zen Cart

Spezielle Stylesheets für spezielle Seiten in Zen Cart

Das Hauptstylesheet ist immer:
includes/templates/DEINTEMPLATE/css/stylesheet.css

DEINTEMPLATE steht dabei für das im Shop aktive Template, z.B. responsive_classic

Dieses Stylesheet wird auf ALLEN Seiten mitgeladen.

Zen Cart bringt ein mächtiges System mit, um sehr gezielt mit weiteren Stylesheets arbeiten zu können.

Generell gilt:

Alle css Dateien im Ordner includes/templates/DEINTEMPLATE/css/, die mit stylesheet beginnen, werden automatisch auf ALLEN Seiten mitgeladen.

Legt man also z.B. ein Stylesheet namens stylesheet_irgendwas.css in diesen Ordner wird es zusätzlich zum stylesheet.css mitgeladen.
Falls man also nicht alles in einem einzigen Stylesheet definieren will, und z.B. Farbdefinitionen in einem eigenen Sylesheet haben will, könnte man dazu ein Stylesheet namens stylesheet_colors.css verwenden

Spezielle Stylesheets für bestimmte Seiten

Um auf bestimmten Seiten spezifische Styleanweisungen zu verwenden, kann man eigene Stylesheets für Kategorien, Produkte, EZ Pages oder Define Pages verwenden.

Sie müssen in einer ganz bestimmten Art und Weise benannt werden und werden ebenfalls in den Ordner includes/templates/DEINTEMPLATE/css gelegt
Sie überschreiben dann die Anweisungen im Hauptstylesheet, wodurch es möglich wird, auf bestimmten Seiten Dinge anders anzuzeigen als auf den restlichen.

In diesen speziellen Stylesheets kann man also z.B. andere Headerhintergrundbilder definieren oder bestimmte Elemente ausblenden

Unterstützt werden:

1)
Stylesheets für bestimmte Kategorien


Benennung:

c_hauptkategorieID.css

c_hauptkategorieID_unterkategorieID.css

Beispiele:

c_5.css
Die Anweisungen in einem solchen Stylesheet werden nur auf der Kategorieseite mit der ID 5 geladen und bei allen Artikeln in der Kategorie mit der ID 5

c_5_17.css
Die Anweisungen in einem solchen Stylesheet werden nur auf der Kategorieseite mit der ID 17 (Unterkategorie von Hauptkategorie mit der ID 5) geladen und bei allen Artikeln in der Kategorie mit der ID 17

2)
Stylesheets für bestimmte Artikel


Benennung:

p_artikelID.css

Beispiel:

p_148.css
Die Anweisungen in einem solchen Stylesheet werden nur auf der Artikeldetailseite des Artikels mit der ID 148 geladen

3)
Stylesheets für spezielle Seiten


Im Ordener includes/modules/pages finden sich die Bezeichnungen für die diversen sonstigen Seiten in Zen Cart, z.B. login oder checkout_confirmation
All diese Seiten lassen sich mit eigenen Stylesheets ansprechen, die so heißen müssen wie die Seiten, also z.B.

checkout_confirmation.css
Die Anweisungen in einem solchen Stylesheet werden nur auf der Bestellbestätigungsseite geladen

login.css
Die Anweisungen in einem solchen Stylesheet werden nur auf der Loginseite geladen

shippinginfo.css
Die Anweisungen in einem solchen Stylesheet werden nur auf der Versandkostenseite geladen

4)
Stylesheets für EZ-Pages


Benennung:
page5.css

Also page und direkt dahinter ohne Underline die ID der EZ-Page

Die Anweisungen in einem solchen Stylesheet werden nur auf der EZ Page mit der ID 5 geladen

5)
Stylesheets für verschiedene Sprachen


Benennung:

Name der Sprache so wie in includes/languages underline stylesheet.css

Beispiele:

german_stylesheet.css
Die Anweisungen in einem solchen Stylesheet werden nur geladen, wenn der Shop auf deutsch geschaltet wird

english_stylesheet.css
Die Anweisungen in einem solchen Stylesheet werden nur geladen, wenn der Shop auf englisch geschaltet wird

6)
Stylesheet für die Startseite


Benennung:

index_home.css

Die Anweisungen in einem solchen Stylesheet werden nur auf der Shopstartseite geladen


Beitrags Info:

zuletzt aktualisiert am 13. Mai 2022 um 9:05

Beitrags Tags:


War dieser Beitrag hilfreich?

Weitere Beiträge zu diesem Thema