
✏️ Edytujemy strony Grav z frontendu: instalacja i prawa dostępu
Kierownik treści wszedł do panelu administracyjnego, znalazł stronę na liście 50 innych, otworzył edytor, poprawił nagłówek, zapisał, wrócił na stronę, odświeżył kartę. Sześć kliknięć dla jednej poprawki. Dla Grav CMS istnieje proste rozwiązanie, wtyczka Editable with ContentTools osadza edytor WYSIWYG bezpośrednio na stronie serwisu: otwierają Państwo stronę, klikają „edytuj", poprawiają tekst i zapisują z powrotem do pliku Markdown bez wchodzenia do panelu administracyjnego.
Wtyczka nie była aktualizowana od 2022 roku (autor oficjalnie zakończył wsparcie), ale działa stabilnie na Grav 1.7 i pokrywa podstawowy scenariusz, edycję prostych stron Markdown bez dynamicznej logiki. Instalacja zajmie pięć minut, a potem edytowanie tekstów na frontendzie stanie się wielokrotnie prostsze.
Poniżej pełna instrukcja od instalacji po uprawnienia, z omówieniem ograniczeń i alternatywą (Fred).
💡 Szybki przegląd:
- Zainstalować wtyczkę przez GPM lub archiwum zip i skopiować konfigurację.
- Skonfigurować git-sync do zatwierdzania poprawek w repozytorium (opcjonalnie).
- Oznaczyć edytowalne obszary shortcodem editable z unikalnymi nazwami.
- Nadać uprawnienia site.editable użytkownikom frontendowym.
- Połączyć sesje panelu administracyjnego z frontendem przez session.split: false.
- Uwzględnić ograniczenia: tylko czysty Markdown, bez Twig i dynamicznych elementów.
Instalacja: przez GPM lub ręcznie
Wtyczkę instaluje się przez Grav Package Manager, standardowy sposób dla każdego rozszerzenia w Grav:
1 bin/gpm install editable-contenttools
Polecenie należy uruchomić z folderu głównego serwisu (tam, gdzie znajduje się bin/). GPM sam pobierze najnowszą wersję i rozpakuje ją do /user/plugins/editable-contenttools.
Alternatywnie można zainstalować ręcznie: proszę pobrać archiwum zip z GitHub, rozpakować w /user/plugins/ i zmienić nazwę folderu na editable-contenttools (bez przyrostka -master). Struktura powinna wyglądać następująco: /user/plugins/editable-contenttools/editable-contenttools.php.
Kopiowanie konfiguracji w bezpieczne miejsce
Po instalacji koniecznie należy skopiować plik konfiguracyjny do katalogu użytkownika:
1 cp user/plugins/editable-contenttools/editable-contenttools.yaml user/config/plugins/editable-contenttools.yaml
Ten krok jest ważny: jeśli ustawienia pozostaną w folderze wtyczki, zostaną zresetowane podczas aktualizacji przez GPM. Alternatywny wariant, instalacja przez panel administracyjny Grav (sekcja Plugins → Add), w tym przypadku system sam tworzy konfigurację w user/config/plugins/ i ręczne kopiowanie nie jest potrzebne.
Konfiguracja: trzy opcje konfiguracji
Plik editable-contenttools.yaml zawiera trzy parametry:
1 enabled: true 2 git-sync: false 3 git-sync-mode: foreground
enabled, włącza wtyczkę. Bez enabled: true edytor nie pojawi się na frontendzie, nawet jeśli uprawnienia zostały nadane. Domyślnie true.
git-sync, uruchamia synchronizację z repozytorium Git po każdym zapisaniu. Działa tylko przy zainstalowanej wtyczce Git Sync. Jeśli Państwa serwis działa na Git i chcą Państwo zatwierdzać każdą zmianę w historii, należy ustawić true. W przeciwnym razie proszę zostawić false.
git-sync-mode, określa, czy czekać na zakończenie synchronizacji przed oddaniem kontroli użytkownikowi. foreground oznacza, że przycisk „Zapisz" odblokuje się dopiero po zakończeniu commita i pusha. background działa asynchronicznie, ale na niektórych serwerach Linux mogą wystąpić problemy z procesami w tle. Dla większości scenariuszy wystarczy foreground.
Oznaczanie edytowalnych obszarów: shortcode [editable]
![Przykład shortcode'u [editable] w pliku Markdown strony Grav](/wp-content/uploads/2020/03/image_1966.avif)
Wtyczka nie czyni całej strony edytowalną automatycznie. Sami definiują Państwo, które bloki można edytować, za pomocą shortcodu [editable]:
1 [editable] 2 ## Заголовок раздела 3 4 Текст, который можно редактировать из фронтенда. 5 [/editable]
Strona może zawierać dowolną liczbę takich obszarów. Każdy obszar musi mieć unikalną nazwę, w przeciwnym razie ContentTools nie będzie wiedział, gdzie zapisać zmiany.
Parametr name: obowiązkowa unikalność
Domyślnie wtyczka nadaje nazwy automatycznie (region-0, region-1 i tak dalej), ale lepiej nadawać znaczące nazwy ręcznie:
1 [editable name="hero-block"] 2 ## Главный заголовок 3 4 Текст, который можно редактировать. 5 [/editable]
Przy pierwszym zapisie przez frontend wtyczka automatycznie doda parametr name do shortcode’a, jeśli go nie było. W praktyce prościej jest wpisać nazwy od razu podczas rozmieszczania znaczników, co ułatwia debugowanie (widzi Pan, który blok Pan edytuje w narzędziach deweloperskich przeglądarki).
Po rozmieszczeniu znaczników i zapisaniu strony proszę wejść na stronę jako użytkownik z uprawnieniem site.editable, kliknąć ikonę ołówka po lewej stronie i edytować tekst jak w zwykłym edytorze tekstowym. Proszę przytrzymać Shift przez około trzy sekundy, a wszystkie dostępne do edycji regiony zostaną podświetlone.
Wypróbować można na stronie demonstracyjnej wtyczki (zapis jest wyłączony, Grav 1.7.46).
Prawa dostępu: frontend i backend
Aby użytkownik zobaczył ikonę ołówka, potrzebuje praw do edycji. Zasady są różne dla użytkowników frontendowych (menedżerów treści) i backendowych (administratorów).
Użytkownicy frontendowi
Użytkownik musi umieć zalogować się do systemu przez wtyczkę Grav Login lub Private Grav. Następnie w pliku konta (user/accounts/username.yaml) proszę dodać:
1 access: 2 site: 3 login: 'true' 4 editable: 'true'
Bez uprawnienia site.editable ikona ołówka nie pojawi się, nawet jeśli użytkownik jest zalogowany i ma inne prawa.
Użytkownicy backendowi (administratorzy)
Domyślnie Grav rozdziela sesje panelu administracyjnego i frontendu. Aby administrator mógł edytować strony bezpośrednio na stronie (bez wchodzenia do panelu administracyjnego), proszę ustawić w system.yaml (lub przez panel administracyjny Configuration → System):
1 session: 2 split: false
To połączy sesje: logowanie do panelu administracyjnego automatycznie przyzna dostęp do edytora frontendowego. Administrator będzie również potrzebował uprawnienia admin.super lub admin.pages w pliku konta.
Jeśli po zalogowaniu ikona się nie pojawiła, proszę sprawdzić cache administratora:
1 admin: 2 super: 'true' 3 login: 'true' 4 cache: 'false'
Parametr cache: false wyłącza cache dla administratora i może rozwiązać problem z niewidoczną ikoną.
Ograniczenia: czego wtyczka NIE potrafi
Wtyczka działa wyłącznie z czystym Markdownem. To ograniczenie architektoniczne, a nie błąd: ContentTools edytuje HTML w przeglądarce, a wtyczka konwertuje HTML z powrotem na Markdown. W tym procesie każdy dynamiczny znacznik zostanie uszkodzony. Proszę nie edytować przez ContentTools treści, które:
- są składane przez szablony Twig (na przykład strony modułowe: bloki podrzędne są wstawiane przez blok nadrzędny dynamicznie, wtyczka nie widzi ich źródła);
- są wstrzykiwane przez inne wtyczki (Page Inject i podobne wstawiają treść z innych stron, jest to proces jednokierunkowy);
- są zmieniane przez JavaScript w przeglądarce (slidery, akordeony i inne elementy interaktywne zostaną przekonwertowane na statyczny HTML);
- zawierają specjalne znaczniki Grav Markdown (obrazy z parametrami
?lightboxi?resizezostaną uszkodzone podczas konwersji HTML → Markdown, parametry przetwarzania znikną).
Zasady bezpieczeństwa są proste:
- Proszę trzymać obrazy i złożone shortcode’y poza obszarami edytowalnymi.
- Proszę tworzyć obszary małe, ich liczba nie jest ograniczona, lepiej 10 małych bloków niż jeden duży obarczony ryzykiem.
- Proszę testować na kopii posta lub w środowisku stagingowym, zanim da Pan dostęp redaktorom.
- Jeśli zauważy Pan różnicę w znacznikach Markdown między wersją z ikoną ołówka a bez niej, proszę wynieść ten fragment poza
[editable].
Alternatywa: wtyczka Fred
Jeśli funkcjonalność Editable with ContentTools nie wystarcza, proszę spojrzeć na Fred, nowszy edytor frontendowy dla Grav, również oparty na ContentTools. Wśród różnic:
- Przesyłanie obrazów przez okno dialogowe (z obracaniem i podstawową obróbką).
- Automatyczne opakowywanie treści przez zdarzenie
onPageProcessed, mniej ręcznego rozmieszczania znaczników shortcode’ami. - Aktywny rozwój: autor przyjmuje zgłoszenia (issues) na GitHubie i rozbudowuje funkcjonalność.
Instalacja przez sklonowanie repozytorium do /user/plugins/fred:
1 cd user/plugins 2 git clone https://github.com/BugHunter2k/grav-plugin-fred.git fred
Uprawnienia nadaje się analogicznie: site.editor: true w koncie użytkownika (proszę zwrócić uwagę, nie site.editable, a site.editor).
Zarówno Editable with ContentTools, jak i Fred rozwiązują to samo zadanie, dają menedżerowi treści narzędzie do szybkiej edycji bez wchodzenia do panelu administracyjnego. Pierwsze sprawdzi się, jeśli potrzebuje Pan prostego, sprawdzonego narzędzia do stron Markdown bez eksperymentów. Drugie, jeśli chce Pan więcej automatyki i jest Pan gotów na ewentualne niedociągnięcia wynikające z aktywnego rozwoju.
Wideo: jak działa ContentTools
Dwuminutowa demonstracja edycji strony Grav w przeglądarce: autor pokazuje, jak podświetlane są obszary edytowalne, wprowadzane są zmiany i zapisywane z powrotem do Markdown. Dobry sposób, aby zobaczyć wtyczkę w działaniu przed instalacją.
⁉️🤔 Często zadawane pytania
Dlaczego ikona ołówka nie pojawia się po instalacji?
Proszę sprawdzić cztery punkty. Po pierwsze,
enabled: truew konfiguracji wtyczki (user/config/plugins/editable-contenttools.yaml). Po drugie, użytkownik musi mieć uprawnieniesite.editablew pliku konta. Po trzecie, dla użytkowników backendowychsession.splitmusi być ustawione nafalsewsystem.yaml. Po czwarte, proszę wyczyścić pamięć podręczną Grav:bin/grav clear-cache. Zazwyczaj problem leży albo w uprawnieniach, albo w sesjach dzielonych.
Czy można edytować strony modułowe?
Nie. Strony modułowe są składane ze stron podrzędnych za pomocą szablonów Twig, jest to proces jednokierunkowy, wtyczka nie może „rozłożyć" wyniku z powrotem na części. Na frontendzie widzą Państwo gotowy HTML, ale źródło (poszczególne pliki Markdown modułów podrzędnych) znajduje się w innych folderach, wtyczka nie wie, gdzie zapisać zmiany. W przypadku stron modułowych proszę korzystać ze standardowego interfejsu administracyjnego Grav.
Co się stanie, jeśli pozostawię obraz wewnątrz [editable]?
Specjalne znaczniki Grav Markdown dla obrazów (z parametrami
?lightbox,?resize,?cropResize) zostaną uszkodzone podczas konwersji HTML do Markdown. Sam obraz pozostanie na miejscu (tag<img>zostanie przekonwertowany na zwykły Markdown), ale parametry przetwarzania znikną. Wniosek: obrazy z parametrami zawsze poza obszarem edytowalnym. Jeśli obraz jest prosty (bez parametrów), technicznie można go pozostawić wewnątrz, ale w praktyce bezpieczniej jest umieszczać wszystkie media poza[editable].
Wtyczka została porzucona przez autora, czy bezpiecznie jest jej używać?
Autor oficjalnie ogłosił rezygnację ze wsparcia w 2022 roku, ostatni commit pochodzi z sierpnia 2024 roku (aktualizacja kompatybilności z Grav 1.7). Wtyczka jest stabilna na Grav 1.7 i nie dotyka krytycznych dla bezpieczeństwa komponentów: działa tylko z treścią Markdown i nie ma dostępu do operacji serwerowych. Jeśli planują Państwo migrację na Grav 2.0, lepiej spojrzeć w stronę Fred lub poczekać na oficjalne rozwiązanie do edycji frontendowej (na forum dyskutowane są nowe podejścia oparte na TinyMCE i Prosemirror).
Czym różni się Editable with SimpleMDE od wersji z ContentTools?
Editable with SimpleMDE wykorzystuje to samo podejście (edycja frontendowa), ale zamiast edytora wizualnego umieszcza edytor Markdown SimpleMDE z podglądem na żywo. Sprawdzi się u tych, którzy wolą pisać znaczniki ręcznie i chcą widzieć wynik po prawej stronie edytora, a nie w trybie WYSIWYG. Obie wtyczki pochodzą od tego samego autora (bleutzinn) i obie zostały porzucone od 2022 roku.
Czy warto instalować edytor frontendowy dla Grav w 2026 roku
Jeśli Państwa strona na Grav 1.7 składa się z prostych stron Markdown, a redaktorzy treści mają dość wchodzenia do panelu administracyjnego dla kilku poprawek, proszę zainstalować Editable with ContentTools. Pięć minut na instalację, minimum konfiguracji: edycja staje się jedno kliknięciowa. Otwierają Państwo stronę, klikają ołówek, poprawiają tekst, zapisują. Żadnego szukania na liście stron, żadnego przełączania zakładek.
W przypadku nowych projektów lub planując migrację na Grav 2.0 (wydanie spodziewane jest w 2026 roku, choć nie ma dokładnej daty), proszę przyjrzeć się Fred: rozwija się on aktywniej i z większym prawdopodobieństwem uzyska kompatybilność z drugą wersją CMS. W każdym razie edycja frontendowa oszczędza dziesiątki kliknięć i minuty czasu przy każdej poprawce, co jest szczególnie odczuwalne na stronach z częstymi aktualizacjami treści. Proszę wypróbować na środowisku testowym i zdecydować, na ile takie podejście przyspiesza Państwa proces pracy.



