FreeTheme Essentials ist dein kostenloses Zusatzpaket mit professionellen Ressourcen und Tools, die FreeTheme One perfekt ergänzen. Premium-Qualität ohne Kosten – exklusiv für FreeTheme One Nutzer!

Was ist enthalten?

• Import Plugin für Storytelling-Elemente

  • Fertige Erlebniswelten zum direkten Import – professionelle Layouts, die sofort einsatzbereit sind.

• Logo-Set mit 100+ optimierten Logos

  • Bekannte Marken- und Zahlungsanbieter-Logos, pagespeed-optimiert und sofort verwendbar.

• Erlebniswelt-Grafiken im PSD-Format

  • Professionelle Design-Vorlagen als bearbeitbare PSD-Dateien für individuelle Anpassungen.

• Customizing Plugin/App

  • Erweiterte Anpassungsoptionen für Self-hosted (Plugin) und Cloud (App).

• Step-by-Step Anleitungen

  • Praktische Guides für die Nutzung aller Essentials-Ressourcen.

✅ Zeitersparnis – Fertige Ressourcen statt alles neu erstellen ✅ Professionelles Design – Von erfahrenen Designern erstellt ✅ Kostenlos – Keine versteckten Kosten oder Abo-Gebühren ✅ Regelmäßige Updates – Neue Ressourcen automatisch für dich

1. Besuche

2. Fülle das kurze Registrierungsformular aus

3. Erhalte alle Ressourcen sofort per E-Mail

FreeTheme One ist im Shopware Store kostenlos verfügbar und kann mit wenigen Klicks zu deinem Shop hinzugefügt werden.

1. Rufe die Administration deines Shops auf

2. Navigiere in der Hauptnavigation zu "Erweiterungen" → "Store" (1) (2)

3. Öffne den Reiter "Themes" (3)

4. Optional: Nutze die Suchfunktion und gib "FreeTheme" ein (4)

5. Wähle in der Übersicht FreeTheme One aus (5)

6. Die Detailseite des Themes öffnet sich

7. Klicke auf "Theme hinzufügen" (6)

8. Bestätige im Pop-up die Nutzungsbedingungen

9. Schließe den Vorgang mit "Erweiterung hinzufügen" ab

FreeTheme One wurde erfolgreich zu deinem Shop hinzugefügt.

Willkommen in der FreeTheme-Dokumentation und vielen Dank, dass du dich für das FreeTheme entschieden hast!

Hier findest du hilfreiche Anleitungen, Tipss & Tricks sowie Antworten auf die meisten Fragen. Bei Fragen zu Shopware 6 empfehlen wir die die Shopware-Dokumentation zu besuchen oder dich direkt an den Shopware-Support zu wenden.

Free Shopware Theme

Was ist das FreeTheme? – Das FreeTheme 'One' ist das kostenlose und zuverlässige Theme für Shopware 6 von den Machern von ThemeWare® – dem marktführenden Theme für Shopware 5 und Shopware 6.

Mit modernem Design, schnellem Einstieg und unkomplizierter Anpassung ist es die ideale Basis für kleine Shops, Startups und Pilotprojekte.

Mehr Informationen

Für mehr Informationen zum FreeTheme für Shopware 6, besuche gerne die FreeTheme-Landingpage:

FreeTheme downloaden

Möchtest du das FreeTheme für Shopware 6 in deinem Shop nutzen, "erwerbe" das kostenlose Theme einfach im Shopware-Store:

FreeTheme Essentials

Extras für Gestaltung, Customizing & Conversion – Hol dir kostenfreien Zugang zu den FreeTheme Essentials. Diese Extras helfen dir schnell und unkompliziert bei Design, Optimierung und mehr Bestellungen.

👉

Die meisten Fragen haben wir bereits in unserer Dokumentation beantwortet. Dort findest du hilfreiche Antworten und Anleitungen. Zusätzlich steht dir die offizielle Shopware-Dokumentation zur Verfügung.

👉 Shopware-Dokumentation:

Du hast Ideen, Wünsche, Vorschläge, Feedback oder Kritik zum FreeTheme? Super — wir freuen uns über jedes Feedback, um unser Theme noch besser zu machen.

👉 Erstelle gern ein Ticket:

Bitte beschreibe dein Anliegen möglichst konkret, z. B.:

• Thema & Ziel

• Shopware-/FreeTheme-Version

• Schritte zur Reproduktion

• Screenshots/URL

So können wir dir schnell und gezielt helfen.

Made with 💜 by

Willkommen bei FreeTheme One! Diese Anleitung führt dich durch die wichtigsten Schritte, um dein neues Theme erfolgreich einzurichten.

FreeTheme One ist im Shopware Store kostenlos verfügbar. Füge das Theme zu deinem Shop hinzu:

1. Melde dich in deinem an

2. Navigiere zum Bereich "Shopbetreiberbereich"

3. Wähle deinen Shop aus

Die Theme-Konfiguration von FreeTheme One erreichst du auf zwei Wegen:

1. Über die (empfohlen)

2. Über den

Nachfolgend werden beide Methoden im Detail beschrieben.

1. Rufe die Administration deines Shops auf

1. Rufe die Administration deines Shops auf

2. Navigiere in der Hauptnavigation zu "Erweiterungen" → "Meine Erweiterungen" (1) (2)

3. Öffne den Reiter "Themes" (3)

4. Nutze den Schieberegler (4) links neben dem FreeTheme One-Logo, um das Theme zu aktivieren

