Footer
Der Footer ist der Fußbereich Deines Onlineshops.
Footer
Farben
Neben den grundlegenden Farben kann dem Footer auch eine Rahmenfarbe (2) oben aktiviert (1) werden. Über die Innenabstände (3, 4) gibst Du den einzelnen Spalten im Footer einen zusätzlichen Abstand zum obern und unteren Rand des Footers.
Beispiele:
Inhalte
Inhalte Zuweisung
Bestimmte Inhalte können dem Footer zugewiesen werden. So kann beispielsweise ein zusätzliches Logo an verschiedenen Positionen im Footer ausgegeben werden oder auch eine Newsletter-Anmeldung.
Im Feld Footer Logo legst Du fest, wo und ob das zusätzliche Logo im Footer dargestellt werden soll. Das Logo kann ausgeblendet werden oder in der Newsletter Spalte, in der Hotline Spalte, in der Social Media Icons Spalte oder mit einer ganz eigenen Spalte versehen werden.
Die Hotline kann als Spalte angezeigt oder ausgeblendet werden.
Social Media Icons haben neben dem ausgeblendeten Modus die Bereiche als Footer Spalte oder im Footer Bottom Bereich.
Der Newsletter kann als Spalte angezeigt oder ausgeblendet werden. Ab Version 2.2.0 kann der Newsletter auch als eigenes Element über dem Footer
Einige Elemente lassen sich auch außerhalb der Footer Spalten darstellen, wie die Social Media Icons, die Newsletter-Anmeldung oder die Zahlungs- und Versandarten Icons.
Beispiele:
Spalten
Spalten Überschrift
Der Footer besteht aus verschiedenen Spalten, die einen Inhalt und eine Überschrift besitzen. Neben der Ausrichtung der Überschriften, kannst Du hier die Größe, Schriftstärke auswählen. Dabei steht Dir ebenfalls die Wahl der Schriftfamilie.
Die Option Aus- / Einklappen Icon (mobile) (1) bietet die Möglichkeit das Icon der mobilen Footerspalten zu verändern.
Über Aussehen (2) kann der Spalten Überschrift eine Unterlinie zugewiesen werden.
Beispiel:
Spalten Inhalte
Der Inhalt einer Spalte kann sehr unterschiedlich sein. Er kann die Navigationen aus dem Einstiegspunkt der Footer-Navigationen erhalten, Informationen zur Hotline, eine Newsletter-Anmeldung uvm.
Den Einstiegspunkt für die Footer-Navigation definierst Du in den Grundeinstellungen des Verkaufskanals.
Beispiel:
Spaltenbreiten
Ein Layout wird in einem sogenannten Grid aufgebaut. Man kann sich das vorstellen wie eine Tabelle mit 12 Spalten und beliebigen Zeilen. Wir nutzen ein solches Grid um die Breiten der Spalten im Footer zu kontrollieren.
Du kannst hier jedem Bereich eine Spaltenbreite zuordnen. Geht die Gesamtsumme der Breiten über 100% bzw. über 12 Spalten rutschen die Elemente automatisch in eine neue Zeile.
Die Spaltenbreiten werden für Tablet- und Desktop-Geräte definiert. Auf allen kleineren Geräten rutschen die Spalten untereinander.
Die Navigation Spalten Breite bezieht sich auf die automatisch generierten Footer-Navigations-Spalten. Jede Spalte erhält die eingestellte Breite.
Beispiel:
In unserem Beispiel hat der Newsletter eine Breite 6 von 12 (50%). Die Spalten Information und Service sind Navigationsspalten aus dem gewählten Einstiegspunkt der Footer-Navigationen. Jede erzeugte Spalte der Footer-Navigation hat 3 von 12 (25%) erhalten. Damit ist die erste Zeile mit 12 von 12 Spalten auf 100% gefüllt.
Die zweite Zeile besteht aus der Service Hotline mit 3 von 12 (25%), der Social Media Icons Spalte mit 4 von 12 (33,33333%) und der optionalen Custom Spalte mit ebenfalls 4 von 12 (33,33333%) Breite. In Summe ergibt das 11 von 12 Spalten, also 91,67%. Wir könnten also noch 1 von 12 (8,33333%) Spaltenbreiten auf eine Spalte verteilen, ohne dass eine neue Zeile begonnen würde.
Spaltensortierung
Die Sortierreihenfolge übernimmst Du durch Angabe einer Positionsnummer. Je höher die Zahl, desto weiter hinten wir die Spalte angezeigt.
Erlaubt sind hier Positionsnummer von 1 - 12.
Beispiel:
Spalten standardmäßig ausgeklappt (mobile)
Auf mobilen Geräten werden die einzelnen Footerspalten eingeklappt dargestellt. Der Besucher kann diese dann durch Klicken auf die Zeile ausklappen. Bei Bedarf können einzelne Spalten auch initial ausgeklappt dargestellt werden.
Beispiel:
Spalten Styling
Logo Spalte
Die Logo Spalte kann einen eigenen Hintergrund besitzen. Man kann zwar ein eigenes Logo für den Footer hochladen - doch kann der gewählte Footer Hintergrund störend sein.
Die vertikale Ausrichtung erlaubt es Dir das Logo in seinem Container auszurichten.
Beispiel:
Hotline Spalte
Für die Hotline Spalte können ebenfalls Anpassungen an dem Erscheinungsbild vorgenommen werden. Hier können neben einer abweichenden Hintergrundfarbe auch die Textfarben von der allgemeinen Footer Farbeinstellung verändert werden.
Social Media Icons Spalte
Für die Social Media Icons Spalte können ebenfalls Anpassungen an dem Erscheinungsbild vorgenommen werden. Hier können neben einer abweichenden Hintergrundfarbe auch die Textfarben von der allgemeinen Footer Farbeinstellung verändert werden.
Hinterlege die Verlinkungen zu den Social Media Kanälen in den Einstellungen des Themes. Mehr dazu findest Du im Abschnitt Social Media Icons.
Die Einstellungen gelten nur, wenn die Social Media Icons auch als Spalte dargestellt werden. Bei der Darstellung im Footer Bottom greifen die Farbeinstellungen des Footer Bottoms.
Newsletter Spalte
Neben den allgemeinen Spalten Farbeinstellungen solltest Du hier auch die Farben der Newsletter-Form einstellen. Mit Form wird das Input-Feld bezeichnet, in welches der Nutzer seine E-Mail Adresse eingibt.
Custom Spalte 1 - 3
Für die Optionalen Spalten oder auch Custom Spalte genannt, können ebenfalls Anpassungen an dem Erscheinungsbild vorgenommen werden. Hier können neben einer abweichenden Hintergrundfarbe auch die Textfarben von der allgemeinen Footer Farbeinstellung verändert werden.
Zahlungsarten
In der Zahlungsarten-Spalte können die Zahlungsarten-Icons aus Deiner Zahlungsarten-Konfiguration des Shops geladen werden.
Versandarten
In der Versand-Spalte können die Versandarten-Icons aus Deiner Versandarten-Konfiguration des Shops geladen werden.
Footer Bottom
Als Footer Bottom wird der untere Teil des Footers bezeichnet. In diesem werden die Hinweise zur Steuer, das Copyright und je nach Einstellung auch die Social Media Icons dargestellt.
Farben
Über die Farbeinstellungen kannst Du diesen Bereich optisch vom restlichen Footer trennen oder verbinden.
Beispiele:
Grundeinstellungen
Die Service-Navigation beinhaltet wichtige und oft rechtlich relevante Informationen, die auf keiner Shopseite fehlen dürfen. Die Service-Navigation des Shops wird daher an verschiedenen Stellen des Shops ausgegeben.
Im Kopfbereich der Seite kann die Service-Navigation im Bereich der Top Bar oder im Bereich der Offcanvas Top Bar angezeigt werden.
Zusätzlich findet man die Service-Navigation optional im unteren Footer, wo sie neben den Footer-Navigationen oft überflüssig wirkt. Über die Einstellung Service-Navigation anzeigen (1) kann die Service-Navigation im Footer Bottom deaktiviert werden.
Der Checkout Bereich beinhaltet zur Optimierung der Conversion ein ablenkungsfreies Layout mit Minimal Header und Minimal Footer. (Der Minimal Footer besteht praktisch lediglich auf dem Footer Bottom Bereich.)
Damit rechtlich relevante Inhalte hier nicht fehlen, wird die Service-Navigation im Checkout wieder im Footer Bottom dargestellt.
Last updated
