Webs Butler
Zamów Stronę

Builder Anti-Theme
dla świadomych deweloperów.

Pomiń system motywów WordPressa. Buduj szablony używając czystego HTML, PHP i CSS. Zero zbędnego kodu. 100% kontroli.

header.php
<header class="site-header"> <?php wp_nav_menu(); ?> </header> // Brak motywu. Brak ograniczeń. Czysty kod.
Główne Funkcje

Stworzony dla purystów

Agnostyczny Wobec Motywu

Całkowicie wyłącza aktywny motyw. Nie walczysz ze `style.css` ani nadpisywaniem hooków. Zaczynasz z czystą kartką.

🐘

Natywne PHP

Pisz czysty PHP bezpośrednio w builderze. Logika wykonuje się przed renderowaniem HTML. Pełny dostęp do funkcji WP i WC.

🌍

System Wielojęzyczny

Wbudowany system tłumaczeń inspirowany Polylang. Twórz szablony specyficzne dla języka bez dodatkowych wtyczek.

🛍️

Gotowy na WooCommerce

Buduj własne szablony Produktu, Archiwum, Koszyka i Kasy. Pełna kontrola nad doświadczeniem zakupowym.

💉

Wstrzykiwanie Kodu

Zarządzaj globalnymi snippetami (GTM, Meta Pixel, reset CSS) z precyzyjną kontrolą lokalizacji i priorytetu.

🔄

Loop Builder

Projektuj własne karty wpisów lub produktów używając zmiennych HTML, a następnie wyświetlaj je gdziekolwiek za pomocą shortcode'u.

Gotowy na uporządkowanie swojego workflow?

Dołącz do deweloperów budujących lżejsze i szybsze strony WordPress.


Pobierz PURITY za darmo
Dokumentacja

Wszystko, czego potrzebujesz, żeby zacząć

Pełna dokumentacja techniczna. Rozwiń tylko ten fragment, który akurat Cię interesuje — reszta pozostaje zwinięta.

Wersja 3.90 WordPress 6.0+ PHP 7.4+ Licencja Prywatna
01 Szybki start i instalacja

PURITY zastępuje system motywów WordPressa. Zamiast walczyć z style.css motywu, przejmujesz pełną kontrolę nad dokumentem HTML.

  1. Wgraj katalog do /wp-content/plugins/purity/.
  2. Aktywuj wtyczkę w panelu WordPressa.
  3. Utwórz pierwszy szablon w PURITY → Szablony.
  4. Ustaw Typ szablonu (np. Nagłówek, Stopka, Wpis).
  5. Dodaj warunki wyświetlania i opublikuj.
Nazwa katalogu musi brzmieć dokładnie purity — bez numeru wersji. Aktualizacje automatyczne rozpoznają wtyczkę po nazwie katalogu i przestaną działać, jeśli ją zmienisz.

Struktura plików

purity/ ├── purity.php // punkt wejścia, ładuje moduły ├── includes/ │ ├── post-types.php // typy treści smb_template, smb_snippet │ ├── meta-boxes.php // edytor: zakładki HTML/PHP/CSS/JS │ ├── template-loader.php // routing szablonów │ ├── conditions.php // warunki wyświetlania │ ├── code-snippets.php // globalne snippety │ ├── loop-builder.php // shortcode [smb_loop] │ ├── multilingual.php // system wielojęzyczny │ ├── seo-head.php // meta SEO, hreflang, llms.txt │ ├── api-bridge.php // REST API │ └── toolkit.php // SMTP, WebP, logi, cookies ├── templates/ // canvas.php, custom-page.php └── plugin-update-checker/ // aktualizacje z GitHuba
02 Jak działa renderowanie

PURITY przechwytuje każde żądanie przez filtr template_include (priorytet 99), rozpoznaje typ strony i szuka pasującego szablonu. Gdy szablon przejmuje kontrolę, motyw jest całkowicie wyłączany.

Kolejność w obrębie jednej sekcji

Każda sekcja renderuje się w stałej kolejności — to nie jest szczegół kosmetyczny, tylko podstawa działania:

  1. PHP — wykonuje się pierwszy, przygotowuje zmienne.
  2. CSS — trafia do dokumentu w znaczniku <style>.
  3. HTML — może korzystać ze zmiennych z pola PHP.
  4. JS — na końcu, w znaczniku <script>.
Każda sekcja ma własny zasięg zmiennych. Zmienna ustawiona w sekcji 1 nie istnieje w sekcji 2. Funkcje są globalne, zmienne nie — jeśli potrzebujesz wspólnych danych, zamknij je w funkcji zabezpieczonej przez function_exists().
CSS sekcji trafia do dokumentu przed jej HTML-em, w treści strony. Oznacza to dwie rzeczy: selektor sąsiadujący wycelowany w „pierwszy blok strony” trafi w element <style>, a CSS globalnego snippetu zawsze przegrywa kaskadę z CSS-em sekcji przy tej samej specyficzności.
03 Typy szablonów i warunki wyświetlania