5. Lösche den gesamten Shopware-Cache und lade die Administration erneut

FreeTheme One wurde erfolgreich aktiviert.

1. Rufe die Administration deines Shops auf

2. Navigiere in der Hauptnavigation zu "Erweiterungen" → "Meine Erweiterungen" (1) (2)

3. Öffne den Reiter "Themes" (3)

4. FreeTheme One erscheint nun in der Theme-Übersicht

5. Klicke auf "Installieren", um das Theme einzurichten (4)

Die Installation von FreeTheme One ist nun abgeschlossen.

Wir freuen uns über jede ehrliche Bewertung. Die Bewertung muss auch gar nicht lang sein, 1-2 Sätze reichen völlig aus.

Es gibt zwei Möglichkeiten, FreeTheme One zu bewerten:

1. Über deinen Shopware-Account (empfohlen)

2. Über die Shop-Administration

Nachfolgend werden beide Methoden im Detail beschrieben.

1. Shopware-Account

1. Logge dich in deinen Shopware-Account ein

2. Wechsel oben links über das Auswahlfeld in den "Shopbetreiberbereich" (1)

3. Klicke in der Navigation auf "Shops" (2)

4. Wähle den Shop aus, für den du FreeTheme One installiert und getestet hast

5. Scrolle nach unten bis zur "Lizenzliste"

6. Klicke auf das Theme, das du bewerten möchtest

7. Oben rechts findest du den Link "Bewerten" (3)

8. Im folgenden Pop-up kannst du deine Bewertung vornehmen

9. Gib deinen Namen (4), eine Zusammenfassung (5) für deine Bewertung und deine Beschreibung (6) ein

10. Bewerte Funktionalität, Benutzbarkeit, Dokumentation und Support (7) von FreeTheme One über die 5-Sterne-Bewertung

11. Bestätige die AGB (8)

12. Sende die Bewertung mit "Bewertung abschicken" (9) ab

1. Rufe die Administration deines Shops auf

2. Navigiere in der Hauptnavigation zu "Erweiterungen" → "Meine Erweiterungen" (1) (2)

3. Öffne den Reiter "Themes" (3)

4. Öffne das Kontextmenü über den Kontext-Button (4) neben dem Theme und wähle "Bewerten" (5)

1. Rufe die Administration deines Shops auf

2. Navigiere in der Hauptnavigation zu "Erweiterungen" → "Meine Erweiterungen" (1) (2)

3. Öffne den Reiter "Themes" (3)

4. Suche FreeTheme One in der Liste deiner installierten Themes

   • Klicke auf "Aktualisieren" (4) oder

   • Öffne das Kontextmenü über den Kontext-Button neben dem Theme und wähle "Aktualisieren auf x.y.z" (4)

5. Lösche den gesamten Shopware-Cache und lade die Administration erneut

FreeTheme One wurde erfolgreich aktualisiert.

Falls der Theme-Manager von Shopware beim Speichern einen Fehler in deiner individuellen Theme-Konfiguration meldet, kannst du diesen wie folgt ermitteln:

1. Rufe die Administration deines Shops auf

2. Navigiere in der Hauptnavigation zu "Inhalte" → "Themes" (1) (2)

   • Hinweis: In der Shopware Cloud befindet sich "Themes" direkt in der Hauptnavigation.

3. Wähle FreeTheme One aus, um die Konfiguration zu öffnen

4. Klicke auf das Dropdown-Symbol am Speichern-Button (3)

5. Speichere die Konfiguration mit der Option "Bereinigen" (4)

Der Theme-Manager validiert deine Konfiguration und teilt dir etwaige Fehler mit.

1. Rufe die Administration deines Shops auf

2. Navigiere in der Hauptnavigation zu "Erweiterungen" → "Meine Erweiterungen" (1) (2)

3. Öffne den Reiter "Themes" (3)

4. Öffne das Kontextmenü über den Kontext-Button (4) neben dem Theme und wähle "Entfernen" (5)

5. Bestätige die Entfernung

1. Rufe die Administration deines Shops auf

2. Navigiere in der Hauptnavigation zu "Erweiterungen" → "Meine Erweiterungen" (1) (2)

3. Öffne den Reiter "Themes" (3)

4. Öffne das Kontextmenü über den Kontext-Button (4) neben dem Theme und wähle "Deinstallieren" (5)

5. Bestätige die Deinstallation im Pop-up mit "Deinstallieren" (6)

6. Lösche den gesamten Shopware-Cache und lade die Administration erneut

FreeTheme One wurde erfolgreich deinstalliert.

Beim Deinstallieren kannst du die Option "Alle App-Daten endgültig entfernen" aktivieren. Diese löscht alle Daten von FreeTheme One, wie beispielsweise die Theme-Konfiguration und Zusatzfelder.

Möchtest du FreeTheme One rückstandslos entfernen, nutze diese Option.

Wird die Option nicht genutzt, verbleiben alle Daten im System und können wieder genutzt werden, sobald du FreeTheme One erneut installierst.

1. Rufe die Administration deines Shops auf

2. Navigiere in der Hauptnavigation zu "Erweiterungen" → "Meine Erweiterungen" (1) (2)

3. Öffne den Reiter "Themes" (3)

4. Nutze den Schieberegler (4) links neben dem FreeTheme One-Logo, um das Theme zu deaktivieren

5. Lösche den gesamten Shopware-Cache und lade die Administration erneut

FreeTheme One wurde erfolgreich deaktiviert.

