> ## Documentation Index
> Fetch the complete documentation index at: https://docs.yourhomie.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# Styling

> Passe das Erscheinungsbild des Produktfragen-Widgets an, damit es sich in deinen Storefront einfügt.

Nachdem du Fragen generiert hast, kannst du das Widget so stylen, dass es sich auf deinen Produktseiten nativ anfühlt. Das Styling verwaltest du im Tab **Branding** im Bereich **KI-Produktfragen** deines Assistenten.

<Note>
  **Bevor du startest:** schließe die erste [Einrichtung](/de/user-guide/product-questions/setup) ab, damit eine Konfiguration existiert. Eine Live-Vorschau ist integriert, sodass du das Widget stylen kannst, ohne es vorher einzubetten. Bette das Widget ein, wenn du es auf deinem echten Storefront sehen möchtest.
</Note>

## Erscheinungsbild anpassen

<Steps>
  <Step title="Branding-Tab öffnen">
    Öffne deinen Assistenten, wähle **KI-Produktfragen** und wechsle zum Tab **Branding**.
  </Step>

  <Step title="Container stylen">
    Lege unter **Container** Hintergrundfarbe, Innenabstand, Eckenrundung, einen optionalen Rahmen und den Abstand zwischen den Fragen fest.
  </Step>

  <Step title="Buttons stylen">
    Lege unter **Buttons** Hintergrund- und Textfarbe, Schriftgröße und -stärke, Innenabstand, Eckenrundung und einen optionalen Rahmen fest. Die Schriftart wird automatisch von deiner Website übernommen, daher gibt es keine separate Schrifteinstellung.
  </Step>

  <Step title="Vorschau ansehen und speichern">
    Beobachte, wie sich die Live-Vorschau bei jeder Änderung aktualisiert, und klick dann auf **Speichern**.
  </Step>
</Steps>

<Note>
  Aktiviere **Button für eigene Frage**, um einen zusätzlichen Button "Frag etwas anderes" anzuzeigen, der den Chat für eine freie Frage öffnet. Lass **Button Style übernehmen** aktiviert, damit er zu deinen anderen Buttons passt, oder schalte es aus, um ihn separat zu stylen.
</Note>

<Check>
  Wenn Farben und Abstände des Widgets zu deinem Theme passen, fühlen sich die Fragen wie ein integrierter Teil der Seite an, nicht wie ein Aufsatz.
</Check>

## Styling-Tipps

<Tip>
  Stimme die Hintergrundfarbe der Buttons auf deine primäre Markenfarbe ab und halte Innenabstand und Abstand des Containers konsistent mit den umliegenden Seitenelementen, damit die Fragen als Teil deiner Produktseite wahrgenommen werden.
</Tip>

## Nächste Schritte

<CardGroup cols={2}>
  <Card title="Zurück zur Einrichtung" icon="wand-magic-sparkles" href="/de/user-guide/product-questions/setup">
    Generiere Fragen und bette das Widget auf deinen Produktseiten ein.
  </Card>

  <Card title="Produktfragen-Überblick" icon="circle-question" href="/de/user-guide/product-questions/overview">
    Erfahre, wie Produktfragen Shoppern helfen und die Conversion steigern.
  </Card>
</CardGroup>