Shopify-Shop-Beispiele

Website-Footer-Beispiele von 15 Shopify-Stores

Diese Website-Footer-Beispiele behandeln die Fragen, die nach dem Stöbern offenbleiben: Retouren, lokale Stores, Kontaktdaten und mehr. Sie schaffen Platz für diese Dinge neben Newslettern und Markeninformationen. Die Unterschiede liegen meist in der Gruppierung, den Labels und dem, was auf Mobilgeräten sichtbar bleibt.

15 Beispiele Zuletzt überprüft

Ritual

Vollständiger Screenshot wird geladen…

Ritual

Vollständiger Screenshot wird geladen…

Ritual

Regionen, Richtlinien und Produkt-Disclaimer

Ritual gruppiert Navigations-Links mit regionaler Auswahl, Zertifizierungssiegeln und Produkt-Disclaimern. Auf Mobile werden die Link-Gruppen zu Akkordeons. Mehrere Arten von Informationen teilen sich diesen Footer, weshalb eine klare Trennung wichtig ist: Man muss ein Store-Ziel, eine Richtlinie und einen Produkt-Disclaimer als unterschiedliche Dinge erkennen können.

Für deinen Shop

Gib praktischen Links und erklärenden Informationen klare, eigene Plätze.

Website besuchen

GSI Outdoors

Vollständiger Screenshot wird geladen…

GSI Outdoors

Shopping und Hilfe unter bekannten Labels

GSI Outdoors trennt Shopping-Links von Hilfe, mit Newsletter-Anmeldung und rechtlichen Links in der Nähe. Auf Mobile werden die Gruppen vertikal gestapelt. Die Labels nutzen vertraute Kundenservice-Begriffe und geben dem Ausrüstungskatalog am Ende der Seite ein unkompliziertes Verzeichnis.

Für deinen Shop

Nutze erkennbare Labels für häufige Support-Aufgaben.

Website besuchen

Heart Coffee Roasters

Vollständiger Screenshot wird geladen…

Heart Coffee Roasters

Café-Adressen und Karten-Links

Heart gibt Standorten einen ordentlichen Platz neben dem Menü und dem Newsletter. Adressen und Karten-Links verbinden den Onlineshop mit den Cafés. Die Desktop-Spalten werden auf Mobile untereinander angeordnet und halten so die Infos zur Store-Suche als eigenen, klar erkennbaren Bereich verfügbar.

Für deinen Shop

Gib physischen Standorten ihren eigenen, klar benannten Platz.

Website besuchen

TRNK

Vollständiger Screenshot wird geladen…

TRNK

Eine Zielgruppen-Frage neben der Newsletter-Anmeldung

TRNK fragt Newsletter-Besucher, ob sie aus dem Gewerbe (Trade) kommen. Diese Unterscheidung passt zu einem Design-Business, das Profis und Privatkunden bedient. Das Absenden wurde in der Studie nicht getestet. Das Feld lohnt sich nur, wenn die Antwort verändert, wie das Unternehmen später mit dem Abonnenten kommuniziert.

Für deinen Shop

Nutze Zielgruppen-Fragen für einen definierten Zweck in der späteren Kommunikation.

Website besuchen

Smith Teamaker

Vollständiger Screenshot wird geladen…

Smith Teamaker

Newsletter-Anmeldung in einem eigenen Block

Smith Teamaker trennt die Newsletter-Einladung von Links zu Unternehmen, Hilfe und Accounts. Die Bereiche werden auf Mobile gestapelt. Wer eine Antwort zur Lieferung sucht, kann zu den Link-Gruppen gehen, ohne durch das Anmeldeformular zu müssen, während die Einladung noch genug Platz hat, um sich zu erklären.

Für deinen Shop

Halte die Anmeldung optisch von wichtigen Hilfe-Links getrennt.

Website besuchen

Juniper Print Shop

Vollständiger Screenshot wird geladen…

Juniper Print Shop

Unternehmen, Bestellungen und Support

Juniper Print Shop gruppiert Footer-Links unter Unternehmen, Bestellungen und Support, zusammen mit Kontaktdaten und Social-Links. Auf Mobile öffnen Plus-Zeichen-Überschriften die Gruppen. Bestellungen und Support geben bestehenden Kunden klare Anlaufstellen nach dem Kauf, wofür in jedem ausgeklappten Bereich gut lesbare Abstände nötig sind.

Für deinen Shop

Organisiere Footer-Links für Aufgaben nach dem Kauf genauso wie fürs Browsen.

Website besuchen

Our Place

Vollständiger Screenshot wird geladen…

Our Place

Mobile Gruppen zeigen Plus- und Minus-Zustände