FreeTheme One Premium Add-ons können mit wenigen Klicks zu deinem Shop hinzugefügt werden.

1. Rufe die Administration deines Shops auf

2. Navigiere in der Hauptnavigation zu "Erweiterungen" → "FreeTheme Dashboard" (1) (2)

3. Öffne die Seite "Add-ons" (3)

4. Wähle das gewünschte Add-on aus der Übersicht aus (4)

5. Eine Detailübersicht öffnet sich

6. Klicke auf "Premium Add-on aktivieren" (5)

7. Das "In-App Kauf"-Pop-Up öffnet sich

8. Optional: Wähle den gewünschten Zahlungsintervall aus (6)

9. Bestätige die Nutzungsbedingungen (7)

10. Schließe den Vorgang mit "Zahlung abschließen" ab (8)

Das Premium Add-on wurde erfolgreich zu deinem Shop hinzugefügt.

1. Rufe die Administration deines Shops auf

2. Navigiere in der Hauptnavigation zu "Inhalte" → "Themes" (1) (2)

   • Hinweis: In der Shopware Cloud befindet sich "Themes" direkt in der Hauptnavigation.

3. Wähle FreeTheme One aus, um die Theme-Konfiguration zu öffnen

4. Scrolle im Tab "Allgemein" zum Abschnitt mit der Theme-Zuweisung

5. Öffne das Kontextmenü über den Kontext-Button (3) oben rechts

6. Wähle die Option "Theme zurücksetzen" (4) aus

7. Bestätige im Pop-up "Theme zurücksetzen" mit dem Button "Theme zurücksetzen"

Die Theme-Konfiguration von FreeTheme One wurde auf die Standardwerte zurückgesetzt.

Allgemein

Dieser Abschnitt enthält die Hauptfarben für deinen Shop.

Primärfarbe

Die Primärfarbe ist die zentrale Farbe deines Shops und wird durchgängig für interaktive Elemente verwendet. Diese Konfiguration stammt aus dem Shopware Standard-Theme und wird von FreeTheme One übernommen und auf ausgewählte Elemente angewendet.

Verwendung im Shop:

• Links: Standard-Linkfarbe in Texten und Navigationselementen

• Buttons: Primäre Call-to-Action-Buttons (außer Buy-Button, der separat konfigurierbar ist)

• Aktive Zustände: Aktive Navigationselemente, ausgewählte Filter

• Badges: Hintergrundfarbe für Produkt-Badges und Labels

Die Sekundärfarbe ist eine ergänzende Markenfarbe, die für weniger prominente Elemente und zur Schaffung visueller Hierarchien verwendet wird. Diese Konfiguration stammt aus dem Shopware Standard-Theme und wird von FreeTheme One mit einem dunklen Grauton übernommen.

Verwendung im Shop:

• Sekundäre Buttons: Weniger prominente Buttons

• Hintergründe: Farbe für sekundären Elemente

• Typografie: Sekundäre Textinformationen

Die Rahmenfarbe definiert die Farbe für Rahmen, Trennlinien und Umrandungen von Elementen im gesamten Shop. Diese Konfiguration stammt aus dem Shopware Standard-Theme und wird von FreeTheme One mit einem hellen Grauton übernommen.

Verwendung im Shop:

• Formulare: Umrandung von Eingabefeldern, Select-Boxen, Textareas

• Cards: Rahmen von Content-Cards und Info-Boxen

• Tabellen: Zellenrahmen und Tabellengrenzen

• Navigation: Trennlinien in Menüs

Die Hintergrundfarbe ist die Haupthintergrundfarbe des Shops und bildet die Basis für das gesamte visuelle Erscheinungsbild. Diese Konfiguration stammt aus dem Shopware Standard-Theme und wird von FreeTheme One mit Weiß als Standard übernommen.

Verwendung im Shop:

• Body: Haupt-Hintergrundfarbe der gesamten Seite

• Content-Cards: Hintergrund von Produktboxen und Info-Cards

• Modals: Hintergrund von Popup-Fenstern

• Offcanvas: Hintergrund von Warenkorb und Menüs

Die helle Primärfarbe ist eine aufgehellte Variante der Primärfarbe und dient zur Schaffung harmonischer Farbabstufungen und subtiler Akzente.

Verwendung im Shop:

• Die helle Primärfarbe wird derzeit nicht genutzt. Pflege diese Konfiguration dennoch, damit sie in zukünftigen Releases korrekt verwendet werden kann.

Die dunkle Primärfarbe ist eine abgedunkelte Variante der Primärfarbe und dient zur Schaffung von Tiefe, Kontrast und visueller Betonung.

Verwendung im Shop:

• Die helle Primärfarbe wird derzeit nicht genutzt. Pflege diese Konfiguration dennoch, damit sie in zukünftigen Releases korrekt verwendet werden kann.

Dies ist eine alternative Hintergrundfarbe für Farbakzente und visuelle Abwechslung im Shop. Diese Farbe wird verwendet um bestimmte Elemente auf Seiten oder verschiedene Sektionen in einem Layout visuell zu trennen.

Verwendung im Shop:

• Content-Sektionen: Dezente Hintergrundfarbe für bestimmte Bereiche

• Modals: Hintergrundfarbe von Headern in von Modals

• Highlighting: Subtile Hervorhebung wichtiger Bereiche

• Zebra-Striping: Alternierende Hintergründe in Listen oder Tabellen

Desktop