Typ szablonu decyduje, gdzie się pojawi. Gdy pasuje kilka szablonów, PURITY bierze najnowszy, który spełnia warunki wyświetlania.

TypKiedy się renderuje
headerNa górze każdej strony obsługiwanej przez PURITY
footerNa dole każdej strony obsługiwanej przez PURITY
single_postPojedynczy wpis blogowy
archiveListy wpisów, archiwa, strona bloga
404Strona „nie znaleziono”
single_{typ}Pojedynczy wpis własnego typu treści

Wzorzec single_{typ} jest dynamiczny — każdy publiczny, własny typ treści zarejestrowany na stronie pojawi się automatycznie na liście wyboru.

Warunki wyświetlania

Ten sam typ szablonu może mieć kilka wariantów rozdzielonych warunkami: język, konkretne identyfikatory stron albo rodzaj strony. Dzięki temu jedna instalacja obsługuje np. osobny nagłówek dla wersji polskiej i angielskiej.

04 Klucze post meta — referencja

PURITY nie tworzy własnych tabel dla treści — wszystko siedzi w standardowym post meta. Poniżej klucze używane w bieżącej wersji.

KluczZawartość
_smb_sectionsTablica sekcji {html, php, css, js} — wersja live
_smb_sections_draftWersja robocza tej samej tablicy
_smb_template_typeTyp szablonu (header, footer, 404…)
_smb_conditionsWarunki wyświetlania
_smb_use_builder1 = zwykła strona WP przejęta przez builder
_smb_languageKod języka treści
_smb_translation_groupŁączy tłumaczenia tej samej strony
_smb_seo_descriptionRęczny opis meta (nadpisuje automatyczny)
_smb_html_codeStarszy format: pojedyncza sekcja HTML
_smb_php_codeStarszy format: pojedyncza sekcja PHP
_smb_css_codeStarszy format: pojedyncza sekcja CSS
_smb_js_codeStarszy format: pojedyncza sekcja JS
Klucze w starszym formacie mają odpowiedniki robocze z przyrostkiem _draft. Nowe wdrożenia powinny używać _smb_sections.
05 Snippety kodu i pętle

Snippety to globalne fragmenty kodu wykonywane w wybranym miejscu cyklu życia strony — idealne dla Google Tag Managera, Meta Pixela czy globalnego resetu CSS.

LokalizacjaZastosowanie
initLogika serwerowa, rejestracja typów treści
wp_headStyle globalne, tagi weryfikacyjne, skrypty analityczne
wp_body_openKod tuż po otwarciu <body>
wp_footerSkrypty, które nie mogą blokować renderowania
admin_headZmiany w panelu administracyjnym

Snippety mają priorytet i wyłącznik. Każdy jest wykonywany w bloku try/catch, więc błąd w jednym z nich nie kładzie całej strony.

Loop Builder

Zaprojektuj wygląd pojedynczej karty wpisu lub produktu, a następnie wyświetl listę w dowolnym miejscu za pomocą shortcode’u:

[smb_loop] // treść zapętlona według zapytania
06 System wielojęzyczny

Wbudowany system tłumaczeń w stylu Polylang, obsługujący 12 języków — bez dodatkowych wtyczek.

  • _smb_language oznacza język konkretnej strony.
  • _smb_translation_group spina wersje językowe tej samej treści.
  • Warunki wyświetlania pozwalają przypisać nagłówek i stopkę do języka.
Od wersji 3.90 te same dwa klucze zasilają automatyczne znaczniki hreflang, dzięki którym wyszukiwarki rozumieją, że strony są wersjami językowymi, a nie duplikatami.
07 SEO — nowość w wersji 3.90

Ponieważ PURITY wyłącza motyw, usuwa też wszystkie znaczniki, które WordPress normalnie umieszcza w sekcji <head>. Moduł SEO przywraca je i uzupełnia.

  • Opis meta — ręczny, z zajawki wpisu albo wygenerowany automatycznie z treści sekcji.
  • Adres kanoniczny oraz dyrektywa robots.
  • Open Graph i karty na X — podgląd przy udostępnianiu.
  • hreflang — budowany z grup tłumaczeń.
  • /llms.txt — indeks treści dla wyszukiwarek opartych na AI.

Własny opis ustawisz kluczem _smb_seo_description. Jeśli go nie ma, moduł użyje zajawki, a w dalszej kolejności wyciągnie pierwsze zdania z treści strony.

Wyłączenie modułu

Jeśli strona korzysta z Yoasta albo Rank Matha, moduł sam ustępuje im pola na stronach spoza PURITY. Można go też wyłączyć całkowicie:

add_filter( 'smb_seo_enabled', '__return_false' );
08 REST API

PURITY udostępnia własne API w przestrzeni purity/v1. Każde żądanie wymaga nagłówka X-Purity-Token z kluczem wygenerowanym dla danej strony.

EndpointDziałanie
GET /listWszystkie strony, szablony i snippety
GET /element/{id}Pobranie kodu elementu
POST /element/{id}Zapis kodu (obsługuje wersje robocze)
POST /createUtworzenie nowego szablonu lub strony
GET|POST /mediaBiblioteka multimediów
Klucz API daje pełny dostęp do kodu strony. Traktuj go jak hasło: nie umieszczaj w repozytoriach ani po stronie przeglądarki.
09 Pułapki z prawdziwych wdrożeń

