Der Editor im Überblick
Ein Rundgang durch den Payly-Editor: die obere Leiste, das Panel „Blöcke“, die Arbeitsfläche und das Einstellungspanel sowie Speichern, Rückgängigmachen und Tastenkürzel.
Im Editor bauen Sie die Seiten Ihres Shops. Sie sehen jede Seite so, wie Besucher sie sehen werden, und ändern sie, indem Sie Elemente auswählen, verschieben und ihre Einstellungen ausfüllen. Nichts davon ist für Besucher sichtbar, bis Sie veröffentlichen.
Den Editor öffnen
- Öffnen Sie das Dashboard Ihrer Website.
- Klicken Sie oben im linken Menü auf Website bearbeiten.
Eine ganz neue Website öffnet sich direkt nach der Wahl eines Designs von selbst im Editor. Siehe Ihre erste Website erstellen.
Die vier Bereiche
Der Editor hat oben eine Leiste und darunter drei Spalten: links das Panel „Blöcke“, in der Mitte Ihre Seite (die Arbeitsfläche) und rechts das Einstellungspanel.

Die obere Leiste
Von links nach rechts enthält die obere Leiste diese Elemente:

- Dashboard bringt Sie zurück zum Dashboard Ihrer Website.
- Der Speicherstatus zeigt, wie es um Ihre Arbeit steht. Gespeichert, nicht veröffentlicht bedeutet: Ihre Änderungen sind in Ihrem Entwurf gespeichert, Ihr Live-Shop zeigt sie aber noch nicht. Gespeichert und veröffentlicht bedeutet: Ihr Live-Shop entspricht dem, was Sie sehen. Nach jeder Änderung sehen Sie außerdem kurz Wird gespeichert…, und Nicht gespeichert, wenn das Speichern fehlschlägt.
- Das Feld Name der Website zeigt den Namen Ihres Shops. Klicken Sie darauf, um Ihre Website umzubenennen.
- Die Seitenauswahl (sie zeigt den Namen der aktuellen Seite, zum Beispiel Start) listet Ihre Seiten auf. Wählen Sie eine aus, um sie zu bearbeiten. Seiten verwalten am Ende der Liste öffnet die Seitenverwaltung. Siehe Seiten hinzufügen und verwalten.

- Desktop, Tablet und Mobil schalten die Bildschirmgröße um, für die Sie gestalten. Siehe Ihre Website auf Smartphones und Tablets richtig darstellen.
- Das Uhrsymbol (Sicherungen) öffnet Ihre gespeicherten Sicherungen. Siehe Änderungen rückgängig machen und eine frühere Version wiederherstellen.
- Die beiden Pfeile sind Rückgängig und Wiederherstellen.
- Das Symbol mit dem Pfeil aus einem Kasten (Live-Website ansehen) öffnet Ihren Live-Shop in einem neuen Tab. Es erscheint, sobald Sie veröffentlicht haben.
- Vorschau zeigt Ihre ganze Website samt funktionierenden Links in einem neuen Tab. Siehe Ihre Website vor dem Veröffentlichen ansehen.
- Veröffentlichen stellt Ihre Änderungen in Ihrem Live-Shop bereit. Siehe Ihre erste Website veröffentlichen.
- Das Kontomenü ganz rechts enthält Design und Sprache für Payly selbst (sie verändern Ihren Shop nicht) sowie Einstellungen, Payly-Startseite und Abmelden.
Das Panel „Blöcke“
Die linke Spalte beginnt mit Blöcke, den Bausteinen, die Sie einer Seite hinzufügen können, sortiert in Gruppen: Grundlagen, Medien, Layout, Shop, Marketing und Menüs & Formulare. Ziehen Sie einen Block auf die Seite oder klicken Sie darauf, um ihn am Ende des aktuellen Abschnitts einzufügen. Siehe Blöcke hinzufügen, verschieben und in der Größe ändern.
Scrollen Sie in derselben Spalte nach unten, finden Sie Struktur, eine Liste mit der Kopfzeile, den Abschnitten der aktuellen Seite und der Fußzeile sowie der Schaltfläche Abschnitt hinzufügen. Siehe Mit Abschnitten arbeiten.
Die Arbeitsfläche
Die Bildschirmmitte ist Ihre Seite. Sie wird von demselben Code gezeichnet wie Ihr Live-Shop, Sie sehen also genau das, was Besucher bekommen. Klicken Sie auf einen Block oder Abschnitt, um ihn auszuwählen. Ein ausgewählter Block erhält einen blauen Rahmen, Griffe zur Größenänderung und eine kleine Werkzeugleiste mit den Schaltflächen Duplizieren, Rotation und Löschen. Links auf der Arbeitsfläche öffnen sich nicht, wenn Sie darauf klicken.
Das Einstellungspanel
Die rechte Spalte hat zwei Tabs:
- Auswahl zeigt die Einstellungen des aktuell Ausgewählten. Ist nichts ausgewählt, zeigt sie die Einstellungen der Seite selbst: Browsertitel, Suchbeschreibung und den Schalter Dies ist die Shopseite. Wählen Sie einen Block aus, sehen Sie seine Einstellungen, gruppiert unter Überschriften wie Allgemein, Typografie, Größe und Position und Verwalten. Klicken Sie auf eine Überschrift, um sie zu öffnen. Um zu den Seiteneinstellungen zurückzukehren, klicken Sie oben im Panel auf Seiteneinstellungen, drücken Sie Esc oder klicken Sie auf die graue Fläche neben der Seite.
- Website-Design enthält die Farben, Schriften und Layout-Einstellungen, die für alle Seiten gelten. Siehe Farben, Schriftarten und Layout festlegen.

So funktioniert das Speichern
Der Editor speichert für Sie. Kurz nachdem Sie etwas geändert haben, speichert er Ihren Entwurf, und der Status in der oberen Leiste kehrt zu Gespeichert, nicht veröffentlicht zurück. Es gibt keine Schaltfläche „Speichern“.
Eine gespeicherte Änderung ist noch nicht live. Ihre Besucher sehen weiterhin Ihre zuletzt veröffentlichte Version, bis Sie auf Veröffentlichen klicken.
Rückgängig machen und wiederherstellen
Klicken Sie auf Rückgängig, um Ihre letzte Änderung zurückzunehmen, und auf Wiederherstellen, um sie zurückzuholen. Beide merken sich die Änderungen, die Sie seit dem Öffnen des Editors vorgenommen haben. Wenn Sie den Editor schließen oder neu laden, beginnt dieser Verlauf wieder bei der gespeicherten Version.
Tastenkürzel
Auf einem Mac verwenden Sie Cmd statt Strg.
| Tasten | Was sie bewirken |
|---|---|
| Strg + Z | Letzte Änderung rückgängig machen |
| Strg + Umschalt + Z | Wiederherstellen |
| Strg + D | Ausgewählten Block duplizieren |
| Entf oder Rücktaste | Ausgewählten Block löschen |
| Esc | Auswahl aufheben |
| Pfeiltasten | Ausgewählten Block um 1 Pixel verschieben (mit gedrückter Umschalt-Taste um 10) |
| Strg + Pfeiltasten | Ausgewählten Block um eine Rasterzelle verschieben |
| Strg + Umschalt + Pfeiltasten | Ausgewählten Block um eine Zelle breiter, schmaler, höher oder niedriger machen |