Das Desktop-Logo wird in der Kopfzeile auf Desktop-Geräten angezeigt. Diese Konfiguration stammt aus dem Shopware Standard-Theme.

Verwendung im Shop:

• Desktop-Ansicht: Logo im Header auf Desktop-Ansichten (ab 1200px Breite)

• Fallback: Wird auch auf kleineren Viewports angezeigt, falls für diese kein eigenes Logo verfügbar ist

Das Tablet-Logo wird in der Kopfzeile auf Tablet-Geräten angezeigt. Diese Konfiguration stammt aus dem Shopware Standard-Theme.

Verwendung im Shop:

• Tablet-Ansicht: Logo im Header auf Tablet-Ansichten (768px-1199px Breite)

Das Mobile-Logo wird in der Kopfzeile auf mobilen Geräten angezeigt. FreeTheme One verwendet standardmäßig eine kompaktere Variante. Diese Konfiguration stammt aus dem Shopware Standard-Theme.

Verwendung im Shop:

• Mobile-Ansicht: Logo im Header auf mobilen Ansichten (unter 768px Breite)

Das Share-Icon wird als Open Graph Bild beim Teilen der Website in sozialen Medien verwendet. Diese Konfiguration stammt aus dem Shopware Standard-Theme.

Verwendung im Shop:

• Messenger: Vorschaubild beim Teilen über Messenger-Dienste

• Link-Previews: Vorschaubild in Link-Vorschauen

Das Favicon wird als kleines Icon in Browser-Tabs und Lesezeichen angezeigt. Diese Konfiguration stammt aus dem Shopware Standard-Theme.

Verwendung im Shop:

• Browser-Tabs: Icon in Browser-Tabs

• Lesezeichen: Icon in Lesezeichen und Favoriten

• Mobile App-Icons: Icon auf mobilen Geräten (Apple Touch Icon)

• Tab-Übersicht: Icon in Browser-Tab-Übersichten

FreeTheme One wird kontinuierlich weiterentwickelt. Gelegentlich können dabei Konfigurationsfelder entfernt oder ersetzt werden.

Falls "verwaiste Konfigurationsfelder" in deiner Theme-Konfiguration verbleiben, kannst du diese wie folgt entfernen:

1. Rufe die Administration deines Shops auf

2. Navigiere in der Hauptnavigation zu "Inhalte" → "Themes" (1) (2)

   • Hinweis: In der Shopware Cloud befindet sich "Themes" direkt in der Hauptnavigation.

3. Wähle FreeTheme One aus, um die Konfiguration zu öffnen

4. Klicke auf das Dropdown-Symbol am Speichern-Button (3)

5. Speichere die Konfiguration mit der Option "Bereinigen" (4)

FreeTheme One wurde erfolgreich bereinigt.

Iconset

Das Icon-Set definiert, welches Icon-Pack im gesamten Shop verwendet wird. FreeTheme One bietet die Wahl zwischen den Standard-Shopware-Icons und dem modernen Feather-Icon-Set.

Verfügbare Optionen:

• Standard (Shopware 6): Die Standard-Icons von Shopware 6

• Feather: Modernes, minimalistisches Icon-Set mit über 280 Icons

Verwendung im Shop:

• Header: Header-Icons (Warenkorb, Account, Suche, Sprache, Währung, Wunschliste)

• Navigation: Offcanvas-Menü, Zurück-Links, Alle-Anzeigen-Links

• Footer: Footer-Icons

• Checkout: Warenkorb, Adresse, Zahlungsmethoden

Allgemein

Text-Schriftart

Die Basis-Schriftart definiert die Schriftart für alle Fließtexte, Beschreibungen und Standard-Textelemente im Shop. Diese Konfiguration stammt aus dem Shopware Standard-Theme und wird von FreeTheme One mit der modernen Variable Font "Sen" überschrieben.

Verwendung im Shop:

• Body-Text: Alle Fließtexte und Absätze

• Produktbeschreibungen: Detaillierte Produktinformationen

• Navigation: Menü-Einträge und Links

• Buttons: Text auf Buttons und Call-to-Actions

Die Textfarbe definiert die Farbe für alle Fließtexte, Beschreibungen und Standard-Textelemente im Shop. Diese Konfiguration stammt aus dem Shopware Standard-Theme und wird von FreeTheme One mit einem sehr dunklen Grauton übernommen.

Verwendung im Shop:

• Body-Text: Alle Fließtexte und Absätze

• Produktbeschreibungen: Detaillierte Produktinformationen

• Navigation: Menü-Einträge und Links

• Buttons: Text auf Buttons und Call-to-Actions

Die Überschrift-Schriftart definiert die Schriftart für alle Überschriften (H1-H6) im Shop. Diese Konfiguration stammt aus dem Shopware Standard-Theme und wird von FreeTheme One mit der modernen Variable Font "Sen" überschrieben - identisch zur Basis-Schriftart.

Verwendung im Shop:

• H1-H6: Alle Überschriften-Ebenen

• Produkttitel: Namen von Produkten in Listings und Details

• Kategorie-Überschriften: Kategorienamen und Navigationstitel

• Modal-Titel: Überschriften in Modals

Die Überschriftfarbe definiert die Farbe für alle Überschriften (H1-H6) im Shop. Diese Konfiguration stammt aus dem Shopware Standard-Theme und wird von FreeTheme One mit einem sehr dunklen Grauton übernommen - identisch zur Textfarbe.

Verwendung im Shop:

