Startseite verwalten - Anpassen und Texte

Webshop-Seiten anpassen und Inhalte hinzufügen

Einleitung: Was bedeutet Webshop-Seiten anpassen?

Webshop-Seiten anpassen bedeutet, dass Sie selbst den Inhalt und das Layout Ihres Webshops bestimmen können. Sie können Texte, Bilder, Videos, Produktblöcke und andere Elemente hinzufügen, damit Ihr Webshop genau so aussieht, wie Sie es möchten. Es ist wie das Einrichten Ihres eigenen Geschäfts: Sie entscheiden, was wo steht.

Warum Webshop-Seiten anpassen?

Sie möchten Ihren Webshop anpassen, weil:

  • Sie Kontrolle darüber haben, was Kunden sehen
  • Sie ein einzigartiges und professionelles Erscheinungsbild schaffen können
  • Sie wichtige Informationen an der richtigen Stelle platzieren können
  • Sie Produkte so hervorheben können, wie Sie es möchten
  • Sie spezielle Aktionen oder Angebote prominent anzeigen können
  • Es Ihren Webshop persönlich und wiedererkennbar macht
  • Sie das Kundenerlebnis verbessern können

Was können Sie zu Seiten hinzufügen?

Sie haben verschiedene Arten von Blöcken und Elementen, die Sie hinzufügen können:

Blöcke:

  • Artikelblöcke: Zeigen bestimmte Produkte
  • Sortimentsblöcke: Zeigen eine Gruppe von Produkten
  • Karussellblöcke: Rotierende Produktgalerie

Andere Elemente:

  • Text: Erklärung, Willkommensnachricht, Informationen
  • Bilder: Fotos, Banner, Bilder
  • Videos: YouTube-Videos einbetten
  • Schließzeitblock: Zeigt an, wann Sie geschlossen sind
  • Bestelltagblock: Zeigt Bestellmöglichkeiten
  • Login-Block: Anmeldemöglichkeit für Kunden
  • Suchleiste: Produkte suchen
  • Listengruppen (Schaltflächen): Navigationsschaltflächen

Wie fügen Sie Inhalte zu einer Seite hinzu?

Schritt 1: Zur Seite

Seite öffnen

  1. Gehen Sie zur Kachel „Shop (Neu)"
  2. Klicken Sie auf die Schaltfläche „Seiten"
  3. Sie sehen nun eine Liste aller Seiten
  4. Klicken Sie auf die Seite, die Sie anpassen möchten (z. B. Ihre Startseite)

Schritt 2: Sektion erstellen (optional)

Sektionen sind wie Kapitel auf Ihrer Seite. Damit können Sie Ihre Seite in verschiedene Bereiche unterteilen.

Neue Sektion/Unterseite erstellen

  1. Klicken Sie auf „Sektion"
  2. Klicken Sie auf „Neu"
  3. Geben Sie einen Namen für die Sektion ein (z. B. „Hervorgehobene Produkte" oder „Willkommen")

Sichtbarkeit einstellen

Sie können wählen, wann diese Sektion sichtbar ist:

  • Angehakt (✓): Sektion ist nur sichtbar, wenn Kunde eingeloggt ist
  • Nicht angehakt ( ): Sektion ist nur sichtbar, wenn Kunde NICHT eingeloggt ist
  • Strich (-): Sektion ist immer sichtbar (eingeloggt oder nicht)

Beispiel:

  • Sonderangebote für Stammkunden → Anhaken (nur für eingeloggte Kunden)
  • Allgemeiner Willkommenstext → Strich (für alle)

Speichern

  1. Klicken Sie auf „Speichern"
  2. Die Sektion ist jetzt erstellt

Schritt 3: Items zu Sektion hinzufügen

Jetzt fügen Sie den eigentlichen Inhalt hinzu (Texte, Bilder, Blöcke usw.).

Items-Menü öffnen

  1. Wählen Sie die Sektion oder Unterseite, der Sie etwas hinzufügen möchten
  2. Klicken Sie auf „Items"
  3. Sie sehen nun die Möglichkeiten, Inhalte hinzuzufügen

Option A: Text hinzufügen (mit Bild oder Video)

Neuen Text hinzufügen

  1. Klicken Sie auf „Neu" oder „+ Text"
  2. Ein Texteditor öffnet sich
  3. Geben Sie Ihren Text ein

Bild zu Text hinzufügen

