Individuelle Anpassungen

Bei Anpassungen, welche über die Möglichkeiten einer Konfiguration hinausgehen, können unsere Themes natürlich updatesicher individualisiert werden.

Ein Child Theme anlegen

Mit einem Child-Theme () können individuelle Anpassungen updatesicher implementiert werden.

Du findest auf unserer Website.

Einfacher ist es jedoch, wenn Du dafür unser zum Generieren und Personalisieren des Child-Themes verwendest.

Alternativ kann ein Child-Theme auch manuell wie in der beschrieben, erzeugt werden.

Installation

Wenn Du eines unserer Child-Themes verwendest, kannst Du dieses unter Erweiterungen > Meine Erweiterungen über den Button Erweiterung hochladen hochladen und wie jede andere Erweiterung installieren und aktivieren.

Theme zuweisen

Das Child-Theme muss nun noch dem Verkaufskanal zugewiesen werden.

Anpassungen vornehmen

Nachdem das Child-Theme installiert ist, kann es auch schon losgehen. Navigiere in den Theme-Ordner, dort solltest Du folgende Struktur vorfinden. {MyTheme} steht hier stellvertretend für den gewählten Theme-Namen.

# move into your theme folder
$ cd custom/plugins/{MyTheme}

# structure of theme
├── composer.json
└── src
    ├── MyTheme.php
    └── Resources
        ├── app
        │   └── storefront
        │       ├── dist
        │       │   └── storefront
        │       │       └── js
        │       │           └── my-theme.js
        │       └── src
        │           ├── assets
        │           ├── main.js
        │           └── scss
        │               ├── base.scss
        │               └── overrides.scss
        ├── views
        │   └── storefront
        └── theme.json

Twig-Templates: {Root}/custom/plugin/{MyTheme}/src/Resources/views/storefront/ SCSS: {Root}/custom/plugin/{MyTheme}/src/Resources/app/storefront/src/scss/ Javascript: {Root}/custom/plugin/{MyTheme}/src/Resources/app/storefront/src/script/

Aufbau

Da Original-Dateien niemals bearbeitet oder überschrieben werden dürfen, ist es notwendig in die Struktur der Dateien zu sehen um diese erweitern oder überschreiben zu können.

Den Aufbau unserer Themes als Ableitung der Shopware Storefront findest Du unter:

Twig-Templates: {Root}/custom/plugin/zenitPlatform{Theme}/src/Resources/views/storefront/ SCSS: {Root}/custom/plugin/zenitPlatform{Theme}/src/Resources/app/storefront/src/scss/ Javascript: Root}/custom/plugin/zenitPlatform{Theme}/src/Resources/app/storefront/src/script/

Anleitungen

Für die Bearbeitung von Styles solltest Du dich maßgeblich an die Shopware Doku halten:

Alles Notwendige zum Bearbeiten der Twig-Templates findest Du hier:

Last updated 6 months ago

Was this helpful?