• H1-H6: Alle Überschriften-Ebenen

• Produkttitel: Namen von Produkten in Listings und Details

• Kategorie-Überschriften: Kategorienamen und Navigationstitel

• Modal-Titel: Überschriften in Modals

Die Linkfarbe definiert die Farbe für Links in Fließtexten und Content-Bereichen. Diese Farbe verwendet standardmäßig die Primärfarbe.

Verwendung im Shop:

• Content-Links: Links in Fließtexten und CMS-Inhalten

• Breadcrumbs: Navigations-Links

• Listen: Verlinkte Listen-Elemente

• Sidebar-Links: Links in Seitenbereichen

Die Hover-Farbe für Links definiert die Farbe, die Links annehmen, wenn Nutzer mit der Maus darüberfahren.

Verwendung im Shop:

• Content-Links: Links in Fließtexten und CMS-Inhalten

• Breadcrumbs: Navigations-Links

• Listen: Verlinkte Listen-Elemente

• Sidebar-Links: Links in Seitenbereichen

Darstellungsart

Die Darstellungsart steuert, ob der Standard Shopware 6 Header oder der optimierte FreeTheme 'Header' verwendet werden soll. Diese zentrale Konfiguration entscheidet über die gesamte Header-Struktur deines Shops.

Verfügbare Optionen:

• Standard (Shopware 6): Verwendet das unveränderte Shopware 6 Header-Layout

• FreeTheme 'Header': Aktiviert den optimierten FreeTheme Header mit verbesserter Struktur

Funktionsweise:

Wenn FreeTheme 'Header' ausgewählt ist, wird das Header-Layout neu strukturiert:

FreeTheme 'Header'

1. Top-Bar (siehe , )

2. Logo

3. Navigation

4. Actions (Warenkorb, Account, etc.)

5. Suche (ausgeklappt)

💡 Diese Konfiguration bezieht sich auf die FreeTheme 'Top-Bar'.

Farben

Textfarbe

Die Textfarbe definiert die Farbe aller Texte, Icons und Links in der Top-Bar. Diese Farbe sollte einen guten Kontrast zur Hintergrundfarbe bieten.

Verwendung in der Top-Bar:

• Texte: Claims, USPs, Kontaktinformationen

• Icons: Feather-Icons (Telefon, Mail, Check, etc.)

• Links: Social-Media-Icons, Kontakt-Links

• Widgets: Sprach- und Währungsauswahl-Text

Die Hintergrundfarbe definiert die Hintergrundfarbe der Top-Bar. Diese Farbe sollte sich vom restlichen Header abheben und einen guten Kontrast zur Textfarbe bieten.

Spalte 1 steuert den Inhalt der linken Spalte in der Top-Bar. Diese Spalte eignet sich ideal für Claims, Kontaktinformationen oder Social-Media-Links.

Verfügbare Optionen:

• Nicht anzeigen: Spalte bleibt leer

• Claim anzeigen: Zeigt den Shop-Claim

• Service-Hotline anzeigen: Telefon-Icon + Hotline-Nummer mit Öffnungszeiten

• Service-E-Mail anzeigen: Mail-Icon + E-Mail-Adresse mit Öffnungszeiten

Text-Anpassung:

Die Texte können über Textbausteine angepasst werden (Pfad: Einstellungen → Snippets):

Spalte 2 steuert den Inhalt der mittleren Spalte in der Top-Bar. Diese Spalte ist ideal für USPs (Unique Selling Points), Marketing-Botschaften oder zentrale Informationen.

Verfügbare Optionen:

• Nicht anzeigen: Spalte bleibt leer

• Claim anzeigen: Zeigt den Shop-Claim

• Text anzeigen: Zeigt eine anpassbare Marketing-Botschaft

• USPs anzeigen: Zeigt 3 Verkaufsargumente mit Check-Icons

Funktionsweise:

Die mittlere Spalte passt sich automatisch an das Layout an:

• Nur Spalte 2 aktiv: Zentriert auf der gesamten Breite

• Spalte 1 + 2 aktiv: Rechtsbündig (Desktop), zentriert (Mobile)

• Alle 3 Spalten aktiv: Zentriert zwischen Spalte 1 und 3

Text-Anpassung:

Spalte 3 steuert den Inhalt der rechten Spalte in der Top-Bar. Diese Spalte ist standardmäßig für die Sprach- und Währungsauswahl reserviert.

Verfügbare Optionen:

• Sprach-/Währungsauswahl anzeigen: Zeigt Shopware-Standard-Widgets für Sprach- und Währungswahl

Funktionsweise:

Die Spalte 3 zeigt standardmäßig die Shopware-Standard-Widgets für:

• Sprachauswahl: Wird nur angezeigt, wenn mehrere Sprachen im Verkaufskanal konfiguriert sind

• Währungsauswahl: Wird nur angezeigt, wenn mehrere Währungen im Verkaufskanal konfiguriert sind

Wenn keine Mehrsprachigkeit oder Mehrwährung konfiguriert ist, bleibt die Spalte automatisch leer.

💡 Diese Konfiguration bezieht sich auf die FreeTheme 'Footer'.

1. Footer-Logo

2. Hotline & Kontakt

3. Social-Icons

4. Footer-Navigation

5. Zahlungs und Versandarten

6. Footer-Service-Navigation

7. Copyright-Footer

Hauptmerkmale vom FreeTheme 'Footer':

• Footer-Logo: Separates Logo für den Footer-Bereich