Wenn Sie ein Bild hinzufügen möchten:

  1. Laden Sie zuerst das Bild ins System hoch
  2. Merken Sie sich den Dateinamen (z. B.: „banner.png")
  3. Achtung: Verwenden Sie keine Leerzeichen im Dateinamen!
  4. Fügen Sie folgenden Code in Ihren Text ein:
![](banner.png)
  1. Ersetzen Sie „banner.png" durch den Namen Ihres Bildes

Beispiel:

  • Sie haben ein Bild „willkommen2025.jpg" hochgeladen
  • In Ihrem Text geben Sie ein: ![](willkommen2025.jpg)
  • Das Bild erscheint nun an dieser Stelle

YouTube-Video zu Text hinzufügen

Wenn Sie ein YouTube-Video einbetten möchten:

  1. Kopieren Sie den YouTube-Videolink (z. B.: https://www.youtube.com/watch?v=bCLEnJ8Mm0I)
  2. Fügen Sie folgenden Code in Ihren Text ein:
![youtube.com](https://www.youtube.com/watch?v=bCLEnJ8Mm0I)
  1. Ersetzen Sie den Link durch Ihren eigenen YouTube-Link

Beispiel:

Text speichern

  1. Klicken Sie auf „Speichern"
  2. Der Text ist nun zu Ihrer Seite hinzugefügt

Option B: Blöcke und spezielle Elemente hinzufügen

Mehr-Optionen-Menü

  1. Im Items-Bildschirm klicken Sie auf „Mehr"
  2. Sie sehen nun ein Menü mit verschiedenen Optionen

Was können Sie über „Mehr" hinzufügen:

1. Ein erstellter Block

  • Dies ist ein Block, den Sie zuvor erstellt haben (Artikelblock, Sortimentsblock, Karussellblock)
  • Wählen Sie den Block, den Sie hinzufügen möchten
  • Er erscheint auf Ihrer Seite

2. Neuer Schließzeitblock

  • Zeigt automatisch an, wann Ihr Webshop geschlossen ist
  • Kunden sehen z. B.: „Wir sind geschlossen, kommen Sie am Montag wieder"
  • Praktisch für Urlaub oder Feiertage

3. Neuer Bestelltagblock

  • Zeigt die Bestellmöglichkeiten und Lieferdaten
  • Kunden sehen, wann sie für welchen Tag bestellen können
  • Macht es für Kunden klar

4. Login-Block

  • Zeigt eine Anmeldemöglichkeit für Kunden
  • Kunden können sich anmelden, um ihr Konto zu sehen
  • Praktisch auf der Startseite oder im Menü

5. Suchleiste

  • Kunden können Produkte suchen
  • Produktnamen eingeben und direkt finden
  • Verbessert die Benutzerfreundlichkeit

6. Listengruppen (Schaltflächen)

  • Navigationsschaltflächen zu verschiedenen Kategorien
  • Zum Beispiel: „Rosen", „Tulpen", „Lilien"
  • Kunden klicken darauf und gehen zu dieser Kategorie

Element hinzufügen

  1. Klicken Sie auf das Element, das Sie hinzufügen möchten
  2. Folgen Sie eventuellen zusätzlichen Schritten (Konfiguration, Name eingeben usw.)
  3. Speichern
  4. Das Element erscheint in der Liste

Schritt 4: Reihenfolge der Elemente anpassen

Die Reihenfolge, in der Sie Elemente hinzufügen, ist auch die Reihenfolge, in der sie im Webshop erscheinen. Sie können diese Reihenfolge anpassen.

Elemente neu anordnen

  1. Sie sehen nun eine Liste mit allen Items/Blöcken auf Ihrer Seite
  2. Wählen Sie das Element, das Sie verschieben möchten
  3. Sie sehen Pfeile: nach oben (↑) und nach unten (↓)

Verschieben:

  • Pfeil nach oben (↑): Element geht eine Position höher (mehr nach oben auf der Seite)
  • Pfeil nach unten (↓): Element geht eine Position tiefer (mehr nach unten auf der Seite)

Beispielreihenfolge:

  1. Willkommenstext (oben)
  2. YouTube-Video
  3. Hervorgehobene Produkte Block
  4. Suchleiste
  5. Text mit Kontaktinformationen (unten)

Ergebnis prüfen

  1. Laden Sie Ihren Webshop neu, um zu sehen, wie es aussieht
  2. Passen Sie die Reihenfolge weiter an, falls nötig

Fertig! Ihre Seite ist jetzt mit eigenen Inhalten angepasst.

Erweiterte Textformatierung

Für mehr Möglichkeiten im Text (wie Überschriften, fett gedruckter Text, Listen usw.) können Sie Markdown verwenden.

Nützliche Markdown-Codes:

Überschriften:

# Große Überschrift (Heading 1)
## Mittlere Überschrift (Heading 2)
### Kleine Überschrift (Heading 3)

Textformatierung:

**Fett gedruckter Text**
*Kursiver Text*

Listen:

- Item 1
- Item 2
- Item 3

Links:

[Hier klicken](https://www.beispiel.de)

Mehr Informationen: Für ausführliche Erklärungen zu allen Markdown-Möglichkeiten gehen Sie zu: https://github.com/adam-p/markdown-here/wiki/Markdown-Cheatsheet

Praktische Beispiele

Beispiel 1: Startseite mit Willkommenstext und Produkten

  • Schritt 1: Startseite öffnen → Sektion → Neu → „Willkommen"
  • Schritt 2: Items → Neu → Willkommenstext eingeben
  • Schritt 3: Items → Mehr → Sortimentsblock mit beliebten Produkten hinzufügen
  • Schritt 4: Webshop neu laden und überprüfen
  • Ergebnis: Kunden sehen Willkommenstext gefolgt von hervorgehobenen Produkten

Beispiel 2: Banner mit YouTube-Video

  • Schritt 1: Seite öffnen → Sektion → Items → Neu
  • Schritt 2: Intro-Text eingeben
  • Schritt 3: YouTube-Code hinzufügen: ![youtube.com](Ihr-Video-Link)
  • Schritt 4: Speichern
  • Ergebnis: Kunden sehen Ihr Video direkt auf der Seite

Beispiel 3: Kategorie-Schaltflächen hinzufügen

  • Schritt 1: Seite öffnen → Items → Mehr → Listengruppen
  • Schritt 2: Wählen Sie die Listengruppen, die Sie als Schaltflächen anzeigen möchten
  • Schritt 3: Speichern
  • Ergebnis: Kunden sehen Schaltflächen zu verschiedenen Kategorien

Beispiel 4: Nur-für-Mitglieder-Sektion

  • Schritt 1: Sektion „VIP-Angebote" erstellen
  • Schritt 2: Anhaken (✓) für nur eingeloggte Kunden
  • Schritt 3: Sonderangebote hinzufügen
  • Ergebnis: Nur eingeloggte Kunden sehen diese Deals

Wichtige Tipps

Tipp 1: Planen Sie Ihre Seitenstruktur

  • Überlegen Sie sich vorher, was wo stehen soll
  • Machen Sie eine Skizze auf Papier
  • Arbeiten Sie von oben nach unten
  • So vermeiden Sie viel Umsortieren im Nachhinein

Tipp 2: Keine Leerzeichen in Dateinamen

  • „banner.png" ✓ Gut
  • „mein banner.png" ✗ Falsch
  • „mein-banner.png" ✓ Gut
  • Verwenden Sie Bindestriche (-) anstelle von Leerzeichen

Tipp 3: Testen Sie immer auf Mobil

  • Prüfen Sie, wie Ihre Seite auf dem Telefon aussieht
  • Viele Kunden shoppen mobil
  • Anpassen, falls nicht gut lesbar

Tipp 4: Halten Sie es übersichtlich

  • Nicht zu viele Elemente auf einer Seite
  • Kunden sollten schnell finden, was sie suchen
  • Weniger ist oft mehr

Tipp 5: Verwenden Sie Sektionen logisch

  • Erstellen Sie separate Sektionen für verschiedene Themen
  • Zum Beispiel: „Aktionen", „Neue Produkte", „Über uns"
  • Das hält Ihre Seite organisiert

Tipp 6: Vorschau vor dem Speichern

  • Laden Sie Ihren Webshop regelmäßig neu, um zu prüfen
  • So sehen Sie sofort, ob es gut ist
  • Anpassen, wo nötig

Tipp 7: Speichern Sie Ihre Markdown-Codes

  • Erstellen Sie ein Dokument mit häufig verwendeten Codes
  • Dann müssen Sie sie nicht jedes Mal nachschlagen
  • Spart Zeit!

Häufig gestellte Fragen

Frage: In welcher Reihenfolge sollte ich Elemente hinzufügen?

  • Die Reihenfolge, in der Sie hinzufügen, ist die Reihenfolge auf der Seite
  • Also zuerst hinzufügen = oben auf der Seite
  • Sie können die Reihenfolge später immer mit den Pfeilen anpassen

Frage: Kann ich ein Element später löschen?

  • Ja, wählen Sie das Element und klicken Sie auf Löschen
  • Oder bearbeiten Sie es, wenn Sie etwas ändern möchten
  • Gelöschte Elemente sind weg, also seien Sie vorsichtig

Frage: Warum sehe ich mein Bild nicht?

  • Prüfen Sie, ob der Dateiname stimmt (Groß-/Kleinschreibung beachten!)
  • Prüfen Sie, ob keine Leerzeichen im Namen sind
  • Prüfen Sie, ob das Bild wirklich hochgeladen wurde
  • Aktualisieren Sie den Webshop mit Strg+F5

Frage: Kann ich HTML statt Markdown verwenden?

  • Hängt von Ihren Systemeinstellungen ab
  • Markdown ist meistens sicherer und einfacher
  • Prüfen Sie die Dokumentation oder fragen Sie Support

Frage: Wie viele Sektionen kann ich erstellen?

  • So viele Sie möchten
  • Aber halten Sie es übersichtlich
  • Zu viele Sektionen machen es verwirrend

Frage: Funktionieren YouTube Shorts auch?

  • Meistens nicht, nur normale YouTube-Videos
  • Testen Sie es, um sicher zu sein
  • Der Code ist derselbe

Was tun bei Problemen?

Problem: Bild erscheint nicht

  • Dateinamen prüfen (keine Leerzeichen, korrekte Schreibweise)
  • Prüfen, ob Bild hochgeladen wurde
  • Versuchen Sie das Bild erneut hochzuladen
  • Prüfen Sie, ob die Endung stimmt (.png, .jpg, .gif)

Problem: YouTube-Video lädt nicht

  • Prüfen Sie, ob der Link korrekt kopiert wurde
  • Versuchen Sie das Video in einem normalen Browser
  • Möglicherweise ist das Video privat oder gelöscht
  • Prüfen Sie, ob Sie den richtigen Markdown-Code verwendet haben

Problem: Reihenfolge ändert sich nicht

  • Aktualisieren Sie die Seite
  • Möglicherweise müssen Sie sich erneut anmelden
  • Prüfen Sie, ob Sie nach der Änderung auf „Speichern" geklickt haben

Problem: Block erscheint nicht

  • Prüfen Sie, ob der Block existiert (in der Blockverwaltung)
  • Webshop aktualisieren
  • Prüfen Sie, ob der Block korrekt konfiguriert ist

Problem: Sektion nicht sichtbar im Webshop

  • Prüfen Sie die Sichtbarkeitseinstellungen (✓, , -)
  • Möglicherweise müssen Sie sich anmelden, um es zu sehen
  • Aktualisieren Sie den Cache Ihres Browsers

Zusammenfassung

Webshop-Seiten anpassen erfolgt durch Hinzufügen von Sektionen und Items zu Ihren Seiten:

Grundlegende Schritte:

  1. Gehen Sie zu Shop → Seiten → wählen Sie die Seite, die Sie anpassen möchten
  2. Klicken Sie auf Sektion → Neu → Namen eingeben → Sichtbarkeit einstellen (✓ = nur eingeloggt, - = immer) → Speichern
  3. Sektion auswählen → klicken Sie auf Items, um Inhalt hinzuzufügen

Inhalt hinzufügen (zwei Optionen):

  • Text/Bild/Video: Klicken Sie Neu → Text eingeben → für Bild verwenden Sie ![](dateiname.png), für YouTube-Video verwenden Sie ![youtube.com](Ihr-Video-Link) → Speichern
  • Blöcke/Elemente: Klicken Sie Mehr → wählen Sie aus: erstellter Block, Schließzeitblock, Bestelltagblock, Login-Block, Suchleiste oder Listengruppen (Schaltflächen) → Speichern

Reihenfolge anpassen:

  • Element auswählen → verwenden Sie Pfeile nach oben (↑) oder unten (↓), um die Position zu ändern
  • Die Reihenfolge in der Liste ist die Reihenfolge im Webshop

Wichtige Punkte:

  • Keine Leerzeichen in Dateinamen für Bilder (verwenden Sie „banner.png" nicht „mein banner.png")
  • Für erweiterte Textformatierung: verwenden Sie Markdown (Überschriften mit #, fett mit **Text**)
  • Mehr Markdown-Tipps: https://github.com/adam-p/markdown-here/wiki/Markdown-Cheatsheet
  • Testen Sie immer auf Mobil und laden Sie regelmäßig neu, um das Ergebnis zu prüfen

Haben Sie Fragen oder benötigen Sie Hilfe? Kontaktieren Sie uns gerne telefonisch unter +31 (0)71 30 20 310 oder senden Sie eine E-Mail an support@easyflor.nl.