Our Place zeigt seine Footer-Links auf dem Desktop in Spalten und nutzt Plus- und Minus-Steuerelemente für die Mobile-Gruppen. Die Überschriften bleiben sichtbar, während die Links einklappen. Diese Steuerelemente brauchen Button-Semantik und einen angekündigten ausgeklappten Zustand, damit das Layout auch für Nutzer von Tastaturen und Assistenztechnologien funktioniert.

Für deinen Shop

Mache ausklappbare Footer-Überschriften zu barrierefreien Buttons mit klaren Zuständen.

Website besuchen

Jonathan Adler

Vollständiger Screenshot wird geladen…

Jonathan Adler

Store-Informationen und Währungsauswahl

Der Desktop-Footer von Jonathan Adler kombiniert Link-Spalten, Store-Informationen, Newsletter-Anmeldung und einen Währungsauswähler. Er deckt praktische Optionen sowohl für das Onlineshopping als auch für den physischen Einzelhandel ab. Das Akkordeon-Verhalten auf Mobile wurde nicht vollständig erfasst, daher stützt diese Referenz nur die Desktop-Organisation.

Für deinen Shop

Platziere Tools für Standort und Währung in der Nähe anderer praktischer Informationen.

Website besuchen

House of Spoils

Vollständiger Screenshot wird geladen…

House of Spoils

Ein Kunden-Zitat verlinkt zu weiteren Reviews

House of Spoils platziert ein Kundenzitat und einen Link zu weiteren Reviews neben der Footer-Navigation. Das Zitat fügt der Seite am Ende eine konkrete Erfahrung hinzu, und über den Link können Leser mehr Feedback ansehen. Das Review bleibt eine Kundenaussage; es sollte nicht als unabhängige Verifizierung dargestellt werden.

Für deinen Shop

Verlinke ausgewähltes Kundenfeedback zu den zugrundeliegenden Reviews.

Website besuchen

Allies of Skin

Vollständiger Screenshot wird geladen…

Allies of Skin

Vier klar getrennte Link-Gruppen

Allies of Skin nutzt Shop, Who We Are, Hilfe und Socials als Hauptgruppen im Footer, mit Service-Links darunter. Auf Mobile werden die Gruppen zu ausklappbaren Bereichen. Jede Überschrift liefert einen erkennbaren Grund, sie zu öffnen, und trennt so Shopping, Unternehmensinfos und Support.

Für deinen Shop

Gib jeder Link-Gruppe einen klaren und erkennbaren Zweck.

Website besuchen

Dinosaur Designs

Vollständiger Screenshot wird geladen…

Dinosaur Designs

Uhren für die Studio-Städte

Dinosaur Designs platziert Live-Uhren für seine internationalen Studio-Städte über dem Link-Grid. Das Detail schafft eine Verbindung zu echten Standorten des Unternehmens. Bewegliche Elemente dürfen praktische Links nicht schlechter lesbar machen; ein Store mit anderen Standort-Anforderungen könnte eine einfachere statische Lösung nutzen.

Für deinen Shop

Verbinde dekorative Details mit nützlichen Unternehmensinformationen.

Website besuchen

Olli Ella

Vollständiger Screenshot wird geladen…

Olli Ella

Ein E-Mail-Bereich über dem Link-Verzeichnis

Olli Ella platziert einen Bereich für die E-Mail-Anmeldung über den Footer-Links. Auf Mobile lassen sich die Link-Gruppen einzeln ausklappen. Die beiden Bereiche haben klare Grenzen, sodass man die optionale Einladung gut von der Navigation unterscheiden kann. Überprüfe sowohl offene als auch geschlossene Gruppen, um das schmale Layout vorhersehbar zu halten.

Für deinen Shop

Gib Marketing- und Support-Navigation separate Bereiche.

Website besuchen

Appointed

Vollständiger Screenshot wird geladen…

Appointed

Kontakt-E-Mails neben Shop und Hilfe

Appointed integriert Kontakt-E-Mails, Social-Links und eine Anmeldung neben dem Verzeichnis. Mobile Überschriften wie Shop und Hilfe klappen ihre Link-Gruppen aus. Eine sichtbare E-Mail-Adresse gibt jemandem, der unten angekommen ist, eine weitere Möglichkeit, eine Antwort zu bekommen. Sie sollte lesbar und einfach zu kopieren oder zu öffnen bleiben.

Für deinen Shop

Mache Kontaktdaten direkt aus dem Footer heraus nutzbar.

Website besuchen

Lemaire

Vollständiger Screenshot wird geladen…

Lemaire

Service-Informationen leiten zu praktischen Links

Lemaire beginnt den Footer mit Service-Informationen, gefolgt von der Newsletter-Anmeldung, Markenidentität und Link-Gruppen. Die Länder- und Sprachauswahl befindet sich bei diesen praktischen Tools. Die Reihenfolge zieht den visuellen Stil des Stores bis zu den Informationen durch, die Kunden nach dem Stöbern brauchen.

