# Footer

## Allgemeine Einstellungen

### Farben

Unter dieser Einstellung können Sie einen Linie am Anfang des Footer Bereiches setzen. Er ist unabhängig von den Elementen, welche als erstes im Footer auftauchen. Seine Bereite können Sie über die Einstellung: *Rahmenstärke* bestimmen.

Sie definieren in dieser Einstellung ob, die Linie angezeigt werden soll, wie Breit sie sein darf und welche Farbe sie bekommen soll.

<figure><img src="/files/TIJ6BaysaPHLDBt7HKvA" alt=""><figcaption><p>Beispiel: orange Linie vor Footer USP-Leiste</p></figcaption></figure>

## Footer USP-Leiste

Sie haben die Möglichkeit Ihre Alleinstellungsmerkmale (USP) als extra Leiste vor dem eigentlichen Footer anzeigen zu lassen. Im Gegensatz zu den USP in der [Top Bar (im Header Bereich)](/coolbax-docs/theme/theme-einstellungen/header.md#top-bar-usp-leiste) haben Sie die Möglichkeit einen weiteren&#x20;

<figure><img src="/files/cu5V7qNgY4rPrHJ7PKY1" alt=""><figcaption></figcaption></figure>

In den Einstellungen für dieses Features legen Sie fest: &#x20;

* Bestimmen Sie, auf welcher Seiten die Footer USP-Leiste angezeigt werden soll
* Die Inhalte und [Icons](#auswahl-der-icons)
* Eine Linie&#x20;
* Die Hintergrundfarbe für den gesamten Bereich der Footer USP-Leiste
* Die Schriftfarbe für die Überschrift sowie den Text unter der Headline

### Auswahl der Icons

Für jedes USP können Sie in eigenes Icon wählen. Nutzen Sie folgenden Link um ein passendes Icon zu finden:

{% embed url="<https://demo-6.coolbax.com/cbax/readicon/index>" %}

Suchen Sie sich dort ein passendes Icon aus und kopieren Sie den Namen des Icons. Diesen fügen Sie anschließend in das Feld: *Icon 1-4* ein.

## Spalten

Sie haben hier die Möglichkeit, die Sortierung der Spalteninhalte wie: Newsletter, Sozial Media, Zahlungsarten usw\.. individuell zu sortieren, neue Zeilen mit eigenem Inhalt einzufügen und die Darstellung festzulegen

### Spalten Sortierung

Mit Hilfe von Zahlenangaben (1 bis 10) können Sie die Reihenfolge der Spaltendarstellung bestimmen.&#x20;

{% hint style="warning" %}
Bei den Spalten: [Newsletter](#newsletter), [Social Media](#social-media), [Zahlungsart](#zahlungsart) und [Versandart](#versandarten) müssen folgende Einstellung hinterlegt sein, damit Sie in der Spalte ausgegeben werden:

* Aktiv = ja
* Position = In extra Spalte im Footer
  {% endhint %}

<figure><img src="/files/FuCOmpMXMNvqE9agkdH0" alt=""><figcaption><p>Beispiel aller möglichen Spalten und deren Anordung</p></figcaption></figure>

**Beispiel für die Anordnung der Spalten:**

* 1 = Zahlungsarten
* 2 = Newsletter
* 3 = Versandarten
* 4 = Service Hotline
* 5 = Navigation
* 6 = Social Media

### Spalten Breite

Wenn Sie die Position der Spalten bestimmt haben, können Sie danach die Breite der einzelnen Spalten festlegen. Zur Auswahl stehen: 25%, 33%, 50%, 75% und 100%.&#x20;

{% hint style="info" %}
Je mehr Platz die einzelnen Spalten erhalten, je mehr Zeilen müssen für die Darstellung bereitgestellt werden und Ihr Footer wird größer bzw. länger.
{% endhint %}

### Weitere Zeilen

Hier haben Sie die Möglichkeit ihren Footer auf bis zu vier Zeilen zu erweitern. Die zusätzlichen Zeilen werden unter der Standard Zeile von Shopware ausgegeben.

<figure><img src="/files/fEEz5Nn3MCBgkrMqYLKn" alt=""><figcaption><p>Beispiel einer zusätzlicher Zeile unter der Standard Zeile von Shopware</p></figcaption></figure>

Für jede Zeile, welche Sie nutzen möchten, wählen Sie ein Template aus. Über die Textbausteine können Sie die Spalten mit Inhalt füllen.

Sie haben 8 Optionen unter denen Sie auswählen können. Von 1 bis zu 4 Spalten können in einer Zeile ausgegeben werden. Hierbei gibt es unterschiedliche Aufteilungen, was die Spaltenbreiten betrifft.

{% hint style="info" %}
Jedes Template sollte nur einmal genutzt werden, da die Inhalte ansonsten doppelt im Footer auftauchen.
{% endhint %}

#### Aufteilung der Spalten:&#x20;

In der nachfolgenden Abbildung finden Sie alle möglich Kombinationen, wie die Spalten in einer Zeile aufgeteilt werden können:

<figure><img src="/files/Vmn5A8VK24OynLq1VV3f" alt=""><figcaption><p>Mögliche Spaltenaufteilungen im Überblick</p></figcaption></figure>

### Spalten mit Inhalt befüllen

Die Inhalte pflegen Sie über Textbausteine. Diese finden Sie unter: *Einstellungen >  Textbausteine > Textbaustein-Set wählen.* Geben Sie danach den Namen oder den Inhalt (falls dieser bereits gefüllt ist) ein.

In der nachfolgenden Tabelle werden alle Namen der Textbausteine aufgeführt. Sie sind unterteilt in Headline und Inhalt.

| Layout                                | Headline                                  | Inhalt                                      |
| ------------------------------------- | ----------------------------------------- | ------------------------------------------- |
| Template 1 Box (100%)                 | cbaxTheme.footer.template.titleNineOne    | cbaxTheme.footer.template.contentNineOne    |
| Template 2 Boxen (25%, 75%)           | cbaxTheme.footer.template.titleEightOne   | cbaxTheme.footer.template.contentEightOne   |
|                                       | cbaxTheme.footer.template.titleEightTwo   | cbaxTheme.footer.template.contentEightTwo   |
| Template 2 Boxen (75%, 25%)           | cbaxTheme.footer.template.titleSevenOne   | cbaxTheme.footer.template.contentSevenOne   |
|                                       | cbaxTheme.footer.template.titleSevenTwo   | cbaxTheme.footer.template.contentSevenTwo   |
| Template 2 Boxen (50%, 50%)           | cbaxTheme.footer.template.titleSixOne     | cbaxTheme.footer.template.contentSixOne     |
|                                       | cbaxTheme.footer.template.titleSixTwo     | cbaxTheme.footer.template.contentSixTwo     |
| Template 3 Boxen (25%, 50%, 25%)      | cbaxTheme.footer.template.titleFiveOne    | cbaxTheme.footer.template.contentFiveOne    |
|                                       | cbaxTheme.footer.template.titleFiveTwo    | cbaxTheme.footer.template.contentFiveTwo    |
|                                       | cbaxTheme.footer.template.titleFiveThree  | cbaxTheme.footer.template.contentFiveThree  |
| Template 3 Boxen (25%, 25%, 50%)      | cbaxTheme.footer.template.titleFourOne    | cbaxTheme.footer.template.contentFourOne    |
|                                       | cbaxTheme.footer.template.titleFourTwo    | cbaxTheme.footer.template.contentFourTwo    |
|                                       | cbaxTheme.footer.template.titleFourThree  | cbaxTheme.footer.template.contentFourThree  |
| Template 3 Boxen (50%, 25%, 25%)      | cbaxTheme.footer.template.titleThreeOne   | cbaxTheme.footer.template.contentThreeOne   |
|                                       | cbaxTheme.footer.template.titleThreeTwo   | cbaxTheme.footer.template.contentThreeTwo   |
|                                       | cbaxTheme.footer.template.titleThreeThree | cbaxTheme.footer.template.contentThreeThree |
| Template 4 Boxen (25%, 25%, 25%, 25%) | cbaxTheme.footer.template.titleTwoOne     | cbaxTheme.footer.template.contentTwoOne     |
|                                       | cbaxTheme.footer.template.titleTwoTwo     | cbaxTheme.footer.template.contentTwoTwo     |
|                                       | cbaxTheme.footer.template.titleTwoThree   | cbaxTheme.footer.template.contentTwoThree   |
|                                       | cbaxTheme.footer.template.titleTwoFour    | cbaxTheme.footer.template.contentTwoFour    |

### Farbeinstellungen

Folgende farbliche Anpassungen können Sie noch für den gesamten Footer Bereich vornehmen. Es spielt hierbei keine Rolle, ob Sie zusätzliche Zeilen nutzen oder nicht.

<figure><img src="/files/RsXzifMPjqTvVFIWcyML" alt=""><figcaption></figcaption></figure>

#### Einstellungen

Unter dieser Einstellung legen Sie nicht nur das Layout für die Zeilen fest, sondern definieren auch die **Hintergrundfarbe (3)** für den gesamten Bereich.

#### Headline

Die ersten Einstellungen beziehen sich auf alle die Überschriften in den Spalten.

* **1) Schriftgröße:** Wählen Sie die Größe der Schrift aus. Die Angaben erfolgen in Pixel.
* **1) Schriftstärke:** Definieren Sie die Schriftstärke (dünn, normal oder fett) für die Überschriften.
* **1) Text Transform:** Sie können diese Überschriften nur in Großbuchstaben bzw. nur in Kleinbuchstaben anzeigen lassen.
* **1) Schriftfarbe:** Bestimmen Sie die Farbe der Headline

