CMS bez bazy danych? Recenzja Grav

08.12.2023 13:00 | 7 min

Tagi: NarzędziaSelf-hostingTworzenie treści

Ostatnio wspominałem o systemie CMS Grav, na którym opiera się mój blog. Dziś mam zamiar przyjrzeć się mu bliżej, a także przejrzeć wtyczki, których używam, bo w oficjalnej bazie rozszerzeń istnieje ich ponad 400. Będzie zatem okazja do zaczerpnięcia inspiracji.


Pod koniec października wysłałem do wszystkich subskrybentów newslettera ankietę, w której zapytałem o odbiór i oczekiwania wobec otrzymywanych treści. W efekcie rozszerzyłem formułę mailingu raz w tygodniu wysyłam ciekawe linki i materiały. Chcesz otrzymywać takiego maila co tydzień? Zapisz się tutaj.


Zrzut ekranu strony internetowej Grav - getgrav.org

Grav został napisany w języku PHP, korzysta z frameworka Symfony. Pierwszą, w zasadzie główną jego cechą jest fakt, że nie używa on bazy danych. Przechowywanie informacji odbywa się w odpowiednich w plikach dane w YAML, a strony w Markdown. Taki model działania nazywa się flat-file. Do innych popularnych CMS-ów działających w ten sposób należą Kirby i Bludit. Mimo że strony przechowywane są w plikach Markdown, możemy bezproblemowo używać w nich kodu HTML (gdy użytkownik otwiera stronę, Markdown i tak jest tłumaczony na HTML, by przeglądarka mogła go wyświetlić).

Co ciekawe, Grav domyślnie nie posiada panelu administracyjnego. Stronami można zarządzać przez dodawanie/usuwanie/edycję folderów i plików w ścieżce /user/pages, a konfigurację systemu można zmienić w plikach ścieżki /user/config. Nie jest to podejście szczególnie popularne, ale jak najbardziej możliwe. Do większości użytkowników przemawia jednak bardziej panel, do którego działania konieczne jest zainstalowanie tej wtyczki. Sam korzystam właśnie z panelu i właśnie do takiego workflow odnosi się to, co napiszę poniżej.

Podgląd systemu backupów oraz powiadomień od twórców aplikacji

Skoro mowa o instalacji wtyczek, Grav umożliwia wykonanie tej czynności trzema metodami:

Polecane wtyczki

Z wszystkich wtyczek, o których mowa poniżej, korzystam na blogu jeżeli coś się zmieni, lista zostanie uzupełniona (ostatnia aktualizacja: 08.12.2023).

Admin Addon Media Metadata

Ta wtyczka umożliwia zarządzanie metadanymi plików, których używamy na stronach. Umożliwia on ustawienie tytułów opisów (alt-text) zdjęciom i innym mediom. O ile możemy zarządzać tymi parametrami, gdy np. osadzamy obrazek na stronie (odbywa się to bezpośrednio w składni Markdown/HTML), o tyle nie jest to możliwe, gdy ten obrazek osadzany jest bezpośrednio w szablonie (na poziomie motywu).

Lista zdjęć, wyszczególnione zdjęcie przedstawiające Biurko, na nim laptop, kubek, notes i telefon; obok okno edycji metadanych, w tym tekstu alternatywnego wspomnianego zdjęcia

Auto Author i Auto Date

Te dwie wtyczki są jednocześnie bardzo proste i przydatne. Dzięki nim, gdy tworzę nową stronę, automatycznie zapisywane są dla niej data i godzina (dla strefy czasowej zdefiniowanej w ustawieniach Grav) oraz autor (aktualnie zalogowany użytkownik wykonujący działanie). Można oczywiście tworzyć i modyfikować te parametry ręcznie, ale dzięki wtyczkom ich startowe wartości są nadawane z automatu.

Automagic Images

Myślę, że to jedna z istotniejszych wtyczek na moim blogu. To dzięki niej wszystkie zdjęcia, które zamieszczam w artykułach, są automatycznie konwertowane do wersji w kilku różnych rozdzielczościach. Ponadto, do znacznika <img> zwracanego użytownikowi w kodzie HTML strony dodawany jest atrybut srcset, dzięki któremu zdjęcia dopasowują się do urządzenia, na którym wyświetla on stronę.

Draft Preview

Wtyczki potrafią także usprawnić sam proces tworzenia treści. Edytor w panelu administracyjnym Grav umożliwia podgląd strony w takim widoku:

Widok treści niniejszego artykułu w edytorze Markdown

Draft Preview umożliwia podejrzenie, jak będzie się ona prezentować w użytym szablonie (pokazuje treść tak, jak będzie wyglądać na stronie, gdy zostanie opublikowana). Odbywa się to przez specjalny przycisk, który zobaczymy, gdy przejdziemy do edytowania konkretnej strony. Nie ulega wątpliwości, że podejrzenie artykułu dokładnie tak, jak zobaczą go czytelnicy (ale nie wszyscy w tym miejscu pozdrawiam wszystkich, którzy czytają bloga przez RSS-a 😉) ułatwia pisanie, a przede wszystkim korektę.