Poniższe błędy powtarzały się w kolejnych projektach i żadnego nie dało się rozpoznać z samego CSS-u. Warto je sprawdzić zanim coś się zepsuje.

1. Ujemne marginesy „wyłamujące” sekcję z motywu

Objaw Sekcja hero jest za wysoka, widać tylko jej górny fragment, a pod nią pojawia się niewyjaśniona pusta przestrzeń.

Przyczyna Kod próbuje skasować padding kontenera motywu parą ujemny margines + dodatni padding. PURITY renderuje bezpośrednio w <body>, więc nie ma czego kasować — realna wysokość rośnie o dołożony padding.

Rozwiązanie Usuń takie pary całkowicie. Wystarczy min-height: 100vh bez marginesów. Poziome wyłamanie na pełną szerokość to osobna, poprawna technika — nie myl jej z kompensacją pionową.

2. Brak globalnego tła = białe przebłyski

Objaw Między dwiema ciemnymi sekcjami pojawia się jasny pasek, choć każda z osobna wygląda poprawnie.

Przyczyna Tła nie dziedziczą się między sąsiednimi sekcjami. Każdy piksel niepokryty własnym tłem sekcji pokazuje domyślną biel przeglądarki.

Rozwiązanie Ustaw jednolite tło na html, body jako pierwszą regułę globalną. Sekcje z tłem background-attachment: fixed muszą dodatkowo mieć własny background-color.

3. Dwa zaokrąglone pudełka, które miały być jednym

Objaw Pływający nagłówek pokazuje szew, niedopasowane zaokrąglenie albo kolorowy pasek przy rozwijaniu menu.

Przyczyna Stan zamknięty i otwarty zbudowano jako dwa osobne elementy, każdy z własnym zaokrągleniem i tłem. Najmniejsza różnica staje się widoczna.

Rozwiązanie Jeden kontener na oba stany, overflow: hidden na elemencie zewnętrznym, rozwijanie przez max-height w środku. Chowając panel, łącz max-height: 0 z opacity: 0 — samo zerowanie wysokości potrafi zostawić widoczne krawędzie.

4. position: sticky potrafi po cichu przestać działać

Objaw Przyklejony nagłówek działa na jednych stronach, a na innych odjeżdża przy przewijaniu — mimo identycznego CSS-u.

Przyczyna sticky psuje dowolny element nadrzędny z overflow innym niż visible albo tworzący kontekst nakładania. Struktura nadrzędna bywa różna na różnych typach stron.

Rozwiązanie Dla nagłówków wybieraj position: fixed — odnosi się do okna przeglądarki i omija cały ten problem.

5. align-items: center nie gwarantuje wyrównania

Objaw Logo i przycisk menu w jednym rzędzie wyglądają na przesunięte względem siebie.

Przyczyna Wyśrodkowane zostaje pudełko każdego elementu z osobna. Obrazek w odnośniku dziedziczy interlinię i dostaje niewidoczną nadwyżkę wysokości, której przycisk nie ma.

Rozwiązanie Nadaj obu elementom tę samą jawną wysokość i ustaw line-height: 0 na opakowaniu obrazka.

Zasada ogólna: jeśli układ nie zgadza się z zapisanym CSS-em, nie zgaduj kolejnych reguł. Sprawdź wyliczone wartości w narzędziach deweloperskich przeglądarki. Zrzut ekranu nie odróżni błędnego CSS-u od CSS-u nadpisanego lub zablokowanego przez pamięć podręczną.
10 Migracja i awaryjne wyłączenie

Przejście z Elementora lub Breakdance

  1. Skopiuj wyrenderowany HTML z inspektora przeglądarki.
  2. Wklej go do pola HTML sekcji.
  3. Przenieś style do pola CSS, skrypty do pola JS.
  4. Usuń shortcode’y starego buildera.
  5. Włącz builder na stronie i porównaj obie wersje.
Migruj stronę po stronie. Builder włącza się osobno dla każdej strony, więc reszta serwisu działa nieprzerwanie na starym rozwiązaniu.

Gdy coś pójdzie nie tak

Kod PHP sekcji wykonuje się po stronie serwera — błąd składni potrafi zatrzymać renderowanie strony. Dlatego każda sekcja ma wersję roboczą: testuj zmiany w wersji roboczej, publikuj dopiero po sprawdzeniu.

Jeśli strona przestała się otwierać, wyłącz wtyczkę przez FTP — zmień nazwę katalogu purity na dowolną inną. WordPress automatycznie ją dezaktywuje i wróci do motywu. Treść pozostaje nienaruszona w bazie danych; po przywróceniu nazwy wszystko wraca.

Nie usuwaj wpisów post meta ręcznie w bazie. To jedyne miejsce, w którym przechowywana jest treść zbudowana w PURITY — skasowanie ich jest nieodwracalne.