🖱️ Klick für Klick

1. Schritt 1: Öffne vorne die Website und rufe die Startseite auf.
   💡 Warum? Wir öffnen zuerst die echte Seite, damit wir sicher die richtige Startseite bearbeiten.
   👀 Das solltest du sehen: Du siehst die importierte Modern-Shop-Startseite.
2. Schritt 2: Klicke oben in der schwarzen WordPress-Leiste auf Mit Elementor bearbeiten.
   💡 Warum? Dieser Befehl startet den visuellen Editor für genau diese Seite.
   👀 Das solltest du sehen: Links erscheint Elementor, rechts die bearbeitbare Vorschau.
3. Schritt 3: Warte, bis links das Elementor-Bedienfeld und rechts die Seite sichtbar sind.
   💡 Warum? Der Editor braucht kurz Zeit, um alle Bausteine zu laden.
   👀 Das solltest du sehen: Die Ladeanzeige verschwindet und Elemente lassen sich anklicken.
4. Schritt 4: Klicke auf die große Hauptüberschrift im ersten Bildschirmbereich. Ersetze nur den Text durch euren Shopnamen oder einen kurzen Werbesatz.
   💡 Warum? Die Hauptüberschrift erklärt Besuchern in wenigen Sekunden, worum es im Shop geht.
   👀 Das solltest du sehen: Der neue Text ist direkt in der großen Überschrift sichtbar.
5. Schritt 5: Klicke im linken Bedienfeld unten auf Aktualisieren. Speichere nach jeder größeren Änderung.
   💡 Warum? Zwischenspeichern schützt deine Arbeit, falls Browser oder Computer später ein Problem bekommen.
   👀 Das solltest du sehen: Unten erscheint eine kurze grüne Speicherbestätigung.
6. Schritt 6: Klicke auf die Schaltfläche im Titelbereich. Ändere den Text zu Jetzt entdecken und verlinke sie auf die vorhandene Shopseite.
   💡 Warum? Ein Button soll Besucher zu einem klaren Ziel führen – hier zur Produktübersicht.
   👀 Das solltest du sehen: Der Button zeigt Jetzt entdecken und öffnet die Shopseite.
7. Schritt 7: Klicke auf das große Hintergrundbild. Wähle Stil → Hintergrund und ersetze das Bild durch ein geeignetes eigenes Produktbild.
   💡 Warum? Das große Bild erzeugt den ersten Eindruck und soll zu den angebotenen Produkten passen.
   👀 Das solltest du sehen: Dein ausgewähltes Bild erscheint im oberen Seitenbereich.
8. Schritt 8: Bearbeite die vorhandenen Kategorien. Ändere Namen und Bilder, aber lösche nicht die gesamte Section.
   💡 Warum? Kategorien helfen Besuchern, Produkte schneller zu finden.
   👀 Das solltest du sehen: Die vorhandenen Kacheln zeigen eure eigenen Namen und Bilder.
9. Schritt 9: Öffne unten den Navigator. Er zeigt die Struktur: Section → Spalte/Container → Widget. Nutze ihn, wenn Elemente schwer anklickbar sind.
   💡 Warum? Der Navigator ist wie ein Bauplan und zeigt, welches Element in welchem Behälter liegt.
   👀 Das solltest du sehen: Ein Strukturfenster mit Containern und Widgets öffnet sich.
10. Schritt 10: Klicke unten auf das Symbol für Responsive Modus. Prüfe Desktop, Tablet und Smartphone.
    💡 Warum? Eine gute Seite muss auch auf kleinen Bildschirmen lesbar und bedienbar sein.
    👀 Das solltest du sehen: Du kannst zwischen Desktop, Tablet und Smartphone wechseln; nichts ragt seitlich heraus.
11. Schritt 11: Klicke erneut auf Aktualisieren und öffne die Seite in einem neuen Tab.
    💡 Warum? Der letzte Speichervorgang übernimmt alle Änderungen endgültig.
    👀 Das solltest du sehen: Die öffentliche Seite zeigt dieselben Texte und Bilder wie der Editor.

🔎 Selbstkontrolle

• ☐ Shopname im Titelbereich angepasst.
• ☐ Button führt zum Shop.
• ☐ Mindestens ein Bild ersetzt.
• ☐ Startseite gespeichert.
• ☐ Mobilansicht kontrolliert.