Strona, która miała stać się systemem
Stowarzyszenie Rzemieślnik zrzesza piekarnie, cukiernie, lodziarnie i zakłady mięsne, które wytwarzają tradycyjnie, bez skrótów technologicznych przemysłu spożywczego. Prowadzi konkursy, szkolenia i projekty edukacyjne, a własna aplikacja mobilna pokazuje punkty sprzedaży zweryfikowanych rzemieślników z całej Polski.
Dotychczasowa strona powstała w kreatorze WebWave. Do publikowania aktualności wystarczała, ale Stowarzyszenie rosło szybciej niż ona. Członkostwo prowadzone było mailowo, lista zakładów na stronie rozjeżdżała się z aplikacją, a Prezes zgłaszał, że część z pokazywanych firm „już dawno nie istnieje”. Potrzebny był serwis, który redakcja obsłuży bez programisty, a który jednocześnie poprowadzi członkostwo zgodnie ze statutem.
Migracja z kreatora, który nie oddaje danych
WebWave nie ma eksportu treści. Strona istniała tylko jako wynik w przeglądarce, a kreator ustawia każdy element na sztywno w pikselach, więc kolejność w kodzie nie odpowiada temu, co widzi czytelnik. Stopka bywa pierwszym elementem dokumentu, a zdjęcia mają w kodzie zaślepkę zamiast adresu.
Napisaliśmy więc narzędzie, które czyta stronę tak, jak czyta ją człowiek. Prawdziwą kolejność bloków odtwarza z położenia elementów zapisanego w arkuszach stylów, zdjęcia pobiera w największej dostępnej rozdzielczości, a elementy powtarzalne, takie jak menu i stopka, odsiewa statystycznie. Ten sam zestaw skryptów pobrał z aplikacji Stowarzyszenia dane zakładów i produktów.
Skrypty są powtarzalne: ponowne uruchomienie dociąga tylko to, czego brakuje. Dzięki temu zrzut można było odświeżyć tuż przed startem, gdy redakcja zdążyła jeszcze opublikować nowe wpisy na starej stronie. Stare adresy miały w nazwach wykrzykniki i nietypowe znaki, więc mapa przekierowań porównuje je po zdekodowaniu i działa tylko tam, gdzie nowa strona zwróciłaby błąd 404.
Jeden zakład, wiele punktów sprzedaży
Aplikacja Rzemieślnik przechowuje punkty sprzedaży: sklep firmowy, stoisko, piekarnię. Pierwsze podejście, wpis na każdy punkt, dawało na stronie po kilka profili tej samej firmy. Zmieniliśmy model: jedna wizytówka na firmę, a jej punkty jako lista z adresami, współrzędnymi i godzinami otwarcia. Mapa pokazuje wszystkie punkty, a każdy znacznik prowadzi do tego samego profilu.
Dane nie są czytane z aplikacji przy każdym wyświetleniu, tylko kopiowane do strony raz na dobę, w nocy. Dzięki temu strona działa także wtedy, gdy serwer aplikacji nie odpowiada, wyszukiwarka i mapa nie czekają na zewnętrzne zapytania, a redakcja może dopisać do profilu historię, galerię i motto, których aplikacja nie przechowuje.
Automat, który sam ukrywa firmy, jest groźny przy pierwszej awarii po drugiej stronie. Dlatego synchronizacja przerywa pracę, gdy aplikacja zwróci mniej niż 60% znanych firm, nie ukryje w jednym przebiegu więcej niż 10% zakładów, nie nadpisze punktów, jeśli wszystkie współrzędne wypadają poza Polską, i nie ruszy wpisów, które redakcja świadomie wstrzymała. Pola uzupełnione ręcznie przez redakcję lub członka nie są nadpisywane nigdy.
Pierwszy przebieg uporządkował to, na co skarżył się Prezes: osiem zakładów nieobecnych w aplikacji zniknęło ze strony, dwa nowe się pojawiły. Od tej pory liczba wizytówek na stronie jest równa liczbie firm w aplikacji. W panelu przy każdym polu wizytówki widać, skąd pochodzi: „z aplikacji, tylko do odczytu”, „z aplikacji tylko na start” albo „tylko na stronie”.
Członkostwo prowadzone przez statut, nie przez skrzynkę mailową
Najważniejsza część serwisu nie jest widoczna z zewnątrz. Statut Stowarzyszenia opisuje cztery kategorie członków, tryb przyjęcia z audytem standardów produkcji, odmowę z prawem do ponownego wniosku po sześciu miesiącach i skreślenie. Zamieniliśmy te paragrafy w model danych.
Konto i deklaracja
Rejestracja z kontrolą sumy NIP, wybór kategorii członkostwa, akceptacja statutu. Kandydat po zalogowaniu widzi, na którym etapie jest jego wniosek
Wpisowe i audyt
Kandydat zgłasza wpłatę w panelu, Zarząd ją księguje. Kwoty liczone w groszach, bez błędów zaokrągleń. Członek zwyczajny przechodzi audyt standardów produkcji
Uchwała Zarządu
Przyjęcie tworzy wizytówkę zakładu z danych deklaracji i wysyła mail powitalny. Odmowa blokuje nowy wniosek na sześć miesięcy od daty uchwały
Składki i przypomnienia
Stan składki liczony automatycznie, przypomnienia dla kandydatów po 7, 14 i 30 dniach bezczynności i dla członków przed terminem. Po pół roku zaległości maile ustają, bo decyzja o skreśleniu należy do Zarządu
Każda zmiana etapu, wpłata, eksport i wysłany mail trafiają do dziennika: kto, co, kiedy. Historia etapów nigdy nie jest nadpisywana. Zarząd ma własny panel z pulpitem (kandydaci, którzy utknęli, wpłaty do zaksięgowania, zaległe składki), lejkiem kandydatów, listą członków z eksportem i szablonami maili, które sam zmienia.
- Panel członka: stan członkostwa, wpłaty, wizytówka zakładu edytowana samodzielnie, bezpieczeństwo konta
- Strefa wewnętrzna: ogłoszenia, uchwały, zebrania z plikiem do kalendarza, dokumenty dostępne tylko dla uprawnionych kategorii
- Pomysły członków z poparciem i komentarzami, moderowane przez Zarząd
- Benefity partnerów z kodem rabatowym, który nigdy nie trafia do kodu strony, tylko do zalogowanego członka
- Przepisy przysyłane przez członków z reklamą ich firmy, akceptowane przez redakcję jednym przyciskiem
- Forum z działami branżowymi na tym samym koncie i tym samym logowaniu co panel
Panel dla osoby, która nie jest techniczna
Prezes postawił jeden warunek: obsługa ma być prosta, „jak krowie na rowie”. Zwykły panel WordPressa pokazuje dziesiątki opcji, z których redakcja nie korzysta, a każda z nich jest okazją do pomyłki. Zbudowaliśmy więc uproszczony panel dla Zarządu.
Angielskie nazwy, „Dashboard”, „Posts”, „Featured image”
Edytor blokowy z kilkudziesięcioma typami bloków
Stronę logowania czy panelu można usunąć do kosza
Nie wiadomo, które dane nadpisze aplikacja
Nowe wiadomości giną w liście wpisów
„Aktualności”, „Zdjęcie główne”, „Pulpit”, instrukcja przy każdym polu
Prosty edytor tekstu dla wszystkich typów treści
Strony techniczne chronione przed usunięciem
Oznaczenie źródła przy każdym polu wizytówki
Pulpit ze sprawami do załatwienia i licznikami
Do tego instrukcja obsługi na 106 stronach, ekran po ekranie, ze zrzutami z prawdziwego panelu, oraz dokumentacja techniczna dla osoby, która kiedyś przejmie utrzymanie. Każdy nieoczywisty mechanizm ma w niej wskazane miejsce w kodzie i powód, dla którego zrobiono go tak, a nie inaczej.
Bezpieczeństwo na miarę danych członków
Panel Zarządu przetwarza dane osobowe, NIP-y i wpłaty, więc zabezpieczenia nie mogły być dodatkiem z wtyczki. Weryfikację dwuetapową napisaliśmy w motywie, zgodnie ze standardem kodów jednorazowych, tak żeby obejmowała jednocześnie logowanie przez stronę, panel WordPressa i forum.
- Weryfikacja dwuetapowa obowiązkowa dla Zarządu i administratora, dobrowolna dla członków; kody zapasowe przechowywane wyłącznie jako skróty
- Sekret drugiego składnika szyfrowany, kod QR generowany w przeglądarce, bez wysyłania sekretu do zewnętrznych usług
- Limity prób logowania na konto i na adres, ten sam komunikat błędu bez względu na to, czy konto istnieje
- Panel WordPressa pod własnym adresem, standardowe adresy logowania zwracają zwykłą stronę 404
- Formularze z pułapką na roboty, kontrolą czasu wysyłki i limitami, bez CAPTCHA męczącej ludzi
- Pliki strefy wewnętrznej poza zasięgiem bezpośrednich odnośników, wydawane dopiero po sprawdzeniu uprawnień
- Eksport CSV chroniony przed wstrzyknięciem formuł do arkusza, adresy IP w dzienniku tylko jako skrót
- Automatyczne usuwanie starych danych zgodnie z okresami z polityki prywatności
Akt o usługach cyfrowych przed terminem
Serwis z forum, wizytówkami i przepisami członków publikuje treści użytkowników, więc obejmują go obowiązki z Aktu o usługach cyfrowych. Nowelizacja polskiej ustawy dała na dostosowanie czas do listopada 2026 roku. Przejrzeliśmy dokumenty serwisu, opublikowaliśmy nowy regulamin, regulamin forum oraz polityki prywatności i cookies, a kod dostosowaliśmy do tego, co dokumenty obiecują.
Przy każdym wpisie forum, wizytówce i w stopce jest dziś link „Zgłoś treść”. Zgłoszenie dostaje numer, Zarząd podejmuje decyzję z uzasadnieniem, wybiera środek wobec autora i jego podstawę, a system wysyła decyzję obu stronom wraz z pouczeniem o odwołaniu. Mapy i filmy łączą się z Google dopiero po zgodzie, a czcionki i biblioteki map są na serwerze Stowarzyszenia, nie u zewnętrznych dostawców.
Widoczność w Google i u asystentów AI
Wymaganie było ambitne: pełne indeksowanie, aktualności w Google News i obecność nie tylko w wyszukiwarce, ale też w odpowiedziach asystentów AI. Zrobiliśmy to bez wtyczek SEO, bo żadna z nich nie znała typów treści Stowarzyszenia.
- Dane strukturalne dopasowane do treści: zakład jako lokalna firma, piekarnia albo lodziarnia z punktami i godzinami, przepis jako przepis z autorem-zakładem, konkurs i szkolenie jako wydarzenie
- Mapa artykułów dla Google News z wpisami z ostatnich 48 godzin
- Plik
llms.txtz opisem Stowarzyszenia, zakładami, przepisami i najnowszymi aktualnościami dla modeli językowych - 18 robotów wyszukiwarek i asystentów AI zaproszonych wprost, szkodliwe roboty i narzędzia do masowego pobierania zablokowane na serwerze
- Strony prywatne, przefiltrowane listy i wyniki wyszukiwania wyłączone z indeksu, żeby nie rozmywały serwisu
Pomiar, który nie przekracza zgody
Stowarzyszenie planuje kampanie Google Ads i chciało pomiaru „od A do Z”: kliknięć w telefon i e-mail zakładu, nawigacji do punktu sprzedaży, zapisów na wydarzenia, rejestracji i deklaracji. Kontener Tag Managera i konfigurację Google Analytics 4 wgraliśmy skryptami przez API, więc dają się odtworzyć: zdarzenia kluczowe, model atrybucji, dziesięć grup odbiorców do remarketingu i wykluczania członków z kampanii rekrutacyjnych.
Consent Mode działa w trybie podstawowym: dopóki odwiedzający nie zgodzi się na statystyki, tagi Google się nie uruchamiają. Kliknięcie w e-mail lub telefon zakładu jest liczone bez adresu i numeru, adresy stron trafiają do Analytics oczyszczone z parametrów formularzy, a na panelach, logowaniu i profilach forum pomiaru nie ma wcale. Konwersja z formularza liczy się dopiero po prawdziwym sukcesie, przez jednorazowy znacznik, więc odświeżenie strony jej nie dubluje.
Tryb podstawowy ma koszt: Analytics widzi tylko osoby, które wyraziły zgodę. Dlatego dołożyliśmy własny licznik odwiedzin po stronie serwera, bez ciasteczek i bez danych osób, zbiorczy, po dniach. Zarząd widzi w panelu pełny ruch, wejścia z wyszukiwarek, mediów społecznościowych i asystentów AI, a przy każdym nowym koncie także to, skąd przyszła osoba, która je założyła.
Przeprowadzka w jeden wieczór
Serwis zbudowaliśmy na serwerze testowym, a produkcję przygotowaliśmy pod adresem tymczasowym i sprawdziliśmy automatycznym audytem 400 stron, zanim domena zmieniła serwer. Przeprowadzka obejmowała naraz stronę, domenę i pocztę Stowarzyszenia.
Kopia na serwerze docelowym
Baza i pliki przeniesione z serwera testowego, nowe klucze, tryb produkcyjny bez wyświetlania błędów, audyt pod adresem tymczasowym: 0 problemów
Poczta przed domeną
Skrzynki założone u nowego dostawcy i przeniesione z pełną zgodnością folderów, zanim rekordy pocztowe zmieniły kierunek. Nikt nie stracił ani jednej wiadomości
Przepięcie w dwanaście minut
Po zakończeniu transferu domeny: serwery nazw, rekordy strony i poczty, zamiana adresów w bazie bez pozostałości, certyfikat i adres kanoniczny
Ten sam wieczór
Audyt 400 stron na docelowej domenie, synchronizacja zakładów z aplikacją, przegląd kodu i poprawki, usunięcie kont i treści pokazowych
Spójność treści jak w dużej organizacji
Prezes zauważył, że w wielu miejscach strona mówi co innego niż na sąsiedniej podstronie. Treści zbierały się przez cztery lata, pisane przez różne osoby. Zamiast poprawiać pojedyncze zdania, przejrzeliśmy cały serwis i spisaliśmy 62 niespójności: kwoty, daty, nazwy, opisy członkostwa. Oczywiste poprawiliśmy od razu, w jednej operacji z kopią każdej zmienionej wartości, a te, które wymagały decyzji Stowarzyszenia, trafiły do Prezesa jako lista konkretnych pytań.
Tak samo potraktowaliśmy drobiazgi, które budują zaufanie. Gdy przy przepisie na babkę drożdżową pojawiło się zdjęcie chleba do żurku, sprawdziliśmy wszystkie przepisy i znaleźliśmy jeszcze dwa podobne przypadki. Nowe zdjęcia pochodzą z otwartych zasobów, z podpisem autora i licencji, bo bez niego licencja nie pozwala ich użyć.
Dwa przeglądy kodu po starcie
Po uruchomieniu serwis rozwijał się dalej: filmy z kanału YouTube na stronie głównej, sekcje mecenasów i partnerów, źródła rejestracji, pełny pomiar. Każda paczka zmian kończyła się przeglądem kodu. Pierwszy znalazł i usunął 10 błędów, drugi, dotyczący pomiaru i zgód, 13. Wszystkie poprawki zostały sprawdzone w przeglądarce, z blokadą wysyłki danych do Google, zanim trafiły na produkcję.
Przy jednym z wdrożeń podstrona partnerów przez około dwie minuty zwracała błąd serwera, bo na produkcję trafił plik z błędem składni. Od tamtej pory motyw wgrywa wyłącznie skrypt, który sprawdza składnię każdego pliku na serwerze przed podmianą, robi kopię poprzedniej wersji i po wdrożeniu odpytuje kluczowe strony. Ręcznego kopiowania plików na produkcję już nie ma.
Technologie
Motyw pisany od zera
PHP 8.5
MariaDB
Advanced Custom Fields PRO
wpForo
Tailwind CSS
Alpine.js
Google Maps API
Leaflet i OpenStreetMap
REST API aplikacji mobilnej
TOTP (RFC 6238)
Google Tag Manager
GA4 z Consent Mode v2
Schema.org JSON-LD
Google News
llms.txt
YouTube RSS
Python
Playwright
Rezultaty
Co dalej
Kolejny etap jest już zaplanowany: jedno konto dla strony, aplikacji Rzemieślnik i Wirtualnego Piekarza. Około 1 500 osób z aplikacji zaloguje się na stronę tym samym kontem, bez zakładania go od nowa, a zmiana statusu członkostwa w panelu Prezesa będzie od razu widoczna wszędzie. Dochodzą do tego płatności wpisowego i składek online oraz wiadomości wymieniane między stroną a aplikacją.
Czego ten projekt uczy
Organizacja członkowska wygląda z zewnątrz jak strona z aktualnościami. Od środka jest systemem: ma statut, który mówi, kto i kiedy może zostać członkiem, pieniądze, które trzeba zaksięgować, dane osobowe, które trzeba chronić, i obowiązki prawne wobec każdego, kto publikuje treści. Kreator stron obsługuje tylko tę pierwszą część.
Dlatego zaczęliśmy od statutu i od danych, które już istniały w aplikacji, a dopiero potem od wyglądu. A ponieważ serwis będzie prowadziła osoba nietechniczna, równie ważne jak kod okazało się to, co widzi ona po zalogowaniu: proste nazwy, objaśnienie przy każdym polu i instrukcja, do której można wrócić po miesiącach.
