> For the complete documentation index, see [llms.txt](https://themedocs.zenit.design/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://themedocs.zenit.design/tutorials/individuelle-anpassungen.md).

# Individuelle Anpassungen

## Ein Child Theme anlegen

Mit einem Child-Theme ([Was ist ein Child-Theme?](/faq/ableitungen/child-theme.md#was-ist-ein-child-theme)) können individuelle Anpassungen updatesicher implementiert werden.

Mit unserem kostenlosen Plugin kannst Du dein Child-Theme generieren und personalisieren: 

{% embed url="<https://store.shopware.com/de/zenit66399665516f/child-theme-generator-fuer-zenit-design-themes.html>" %}

Alternativ kann ein Child-Theme auch manuell wie in der [Shopware Doku](https://docs.shopware.com/en/shopware-platform-dev-en/theme-guide/theme-create?category=shopware-platform-dev-en/theme-guide#creating-a-new-theme) beschrieben, erzeugt werden.

### Installation

Wenn Du ein Child-Theme mit unserem Child-Theme-Generator Plugin erstellst, kannst Du dieses direkt über "Erweiterungen" > "Meine Erweiterungen" 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.

```bash
# 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.

Unsere Themes sind Ableitungen des Shopware Default Themes. Den grundlegenden Aufbau findest Du daher im Theme der [Shopware Storefront](https://github.com/shopware/platform/tree/trunk/src/Storefront/Resources).

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

{% embed url="<https://developer.shopware.com/docs/guides/plugins/themes?category=shopware-platform-dev-en/theme-guide>" %}

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

{% embed url="<https://developer.shopware.com/docs/guides/plugins/themes/add-css-js-to-theme>" %}

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

{% embed url="<https://developer.shopware.com/docs/guides/plugins/plugins/storefront/customize-templates>" %}


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://themedocs.zenit.design/tutorials/individuelle-anpassungen.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.