Für deinen Shop

Gib Service-Details und regionalen Einstellungen klare Positionen im Footer.

Website besuchen

Stumptown Coffee Roasters

Vollständiger Screenshot wird geladen…

Stumptown Coffee Roasters

Typografie unterscheidet Labels von Einladungen

Stumptown nutzt einen texturierten cremefarbenen Hintergrund und kontrastierende Schriftstile für Gruppen-Labels und größeren Shopping- oder Newsletter-Text. Die Typografie grenzt die Teile des Footers voneinander ab, während der Charakter des Stores erhalten bleibt. Kleine Service-Links müssen auch auf der Textur und neben Displayschriften gut lesbar bleiben.

Für deinen Shop

Nutze eine Typografie-Hierarchie, die kleine praktische Links lesbar hält.

Website besuchen

Beginne mit den Gründen, warum Kunden überhaupt das Ende der Seite erreichen. Juniper Print Shop nutzt „Company“, „Orders“ und „Support“, um Unternehmensinfos von Kauffragen zu trennen. Heart Coffee Roasters räumt Café-Standorten und Links zu Karten viel Platz ein. Appointed fügt gut sichtbare E-Mail-Adressen für den Kontakt ein, sodass Besucher einen direkten Weg haben, falls das Menü ihre Frage nicht beantwortet.

Welche Gruppen die richtigen sind, hängt von deinem Unternehmen ab. Ein physischer Einzelhändler braucht Filialinformationen; ein internationaler Shop benötigt vielleicht eine Länder- und Sprachauswahl, wie Lemaire zeigt. Gib diesen Elementen klare Bezeichnungen, bevor du eine weitere Kampagne oder eine Newsletter-Anmeldung hinzufügst. Kunden sollten auf Anhieb erkennen, wohin ein Link führt, ohne erst mehrere vage benannte Gruppen öffnen zu müssen.

Our Place und Juniper Print Shop ersetzen Desktop-Spalten durch aufklappbare mobile Gruppen. Ihre Überschriften bleiben sichtbar, weshalb diese Labels auf dem Smartphone mehr Verantwortung tragen: Wer nach den Rückgaberichtlinien sucht, muss wissen, welche Gruppe geöffnet werden muss. Prüfe den Text im aufgeklappten Zustand genauso sorgfältig wie in der kompakten, geschlossenen Ansicht.

Die Newsletter-Anmeldung kann von diesem Menü getrennt bleiben. Smith Teamaker und Olli Ella geben der Einladung einen eigenen Bereich, sodass Hilfe-Links verfügbar bleiben, ohne mit einem Formular interagieren zu müssen. Teste die Tastaturnavigation, die Ansage von geöffneten Zuständen für Screenreader und die Lesbarkeit von Utility-Texten. Ein Footer kann die Seite durch Akkordeons verkürzen, während Kontakt- und Bestellinformationen weiterhin leicht erreichbar bleiben.

Häufige Fragen

Welche Links gehören in einen Shopify-Footer?

Nimm Kontakt, Versand, Retouren, wichtige Richtlinien und relevante Konto- oder Store-Informationen auf. Kategorie- und Marken-Links können Besuchern auch helfen, einen anderen Weg durch die Website zu finden.

Wann sind mobile Akkordeons nützlich?

Sie können ein langes Menü verkürzen, wenn ihre Überschriften den Inhalt vorhersehbar machen. Halte essenzielle Hilfe sichtbar oder gib ihr ein unmissverständliches Gruppen-Label.

Wo sollte die Newsletter-Anmeldung platziert werden?

Gib ihr einen eigenen Bereich mit einer klaren Beschreibung der E-Mails. Besucher sollten Support- und Richtlinien-Links weiterhin erreichen können, ohne mit dem Formular interagieren zu müssen.

Sollte der Footer die Hauptnavigation wiederholen?

Er kann nützliche Shopping-Routen wiederholen, dient aber auch Kunden, die nach dem Stöbern nach Informationen suchen. Gib Support, Richtlinien und Kontaktdaten eigene Labels. Eine vollständige Kopie jedes Header-Links kann es erschweren, diese praktischen Ziele zu finden.

Setze die Änderung in deinem Theme um

Gib Fudge ein Ziel und eine Referenz. Das Tool schlägt Änderungen für deinen Shop vor, erstellt einen Entwurf in deinem Shopify-Theme und gibt dir Rückmeldung. Du überprüfst jede Änderung, bevor sie live geht.

Sieh dir an, wie der Shop-Editor funktioniert

Ähnliche Kollektionen

Alle Kollektionen