#### Inhalt

Im Bereich Inhalt definieren Sie die Typografie für die Inhalte in den Spalten. Sie werden unter den Überschriften ausgegeben. Sie gelten für Navigationspunkte sowie für Texte

* **2) Schriftgröße:** Hier ist die Hintergrundfarbe der gesamten Bereich des Footer gemein.
* **2) Schriftstärke:** Definieren Sie die Schriftstärke (dünn, normal oder fett) für die Texte.
* **2) Schriftfarbe:** Hier definieren Sie alle Textfarben im Footer.&#x20;

{% hint style="info" %}
Die Schriftfarbe für Social Media Icons werden in den Einstellungen: [Social Media](#social-media) gepflegt
{% endhint %}

## Newsletter

Hier können Sie die Newsletter Anmeldung im Footer aktivieren und ein Icon zuweisen.

### Position

Für die Position der Newsletter Anmeldung haben Sie zwei Optionen:

#### In extra Spalte im Footer

Hier wird die Newsletter mittig in den Footer integriert. Sie nimmt dort zwei Spalten ein und positioniert sich nach der Spalte: Service Hotline.&#x20;

<figure><img src="/files/xYRvtV04UhyFydMHXzWJ" alt=""><figcaption><p>Newsletter Anmeldung "in extra Spalte im Footer"</p></figcaption></figure>

#### Über dem Footer

Bei dieser Option wird die Newsletter Anmeldung über dem Footer angezeigt. Sie nimmt die gesamtet Breite ein.

<figure><img src="/files/MHQeQV63cGFnRKTgu378" alt=""><figcaption><p>Newsletter Anmeldung "über dem Footer" und vor der Footer USP-Leiste</p></figcaption></figure>

In den Einstellungen für dieses Features legen Sie zudem fest: &#x20;

* Das [Icon ](#auswahl-des-icon)für den Button (am Ende der Eingabeleiste)
* Die Hintergrundfarbe für den gesamten Bereich der Newsletter Anmeldung
* Die Schriftfarbe für die Überschrift sowie den Hinweis für die Datenschutzbestimmung und AGB

### Auswahl des Icon

Für den Button können Sie in eigenes Icon wählen.  Nutzen Sie folgenden Link um ein passendes Icon zu finden:

{% embed url="<https://demo-6.coolbax.com/cbax/readicon/index>" %}

Suchen Sie sich dort ein passendes Icon aus und kopieren Sie den Namen des Icons. Diesen fügen Sie anschließend in das Feld: *Icon 1-4* ein.

## Service Hotline

Die Darstellung der Spalte: Service Hotline können individuell gestalten

<figure><img src="/files/dGc1V1Y0jLMe6PkVQ3Ov" alt=""><figcaption><p>Beispiel für die Darstellung einer veränderten Service Hotline Spalte</p></figcaption></figure>

Folgende Einstellungen können getroffen werden:

* Aktiv oder deaktiv Schaltung der Spalte Service Hotline
* Die Hintergrundfarbe für den Bereich der Service Hotline
* Farbe des Unterstrich unter der Headline
* Die Schriftfarbe für die Überschrift sowie den Text unter der Headline

## Social Media

In den Social Media Bereich können Sie Ihre Facebook, Twitter und co. Links präsentieren. Für eine bessere Sichtbarkeit im Footer haben Sie die Möglichkeit, am Ende der Einstellungen, eine eigene Schriftfarbe und Hintergrundfarbe zu definieren, welche für den Namen sowie das Logo des Socal Media Accounts genutzt wird.

{% hint style="warning" %}
Die Icons werden erst im Frontend angezeigt, wenn ein Link hinterlegt ist.
{% endhint %}

### Icon Style

Für die Darstellung der Icons haben Sie vier Möglichkeiten:  abgerundet, eckig, rund oder Standard.

<div><figure><img src="/files/YChoL4qzDZNpSR2H5mOG" alt=""><figcaption><p>abgerundet</p></figcaption></figure> <figure><img src="/files/3aEfoNxeBoFiRa1V3x7F" alt=""><figcaption><p>eckig</p></figcaption></figure> <figure><img src="/files/PZpiu7t7lygFHxkV6zWL" alt=""><figcaption><p>rund</p></figcaption></figure> <figure><img src="/files/S2yVNFRVqoxSK0gPnez0" alt=""><figcaption><p>Standard</p></figcaption></figure></div>

### Position

Sie haben zwei mögliche Positionen zur Ausgabe der Social-Media-Kanäle.

#### In extra Spalte im Footer

Bei dieser Option werden die Kanäle in einer extra Spalte angezeigt. Die Position der Spalte kann unter: [*Spalten > Spalten Sortierung*](#spalten-sortierung) festgelegt werden.

<figure><img src="/files/h26SMoEI8S15abUoWXSK" alt=""><figcaption><p>Sozial-Media-Kanäle  "in extra Spalte im Footer"</p></figcaption></figure>

#### In extra Zeile im Footer

Bei dieser Einstellung werden die Icons im Bereich Footer Hinweis dargestellt. Sie befinden sich unter der Service Navigation (falls vorhanden), ansonsten unter dem Preishinweis bezüglich der Mehrwertsteuer.

<figure><img src="/files/JPwAnQ4AiWwFdByTVKpe" alt=""><figcaption><p>Sozial-Media-Kanäle  "in extra Zeile im Footer"</p></figcaption></figure>

### Bezeichnung

Zusätzlich zur Einblendung der Icons haben Sie die Möglichkeit den Namen des Sozial Media Kanals neben dem Icon einblenden zu lassen.

<figure><img src="/files/d6wHKxCqchvivRGbIWb9" alt=""><figcaption><p>Beispiel für Icon mit Bezeichnung</p></figcaption></figure>

## Zahlungsart

Ab der Plugin Version 3.2.0 für Shopware 6.5 bzw. Version 4.10 für Shopware 6.6 werden die hinterlegten Icons von den Einstellungen der Zahlungsarten angezeigt: *Einstellungen > Shop > Zahlungsarten*.

Im Handbuch von Shopware erfahren Sie, wie Sie Zahlungsarten anlegen:

{% embed url="<https://docs.shopware.com/de/shopware-6-de/einstellungen/Zahlungsarten>" %}
Shopware Handbuch zur Anlage von Zahlungsarten
{% endembed %}

{% hint style="info" %}
Eine Auswahl an Icons finden Sie auf unser Übersichtsseite:[ Zahlungs- und Versandarten](https://www.coolbax.de/theme-6-versand-zahlung-icon)

Die hier hinterlegten Icons können Sie für die Themes von Coolbax nutzen.
{% endhint %}

### Position

Sie haben zwei mögliche Positionen zur Ausgabe der Icons der Zahlungsarten .

#### In extra Spalte im Footer

Bei dieser Option werden die Icons in einer extra Spalte angezeigt. Die Position der Spalte kann unter: [*Spalten > Spalten Sortierung*](#spalten-sortierung) festgelegt werden.

<figure><img src="/files/Cy9jspne6w09ErVmiduP" alt=""><figcaption><p>Beispiel für die Darstellung: In extra Spalte im Footer</p></figcaption></figure>

#### In extra Zeile im Footer

Bei dieser Einstellung werden die Icons im Footer nach den Spalten ausgegeben.

<figure><img src="/files/C6wuSxo30ykmqATyB47c" alt=""><figcaption><p>Beispiel für die Darstellung: In extra Zeile im Footer</p></figcaption></figure>

{% hint style="info" %}
Haben Zahlungs- und Versandarten die Positionsangaben: *In extra Zeile im Footer* werden alle Icons nacheinander in einer Zeile ausgegeben.
{% endhint %}

### Farbe

Folgende Farbeinstellungen können getroffen werden:

* Die Hintergrundfarbe für den Bereich der Zahlungarten

{% hint style="warning" %}
Ist bei den Positionsangaben, für Zahlungs- und Versandarten, die Position: *In extra Zeile im Footer* hinterlegt, wird die hinterlegte Hintergrundfarbe der Zahlungsart genutzt
{% endhint %}

* Farbe des Unterstrich unter der Headline (wenn die Icons in einer Spalte ausgegeben werden)
* Die Schriftfarbe für die Überschrift sowie den Text unter der Headline (wenn die Icons in einer Spalte ausgegeben werden)

## Versandarten

Ab der Plugin Version 3.2.0 für Shopware 6.5 bzw. Version 4.10 für Shopware 6.6 werden die hinterlegten Icons von den Einstellungen der Versandarten angezeigt: *Einstellungen > Shop > Versand*

Im Handbuch von Shopware erfahren Sie, wie Sie Versandarten anlegen:

{% embed url="<https://docs.shopware.com/de/shopware-6-de/einstellungen/versand>" %}
Shopware Handbuch zur Anlage von Versandarten
{% endembed %}

{% hint style="info" %}
Eine Auswahl an Icons finden Sie auf unser Übersichtsseite:[ Zahlungs- und Versandarten](https://www.coolbax.de/theme-6-versand-zahlung-icon)

Die hier hinterlegten Icons können Sie für die Themes von Coolbax nutzen.
{% endhint %}

### Position

Sie haben zwei mögliche Positionen zur Ausgabe der Icons der Versandarten.

#### In extra Spalte im Footer

Bei dieser Option werden die Icons in einer extra Spalte angezeigt. Die Position der Spalte kann unter: [*Spalten > Spalten Sortierung*](#spalten-sortierung) festgelegt werden.

<figure><img src="/files/uj9pUg5YUqeMISb5W4uC" alt=""><figcaption><p>Beispiel für die Darstellung: In extra Spalte im Footer</p></figcaption></figure>

#### In extra Zeile im Footer

Bei dieser Einstellung werden die Icons im Footer nach den Spalten ausgegeben.

<figure><img src="/files/C6wuSxo30ykmqATyB47c" alt=""><figcaption><p>Beispiel für die Darstellung: In extra Zeile im Footer</p></figcaption></figure>

{% hint style="info" %}
Haben Zahlungs- und Versandarten die Positionsangaben: *In extra Zeile im Footer* werden alle Icons nacheinander in einer Zeile ausgegeben.
{% endhint %}

### Farbe

Folgende Farbeinstellungen können getroffen werden:

* Die Hintergrundfarbe für den Bereich der Versand

{% hint style="warning" %}
Ist bei den Positionsangaben, für Zahlungs- und Versandarten, die Position: *In extra Zeile im Footer* hinterlegt, wird die hinterlegte Hintergrundfarbe der Zahlungsart genutzt
{% endhint %}

* Farbe des Unterstrich unter der Headline (wenn die Icons in einer Spalte ausgegeben werden)
* Die Schriftfarbe für die Überschrift sowie den Text unter der Headline (wenn die Icons in einer Spalte ausgegeben werden)

## Hinweise

Der Bereich Footer Hinweis ist der Bereich, in dem sich die Informationen zu den Preisen sowie der Hinweis zur Realisierung der Webseite befinden. Zusätzlich können hier die Service-Navigation oder die [Social-Media-Kanäle](#social-media) angezeigt werden.

<figure><img src="/files/yfiXvAXEViHp2lMtAPRg" alt=""><figcaption><p>Beispiel für die Einstellung bei: Hinweise </p></figcaption></figure>

* **1) Schriftfarbe:** Definieren Sie hier die Farbe der Schrift sowie die Links der Service-Navigation (wenn vorhanden). Links, welche vom System gesetzt werden (z. B. Versandkosten) erhalten die Primärfarbe, welche bei [Typografie & Farben > Theme-Farben](/coolbax-docs/theme/theme-einstellungen/typografie-and-farben.md#theme-farben) eingestellt wurde
* **2) Hintergrundfarbe:** Hier ist die Hintergrundfarbe der gesamten Bereich des Footer Hinweis gemein.

{% hint style="info" %}
Der Hinweis zur Realisierung der Webseite ist ein Textbaustein und kann geändert werden. Der Name des Textbaustein lautet: *cbaxTheme.footer.copyright.title*
{% endhint %}

## Hinweise im Checkout

Auch wenn diese Einstellung der vorherigen sehr ähnelt, ist hier nur der Ceckout Bereich gemeint! Es betrifft alle Schritte, im Kassenbereich (ausgeschlossen der Warenkorb).

<figure><img src="/files/bscEdhGbR1aAqNvPSL7e" alt=""><figcaption><p>Beispiel für die Einstellung bei: Hinweise im Checkout</p></figcaption></figure>

* **1) Schriftfarbe:** Definieren Sie hier die Farbe der Schrift sowie die Links der Service-Navigation (wenn vorhanden). Links, welche vom System gesetzt werden (z. B. Versandkosten) erhalten die Primärfarbe, welche bei [Typografie & Farben > Theme-Farben](/coolbax-docs/theme/theme-einstellungen/typografie-and-farben.md#theme-farben) eingestellt wurde
* **2) Hintergrundfarbe:** Hier ist die Hintergrundfarbe der gesamten Bereich des Footer Hinweis gemein.


---

# Agent Instructions: 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://coolbax.gitbook.io/coolbax-docs/theme/theme-einstellungen/footer.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.