• Kontaktbereich: Strukturierte Anzeige von Service-Hotline und Kontaktformular-Link

• Social-Media-Integration: Optionale Anzeige deiner Social-Media-Kanäle im Footer

• Responsive Design: Automatische Anpassung an alle Bildschirmgrößen

Die Textfarbe bestimmt die Farbe aller Textelemente im Footer-Bereich. Dazu gehören Navigationstitel, Fließtexte, die Service-Hotline und Icons.

Verwendung im Footer:

• Navigationstitel: Footer-Navigationstitel (Spaltenüberschriften)

• Fließtext: Service-Hotline, Kontaktinfos

• Icons: Collapse-Icons auf mobilen Geräten

• Überschriften: Payment/Shipping-Logo-Überschrift

Die Hintergrundfarbe bestimmt die Hintergrundfarbe des gesamten Footer-Bereichs (Footer und Copyright Footer). Diese Farbe sollte sich deutlich vom Hauptinhalt abheben, um den Footer visuell abzugrenzen.

Bereiche mit dieser Hintergrundfarbe:

• Footer: Hauptbereich mit Logo, Navigation, Social-Icons

• Copyright Footer: Copyright und Service-Links

Die Linkfarbe definiert die Farbe aller anklickbaren Links im Footer-Bereich. Dazu gehören Navigationspunkte, Service-Hotline-Links, E-Mail-Links und Service-Menü-Links im Footer-Bottom.

Verwendung im Footer:

• Navigation: Footer-Navigationspunkte (alle Menüpunkte)

• Kontakt: Service-Hotline-Telefonnummer

• Service: Kontaktformular-Link, Service-Menü-Links

• Social Media: Social-Media-Icons (als Links)

Die Linkfarbe (Hover) definiert die Farbe, die Links annehmen, wenn Nutzer mit der Maus darüber fahren. Dies bietet visuelles Feedback und verbessert die Benutzerfreundlichkeit.

Verwendung:

Hover-Zustand aller Footer-Links (Navigation, Kontakt, Service-Menü)

Das Footer-Logo ist ein separates Logo, das speziell für den Footer-Bereich hochgeladen werden kann. Dies ist besonders nützlich, wenn dein Haupt-Logo auf dunklem Hintergrund schlecht sichtbar ist.

Technische Details:

Das Footer-Logo wird in der linken Spalte des Footers oberhalb der Service-Hotline und Kontaktinformationen angezeigt. Es ist verlinkt zur Startseite.

Steuert, ob die konfigurierten Social-Media-Icons im Footer-Bereich angezeigt werden sollen. Die Icons erscheinen in der linken Spalte unterhalb der Kontaktinformationen.

Verfügbare Optionen:

• Nein

• Ja

Platzierung im Footer:

Die Social-Icons erscheinen in der linken Footer-Spalte in folgender Reihenfolge:

1. Footer-Logo

2. Service-Hotline

3. Kontaktformular-Link

4. Social-Icons ← hier

Allgemein

Preis

Die Preisfarbe definiert die Textfarbe für Produktpreise im Shop. Diese Konfiguration stammt aus dem Shopware Standard-Theme und wird von FreeTheme One mit einem dunklen Grauton überschrieben.

Verwendung im Shop:

• Produktlistings: Produktpreise auf Produktlistings

• Produktdetailseiten: Standardpreis auf Produktdetailseiten

• Warenkorb & Checkout: Preisangaben in Warenkorb und Checkout

• Produktboxen: Preise in Produktboxen und -karten

Die Aktionspreis-Farbe definiert die Textfarbe für reduzierte Produktpreise im Shop. Diese Farbe wird angezeigt, wenn ein Produkt einen Streichpreis (UVP) hat und damit einen Rabatt signalisiert.

Verwendung im Shop:

• Produktlistings: Produktpreise auf Produktlistings

• Produktdetailseiten: Standardpreis auf Produktdetailseiten

• Warenkorb & Checkout: Preisangaben in Warenkorb und Checkout

• Produktboxen: Preise in Produktboxen und -karten

Die Streichpreis-Farbe definiert die Textfarbe für durchgestrichene UVP-Preise (Unverbindliche Preisempfehlung). Diese Farbe wird für den ursprünglichen Preis verwendet, der höher war als der aktuelle Verkaufspreis.

Verwendung im Shop:

• Produktlistings: Produktpreise auf Produktlistings

• Produktdetailseiten: Standardpreis auf Produktdetailseiten

• Warenkorb & Checkout: Preisangaben in Warenkorb und Checkout

• Produktboxen: Preise in Produktboxen und -karten

Die Button-Farbe definiert die Hintergrundfarbe des Kaufen-Buttons. Diese Konfiguration stammt aus dem Shopware Standard-Theme und wird von FreeTheme One mit einem grünen Standardwert überschrieben.

Verwendung im Shop:

• Produktlistings: "In den Warenkorb"-Button auf Produktlistings

• Produktdetailseiten: "In den Warenkorb"-Button auf Produktdetailseiten

• Produktboxen: "In den Warenkorb"-Button in Produktboxen

Die Button-Textfarbe definiert die Textfarbe des Kaufen-Buttons. Diese Konfiguration stammt aus dem Shopware Standard-Theme und wird von FreeTheme One mit Weiß als Standardwert überschrieben.

Hinweis: Bootstrap wählt die Textfarbe in der Regel automatisch als Schwarz oder Weiß, je nachdem, welche Farbe den höheren Kontrast zur eingestellten Hintergrundfarbe hat. Shopware weicht davon ab und setzt hier auf eine manuelle Steuerung der Textfarbe.