External Links

Tu wchodzimy już w tematy bezpieczeństwa. Na mojej stronie wszystkie zewnętrzne linki posiadają atrybut target="_blank" (jest on dodawany automatycznie przez opisywaną wtyczkę), który powoduje, że otwiera się on w nowej karcie przeglądarki. Takie działanie naraża użytkownika na duże niebezpieczeństwo otwarta (zewnętrzna) strona uzyskuje dostęp do właściwości opener obiektu window w JavaScript może więc chociażby przekierować kartę, w której otwarta była strona (ta, na której znajdował się link) pod inny adres. To duże ryzyko, prawda?

Rozwiązanie jest prostsze, niż mogłoby się wydawać. Wystarczy skorzystać z atrybutu rel="noopener". I tym także zajmuje się opisywana wtyczka. Znajdziemy tam także inne opcje konfiguracji, takie jak np. stylowanie zewnętrznych linków.

Feed

Ta wtyczka wykonuje z pozoru proste działanie, ale jest ono według mnie bardzo ważne. Tworzy ona kanał RSS dla naszej strony, dzięki czemu czytelnicy mogą dodać ją do swojego klienta i wygodnie czytać wszystkie subskrybowane treści w jednym miejscu. Więcej o technologii RSS, jej możliwościach i strategii zarządzania treściami przeczytasz w tym artykule. Na uwagę zasługuje możliwość tworzenia kanału zarówno w standardowym formacje RSS, jak również Atom i JSON.

Markdown Color

Płynnie przechodzimy do wtyczek skupionych na tekście. Ta, jak sama nazwa wskazuje, umożliwia nadawanie tekstowi koloru. Przykładowo, gdy w edytorze wpiszemy taki tekst:

To jest {c:red}czerwony tekst{/c}, a to jest {c:#000099}niebieski (#000099) tekst{/c}.

Uzyskamy taki efekt:
To jest czerwony tekst, a to jest niebieski (#000099) tekst.

Markdown Details

Z kolei ta wtyczka umożliwia nam korzystanie z tagu <details>, dostępnego w języku HTML. I ponownie, pokażę to na przykładzie jeśli w edytorze wpiszemy taki tekst:

Widok niesformatowanego tekstu, który znajduje się poniżej

Uzyskamy taki efekt:

Tytuł

Tekst w środku

Bywa to przydatne gdy chcemy zamieścić w treści dodatkowe wyjaśnienia. U mnie przydało się to głównie na stronie z informacjami prawnymi, gdzie zamieściłem techniczne szczegóły jednego z wdrożonych rozwiązań oraz tzw. privacy beacon, czyli listę pozwalającą sprawdzić, czy przetwarzane dane były udostępniane służbom.

Markdown Typography

Pozostajemy w temacie zarządzania treścią i formatowaniem. Ta wtyczka pomaga zadbać o typografię, wprowadzając dodatkowe znaki, takie jak pauza/półpauza (, ), wielokropek, strzałki (np. , ), znak ± oraz × . Pozwala to polepszyć czytelność tekstu, nie wymagając od autora ręcznego wstawiania dodatkowych znaków.

Reading Time

Ta wtyczka pozwala oszacować czas czytania artykułu, przeliczając słowa na minuty. Właśnie dzięki niej na blogu, obok daty publikacji znajduje się informacja ile minut zajmie mniej więcej przeczytanie artykułu.

Zrzut ekranu jednego z poprzednich artykułów na blogu; obok daty publikacji napis "9 min"

Podsumowanie

Gdy w styczniu uruchamiałem bloga, miałem już swoje doświadczenia z Gravem i umiałem go używać. W zasadzie jest to drugi (po Netlify CMS) system, którego miałem okazję się nauczyć znam go zatem nieporównywalnie lepiej niż np. Wordpressa, z którego korzystałem tylko kilka razy. Choć moja perspektywa może być lekko zakrzywiona, uważam, że Grav jest całkiem prosty i intuicyjny. Nie jest to może najlepszy wybór dla każdego, ale gdy trochę się go poużywa, staje się łatwy i wygodny. Osobom nietechnicznym poleciłbym raczej Wordpressa, ponieważ posiada on więcej wtyczek pozwalających zintegrować stronę z innymi usługami. Oczywiście, jeśli masz chęci i trochę czasu, to moim zdaniem, przy odrobinie samozaparcia będziesz w stanie skonfigurować workflow o podobnych możliwościach, korzystając z Grava i innych narzędzi.

Linki, materiały

Udostępnij

Komentarze