Edytor strony

Przegląd

Edytor strony to wizualny edytor drag-and-drop Cmssy do komponowania stron z bloków. Otwiera się gdy klikniesz stronę w sidebarze. Układasz bloki na płótnie, edytujesz ich treść w panelu właściwości, przełączasz między językami i publikujesz gdy gotowe.

Układ

Edytor dzieli się na pięć stref:

• Górny pasek — tytuł strony, plakietka Draft (dla nieopublikowanych stron), przyciski Cofnij/Ponów, przełącznik języka i menu trzech kropek z akcjami strony (Publikuj, Cofnij do opublikowanej, Podgląd itp.).
• Lewy sidebar — drzewo stron Twojego workspace. Kliknij stronę żeby otworzyć. Przeciągaj strony żeby zmienić kolejność. Zmiennej szerokości (256-512 px).
• Prawy drawer (Biblioteka Bloków) — katalog wszystkich bloków dostępnych w tym workspace, pogrupowany po kategorii. Przeciągaj stąd na płótno żeby dodać.
• Płótno — podgląd strony. Bloki renderują się tak jak będą na żywej stronie. Kliknij dowolny blok żeby go zaznaczyć.
• Panel właściwości — wysuwa się z prawej gdy zaznaczysz blok. Każde pole ze schematu bloku pojawia się tutaj (inputy tekstowe, pickery mediów, linków, kolorów itp.).

Dodawanie bloku

1. Otwórz Bibliotekę Bloków po prawej.
2. Znajdź blok którego chcesz (scroll lub przeglądanie kategorii).
3. Przeciągnij go na płótno.
4. Upuść na dole (dopina) lub między istniejące bloki (wstawia na tę pozycję).

Po upuszczeniu blok pojawia się z domyślną treścią (ze schematu bloku). Kliknij go żeby otworzyć panel właściwości i dostosować.

Drag-and-drop to jedyny sposób na dodanie bloku — dzisiaj nie ma przycisku „kliknij żeby wstawić”.

Edycja treści bloku

Kliknij dowolny blok na płótnie żeby go zaznaczyć. Panel właściwości otwiera się po prawej. Pola renderują się na podstawie schematu bloku:

• Tekst — inline input / textarea.
• Rich text — otwiera dedykowany edytor pływający na dole (bold, italic, listy, linki).
• Media (obraz/wideo) — picker mediów otwiera bibliotekę; wybierz istniejące lub wgraj nowe.
• Link — URL + etykieta; picker też sugeruje wewnętrzne strony.
• Kolor — picker koloru z tokenami motywu.
• Select / checkbox / radio — dropdown lub togglers z listy opcji schematu.
• Repeater — dla bloków z listami sub-elementów (np. testimonials, FAQ), dodaj/usuń wiersze inline.

Edycja per język

Przełącznik języka w górnym pasku przełącza, którego locale treść edytujesz. Przełączenie z angielskiego na polski:

• Zapisuje aktualne wartości pól do kopii angielskiej.
• Ładuje kopię polską do panelu właściwości i płótna.
• Pola puste w polskim pokazują placeholder, nie fallback na angielski.

Każde pole tekstowe jest przechowywane per język. Liczby, ID i ustawienia (np. URL-e obrazów) są współdzielone między językami.

Przenoszenie i usuwanie bloków

Najedź kursorem na blok na płótnie żeby odsłonić kontrolki:

• Uchwyt do przeciągania (ikona grip) — przeciągaj góra/dół żeby zmienić kolejność.
• Usuń — kliknij ikonę kosza LUB naciśnij Delete / Backspace gdy blok jest zaznaczony (i żadne pole tekstowe nie jest sfocusowane).
• Duplikuj — skrót klawiszowy Cmd+D (macOS) / Ctrl+D (Win/Linux).

Dialog potwierdzenia się nie pojawia — usunięcia są natychmiastowe ale w pełni odwracalne przez Cofnij.

Cofnij i ponów

• Cmd+Z / Ctrl+Z — cofnij ostatnią zmianę.
• Cmd+Shift+Z / Ctrl+Shift+Z — ponów.