Verwendung im Shop:

• Produktlistings: "In den Warenkorb"-Button auf Produktlistings

• Produktdetailseiten: "In den Warenkorb"-Button auf Produktdetailseiten

• Produktboxen: "In den Warenkorb"-Button in Produktboxen

Allgemein

Footer-Newsletter anzeigen

Die Footer-Newsletter-Sektion ist ein strategisch platzierter Bereich oberhalb des Footers, der Kunden zur Newsletter-Anmeldung animiert, ohne aufdringlich zu wirken. Diese FreeTheme-exklusive Funktion kombiniert ansprechendes Design mit conversion-optimierter Platzierung.

Verfügbare Optionen:

• Nein

• Ja

Funktionsweise:

Wenn diese Option auf "Ja" gestellt ist, wird oberhalb des Footers eine visuell abgesetzte Newsletter-Sektion angezeigt. Die Sektion besteht aus:

• Überschrift: "Unser Newsletter. Jetzt abonnieren und nichts mehr verpassen!" (konfigurierbar über Textbausteine)

• Text: Animiert zum Abonnieren mit Shopname-Platzhalter

• Call-to-Action-Button: Öffnet das Newsletter-Anmelde-Modal

• Intelligentes Button-Styling: Die Button-Farbe passt sich automatisch der Hintergrundfarbe an (hell/dunkel)

1. Überschrift

2. Text

3. Call-to-Action-Button

Wichtige Voraussetzung - Newsletter-Seite konfigurieren:

Damit der Newsletter-Button funktioniert, muss in den Shopware-Grundeinstellungen eine Newsletter-Seite zugewiesen sein.

Falls keine Newsletter-Seite zugewiesen wurde, zeigt FreeTheme One automatisch eine Warnmeldung anstelle des Buttons: ⚠️ "In den Shop-Einstellungen wurde keine Newsletter-Seite ausgewählt."

💡 Schritt-für-Schritt Anleitung "FreeTheme Footer-Newsletter"

Text-Anpassung:

Die Textfarbe für alle Textelemente in der Footer-Newsletter-Sektion (Überschrift und Beschreibungstext).

Verwendung:

• Newsletter-Überschrift

• Newsletter-Beschreibungstext

Die Hintergrundfarbe der Newsletter-Sektion. Diese sollte sich vom Footer abheben, um Aufmerksamkeit zu erregen. Die Hintergrundfarbe steuert automatisch die Button-Farbe (hell bei dunklem Hintergrund, dunkel bei hellem Hintergrund).

Besonderheiten:

Die Hintergrundfarbe beeinflusst automatisch das Button-Styling:

• Heller Hintergrund (Lightness > 60%): Dunkler Button (btn-dark)

• Dunkler Hintergrund (Lightness ≤ 60%): Heller Button (btn-light)

Du kannst FreeTheme One auf zwei verschiedenen Wegen einem Verkaufskanal zuweisen:

1. Über den Verkaufskanal (empfohlen)

2. Über die Theme-Verwaltung

Beide Methoden werden nachfolgend detailliert beschrieben.

1. Verkaufskanal

1. Rufe die Administration deines Shops auf

2. Navigiere in der Hauptnavigation zum Verkaufskanal deiner Storefront im Bereich "Verkaufskanäle" (1)

3. Öffne den Tab "Theme" (2)

4. Klicke im Abschnitt "Theme-Zuweisung" auf "Theme ändern" (3)

5. Wähle FreeTheme One im Pop-up aus (4) und bestätige mit "Theme ändern" (5)

6. Klicke abschließend oben auf "Speichern", damit das Theme zugewiesen und kompiliert wird (6)

FreeTheme One ist nun deinem Verkaufskanal zugewiesen.

1. Rufe die Administration deines Shops auf

2. Navigiere in der Hauptnavigation zu "Inhalte" → "Themes" (1) (2)

   • Hinweis: In der Shopware Cloud befindet sich "Themes" direkt in der Hauptnavigation.

3. Wähle FreeTheme One aus, um die Konfiguration zu öffnen

FreeTheme One ist nun deinem Verkaufskanal zugewiesen.

Darstellungsart

Die Darstellungsart steuert, ob der Standard Shopware 6 Footer oder der optimierte FreeTheme 'Footer' verwendet werden soll. Diese zentrale Konfiguration entscheidet über die gesamte Footer-Struktur deines Shops.

Verfügbare Optionen:

• Standard (Shopware 6): Verwendet das unveränderte Shopware 6 Footer-Layout

• FreeTheme 'Footer': Aktiviert den optimierten FreeTheme Footer mit verbesserter Struktur

Funktionsweise:

Wenn FreeTheme 'Footer' ausgewählt ist, wird das gesamte Footer-Layout neu strukturiert:

FreeTheme 'Footer'

Der gesamte FreeTheme 'Footer' besteht aus 3 Bereichen:

1. FreeTheme 'Newsletter-Footer' (footer-top)

2. Haupt-Bereich (footer-middle)

3. Unterer-Bereich (footer-bottom)

Die Zahlungs- und Versandarten Logos befinden sich im "Haupt-Bereich" (footer-middle).

Demnächst

Text-Anpassung:

Der Copyright-Footer befindet sich im "Unterer-Bereich" (footer-bottom).

Demnächst

Text-Anpassung:

Platzhalter verfügbar: %shopname% = Wird automatisch durch den Shopnamen aus den Grundeinstellungen ersetzt | %date% = Wird automatisch durch das aktuelle Jahr ersetz

Allgemein

Darstellungsart

Die Darstellungsart steuert, ob der Standard Shopware 6 "Produkt-Slider" vom FreeTheme optimiert wird.

Verfügbare Optionen:

• Standard (Shopware 6): Verwendet den unveränderten Shopware 6 Produkt-Slider

• FreeTheme 'Produkt-Slider Styling': Der Slider wird so angepasst, dass vorherige und nächste Produkte teilweise sichtbar sind. Dadurch werden Nutzer zum Weiterklicken und Entdecken weiterer Produkte animiert, was die Verkaufsförderung unterstützt.

Wähle aus, ob der Überlauf vom Produkt-Slider sichtbar oder ausgeblendet sein soll. – Dies gilt nur für Produkt-Slider in einspaltigen CMS-Blöcken!

Verfügbare Optionen:

• ausgeblendet: Verwendet den unveränderten Shopware 6 Produkt-Slider

• sichtbar: Produkte außerhalb des Sliders werden sichtbar gemacht

Beispiel:

Sidebar-Navigation

Überschrift anzeigen

Wähle aus, ob die Überschrift für die Sidebar-Navigation angezeigt werden soll.

Verfügbare Optionen:

• Nein: Verwendet die Standard Shopware 6 Sidebar-Navigation ohne Überschrift

• Ja: Fügt eine Überschrift zur Shopware 6 Sidebar-Navigation hinzu

Text-Anpassung:

Beispiel:

Wähle aus, ob die Überschrift für die Sidebar-Navigation angezeigt werden soll.

Verfügbare Optionen:

• Nein: Verwendet den Standard Shopware 6 Sidebar-Filter ohne Überschrift

• Ja: Fügt eine Überschrift zum Shopware 6 Sidebar-Filter hinzu

Text-Anpassung:

Beispiel:

Produktüberschrift (Produktname + Hersteller-Logo)

Darstellungsart

Die Darstellungsart steuert, wo der Produktname auf der Produktdetailseite angezeigt wird. Diese Konfiguration beeinflusst die visuelle Hierarchie und Benutzerführung auf der Produktseite.

Verfügbare Optionen:

• Standard (Shopware 6): Produktname wird über Galerie und Buybox angezeigt (horizontal über der gesamten Breite)

• FreeTheme 'Produktüberschrift' (in der Buybox): Produktname wird innerhalb der Buybox angezeigt (kompakteres Layout)

Funktionsweise:

Standard (Shopware 6)

FreeTheme 'Produktüberschrift' (in der Buybox)

Demnächst

Steuert, ob die Produktnummer (Artikelnummer) in der Buybox auf der Produktdetailseite angezeigt werden soll. Die Produktnummer ist besonders für B2B-Shops und telefonische Bestellungen wichtig.

Verfügbare Optionen:

• Nein: Produktnummer wird nicht angezeigt

• Ja: Produktnummer wird in der Buybox angezeigt

Funktionsweise:

Wenn aktiviert, wird die Produktnummer (Artikelnummer) als zusätzliche Information in der Buybox angezeigt:

Demnächst

Text-Anpassung:

Platzhalter verfügbar: %manufacturer% = Wird automatisch durch den Herstellernamen ersetzt

💡 Diese Konfiguration bezieht sich auf die FreeTheme 'Produktüberschrift' (in der Buybox).

Demnächst

Erfolg

Die Erfolgsfarbe wird für positive Rückmeldungen, Bestätigungen und Erfolgsmeldungen verwendet. Diese Konfiguration stammt aus dem Shopware Standard-Theme und wird von FreeTheme One mit einem dunklen Grünton übernommen.

Verwendung im Shop:

• Alerts: Hintergrund und Rahmen von Success-Alert-Boxen

• Produkt-Badges: Hintergrund für Success-Badges

• Lieferbarkeit: Produkt sofort verfügbar

Die Infofarbe wird für informative Hinweise, neutrale Meldungen und Systeminformationen verwendet. Diese Konfiguration stammt aus dem Shopware Standard-Theme und wird von FreeTheme One mit einem dunklen Blauton übernommen.

Verwendung im Shop:

• Alerts: Hintergrund und Rahmen von Info-Alert-Boxen

• Produkt-Badges: Hintergrund für Info-Badges

• Lieferbarkeit: Produkt versandkostenfrei

Die Warnfarbe wird für Warnhinweise, wichtige Aufmerksamkeiten und potenzielle Probleme verwendet. Diese Konfiguration stammt aus dem Shopware Standard-Theme und wird von FreeTheme One mit einem dunklen Orangeton übernommen.

Verwendung im Shop:

• Alerts: Hintergrund und Rahmen von Warning-Alert-Boxen

• Produkt-Badges: Hintergrund für Warning-Badges

• Lieferbarkeit: Produkt versandfertig in ... Tagen

Die Fehlerfarbe wird für Fehlermeldungen, kritische Warnungen und fehlerhafte Zustände verwendet. Diese Konfiguration stammt aus dem Shopware Standard-Theme und wird von FreeTheme One mit einem kräftigen Rotton übernommen.

Verwendung im Shop:

• Alerts: Hintergrund und Rahmen von Error-Alert-Boxen

• Produkt-Badges: Hintergrund für Error-Badges

• Lieferbarkeit: Produkt nicht mehr verfügbar