> 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/styling/produkt/produkt-header.md).

# Produkt-Header

### Überlagernder Header

Der Header kann andere Elemente überlagern. Die globalen Einstellungen können in der Theme-Konfiguration voreingestellt und optional in den Kategorien für jedes Produkt abweichend gesetzt werden.

![](/files/t4Z77x5KfQq1TGyOR8Sx)

{% hint style="success" %}
**\[ ≡ ] Einstellung pro Produkt möglich**

Soll dieser Effekt auf den **überwiegenden** Produktseiten genutzt werden, können in der Theme-Konfiguration die [**globalen Einstellungen**](/content/kategorie/ueberlagernden-header.md#uberlagernder-header-1) getätigt werden.

Soll dieser Effekt gezielt auf nur **wenigen** Produktseiten genutzt werden, sollte die Konfiguration im [**jeweiligen Produkt**](/content/detailseite/produkt-header.md#konfiguration-pro-produkt) eingestellt werden.
{% endhint %}

Eine ausführliche Dokumentation findest Du unter:

{% content-ref url="/pages/qvzYbxc5EzPFFUPiXdnB" %}
[Produkt-Header](/content/detailseite/produkt-header.md)
{% endcontent-ref %}

### Header Kontrast

Diese Einstellung ist besonders effektvoll, wenn der Header überlagernd eingestellt wurde und die Hintergrundfarben des Headers in ihrer Deckkraft auf `0%`⁣ gestellt wurden.

<figure><img src="/files/2RtAwoX0TvEGYQ7342u5" alt=""><figcaption></figcaption></figure>

{% hint style="success" %}
**\[ ≡ ] Einstellung pro Produkt möglich**

Soll dieser Effekt auf den **überwiegenden** Produktseiten genutzt werden, können in der Theme-Konfiguration die [**globalen Einstellungen**](/content/kategorie/ueberlagernden-header.md#header-kontrast-1) getätigt werden.

Soll dieser Effekt gezielt auf nur **wenigen** Produktseiten genutzt werden, sollte die Konfiguration in der [**jeweiligen Kategorie**](/content/kategorie/ueberlagernden-header.md#header-kontrast) eingestellt werden.
{% endhint %}

Eine ausführliche Dokumentation findest Du unter:

{% content-ref url="/pages/qvzYbxc5EzPFFUPiXdnB" %}
[Produkt-Header](/content/detailseite/produkt-header.md)
{% endcontent-ref %}