Historia jest trzymana per strona, do 50 kroków. Przełączenie na inną stronę zachowuje historie obu stron niezależnie. Edycja tekstu ma własne natywne cofanie które nie zjada historii bloków.

Auto-save i ręczny save

Drafty auto-save'ują się do localStorage Twojej przeglądarki co 500 ms po tym jak przestaniesz pisać. Jeśli zamkniesz zakładkę lub odświeżysz, podnosisz od miejsca gdzie byłeś przy następnym otwarciu.

Save na serwer dzieje się gdy klikniesz Zapisz (dół panelu właściwości) lub naciśniesz Cmd+S / Ctrl+S. Toast potwierdza sukces. Lokalny draft jest czyszczony po pomyślnym save'ie na serwer.

LocalStorage jest per-urządzenie. Jeśli edytujesz z innej przeglądarki lub komputera, lokalny draft za tobą nie idzie — tylko ostatni stan zapisany na serwer.

Draft vs opublikowane

Każda strona ma dwa stany swoich bloków:

• Draft — to co widzisz i edytujesz w edytorze. Zawsze najnowsze.
• Opublikowane — to co odwiedzający widzą na żywej stronie.

Plakietka Draft w górnym pasku pojawia się zawsze gdy strona ma niezopublikowane zmiany (lub nigdy nie była opublikowana).

Z menu trzech kropek:

• Publikuj — kopiuje aktualny draft do opublikowanej. Odwiedzający widzą zmianę natychmiast (przy czym podlega cache CDN, zwykle sekundy).
• Wycofaj publikację — zabiera stronę offline (odwiedzający dostają 404). Draft pozostaje.
• Cofnij do opublikowanej — odrzuca wszystkie zmiany draftu, resetuje do ostatniej opublikowanej wersji. Nieodwracalne poza głębokością cofania.

Bloki layoutu (header / footer / sidebary)

Bloki layoutu — header, footer, sidebary — renderują się na każdej stronie przez dziedziczenie. W edytorze pojawiają się wokół treści strony z własnymi kontrolkami overlay.

• Kliknij blok layoutu żeby go edytować tak jak każdy inny.
• Zmiany w dziedziczonym bloku layoutu propagują się na wszystkie strony które go dziedziczą.
• Konkretna strona może nadpisać blok layoutu — zmiana dotyczy wtedy tylko tej strony.

Pełne szczegóły: Layouty.

Podgląd

Menu trzech kropek → Podgląd otwiera Twój aktualny draft w nowej zakładce pod podpisanym URL-em podglądu. Przydatne do weryfikacji wyglądu przed publikacją.

Menu trzech kropek → Otwórz stronę otwiera opublikowany URL (404 jeśli nieopublikowana).

Tryb interakcji

Przełącznik w prawym dolnym rogu płótna przełącza między dwoma trybami:

• Tryb edycji (domyślny) — kontrolki overlay widoczne, kliknięcia zaznaczają bloki, linki w blokach są nieaktywne.
• Tryb interakcji — overlay ukryte, linki i formularze działają tak jak na żywej stronie. Użyj żeby przetestować interaktywne zachowanie bez opuszczania edytora.

Skróty klawiszowe — referencja

Zamień Cmd na Ctrl na Windows i Linux. Wszystkie skróty są zablokowane gdy piszesz w polu tekstowym — więc natywne cofanie tekstu, usuwanie itp. nadal działają normalnie.

Czego edytor jeszcze nie robi

• Brak przełącznika podglądu responsywnego. Płótno jest płynne ale nie symuluje konkretnych szerokości urządzeń. Użyj przycisku Podgląd i zmieniaj rozmiar przeglądarki żeby przetestować.
• Brak real-time collaboration. Jeśli dwóch użytkowników edytuje tę samą stronę jednocześnie, ostatni save wygrywa. Koordynujcie edycje po stronach lub sekcjach.
• Brak historii wersji poza cofaniem. Cofnij do opublikowanej to najgłębszy rollback. Jeśli potrzebujesz nazwanych wersji lub długoterminowej historii, eksportuj przed dużymi zmianami.