Sage a Blade

Prečo sa vaša WordPress téma upravuje každý rok ťažšie než predtým?

Staviam WordPress témy na Roots Sage s Blade šablónami. Kód má prehľadnú štruktúru, komponenty sa znovu používajú namiesto kopírovania a tému prevezme aj iný vývojár bez toho, aby ju musel prepísať od nuly.

Prebrať tému na Sage Späť na hlavnú stránku

Veľká časť WordPress tém vznikne tak, že sa kúpi univerzálna šablóna, doplní sa page builder a zvyšok sa dorieši útržkami PHP priamo v súboroch témy. Prvé mesiace to funguje. Potom príde nová sekcia, ktorá vyzerá skoro ako existujúca, tak sa skopíruje, a o rok neskôr existuje päť takmer rovnakých kusov kódu, ktoré treba meniť naraz. Cena každej ďalšej úpravy rastie, hoci samotné zadanie zostáva rovnako malé. Nie je to chyba WordPressu, ale spôsobu, akým je téma napísaná.

Sage je štartovacia téma od tímu Roots, ktorá do WordPressu prináša to, čo je v Laravele bežné roky: oddelenie logiky od šablóny, Blade ako šablónovací jazyk, závislosti cez Composer a moderný build frontendu. Šablóny sa skladajú z komponentov, dáta sa pripravujú mimo šablóny a hierarchia súborov zostáva čitateľná. Výsledkom nie je len krajší kód. Je to téma, v ktorej sa aj po roku dá nájsť konkrétne miesto na zmenu za pár minút namiesto pol dňa hľadania.

Čo Sage mení oproti bežnej téme

Sage nie je hotový vzhľad s nastaveniami, ale čistý základ, na ktorom sa téma píše na mieru. Prináša štruktúru priečinkov, v ktorej je jasné, kde sú šablóny, kde komponenty, kde štýly a kde logika. Závislosti sa spravujú cez Composer, takže knižnice nekončia ručne skopírované v repozitári. Frontend sa zostavuje moderným buildom, čo znamená menšie CSS a JavaScript ako pri univerzálnej téme, ktorá načítava všetko pre každý možný prípad. Pre klienta je najdôležitejšie to, že výsledok je štandardný a čitateľný aj pre vývojára, ktorý ho nepísal.

Jasná hierarchia šablón a komponentov
Composer namiesto ručne kopírovaných knižníc
Build frontendu s výrazne menším výstupom
Štruktúra, ktorú pozná každý Roots vývojár

Blade šablóny namiesto zamotaného PHP

Blade je šablónovací jazyk známy z Laravelu. Namiesto striedania PHP značiek s HTML sa píše krátky a čitateľný zápis: dedenie rozloženia, sekcie, podmienky, cykly a vkladanie komponentov. Šablóna tak zostane o tom, čo sa zobrazuje, a logika, ktorá dáta pripravuje, žije mimo nej. Výstup sa navyše automaticky escapuje, čím odpadá celá skupina bezpečnostných chýb s neošetreným obsahom. V praxi to znamená, že úpravu textu alebo poradia sekcií zvládne aj menej skúsený človek bez rizika, že rozbije celú stránku.

Dedenie rozloženia namiesto kopírovaných hlavičiek
Čitateľné podmienky a cykly priamo v šablóne
Automatické escapovanie výstupu
Logika oddelená od zobrazenia

Komponenty, ktoré neexistujú v piatich kópiách

Karta produktu, box s referenciou, sekcia s výzvou k akcii alebo tabuľka cien sa v Sage napíšu raz ako komponent a na stránkach sa iba použijú s inými dátami. Keď treba zmeniť vzhľad karty, mení sa jeden súbor a zmena sa prejaví všade. To je najväčší rozdiel oproti page builderu, kde sú rovnaké bloky poskladané ručne na každej stránke zvlášť a po čase sa nenápadne rozídu. Komponenty zároveň fungujú ako dokumentácia dizajnu: v projekte je zoznam stavebných prvkov, z ktorých sa dá zložiť nová stránka bez vymýšľania.

Jedna zmena sa prejaví na všetkých stránkach
Rovnaké prvky naozaj vyzerajú rovnako
Nové stránky sa skladajú z hotových blokov
Menej kódu na údržbu pri každom zadaní

Redakcia obsahu: ACF, Gutenberg a page buildery

Sage nie je v konflikte so správou obsahu. Vlastné polia cez ACF, natívne Gutenberg bloky aj bloky na mieru sa dajú vykresľovať cez Blade šablóny, takže redaktor pracuje v známej administrácii a kód zostáva na jednom mieste. Page builder sa dá ponechať pre kampaňové stránky, no jadro webu odporúčam držať v komponentoch, kde má zmena predvídateľný dosah. Pri prestavbe existujúceho webu preto vždy najprv zisťujem, kto obsah reálne upravuje a ktoré časti musí vedieť meniť sám bez vývojára.

ACF polia vykreslené cez Blade komponenty
Vlastné Gutenberg bloky s vlastnou šablónou
Redaktor pracuje v bežnej administrácii WordPressu
Page builder len tam, kde dáva zmysel

Kedy Sage odporúčam a koľko to stojí

Sage má zmysel pri weboch, ktoré sa budú ďalej rozvíjať: firemné weby s viacerými typmi stránok, obsahové projekty, WooCommerce obchody s vlastným vzhľadom a projekty, kde sa počíta s ďalším vývojárom. Pri jednorazovej mikrostránke s tromi sekciami je to zbytočná réžia a stačí jednoduchšia téma. Nevzniká ani žiadny lock-in: výsledkom je štandardný WordPress web, len s poriadne napísanou témou. Pracujem za 40 € za hodinu vrátane DPH a téma na mieru na Sage sa orientačne pohybuje v 20 až 45 hodinách.

Vhodné pre weby, ktoré sa budú rozvíjať
Zbytočné pri jednorazovej mikrostránke
Bez závislosti na jednom dodávateľovi
Orientačne 20 až 45 hodín, 40 € za hodinu vrátane DPH

Časté otázky o Sage a Blade

Čo je Sage a v čom sa líši od bežnej WordPress témy?

Sage je štartovacia téma od tímu Roots. Nedostanete hotový vzhľad s desiatkami nastavení, ale čistý základ s Blade šablónami, Composerom a moderným buildom. Vzhľad sa píše na mieru, takže web nenesie kód pre funkcie, ktoré nikdy nepoužijete.

Bude sa obsah spravovať v bežnej administrácii WordPressu?

Áno. Sage mení iba spôsob, akým je téma napísaná. Redaktor naďalej pracuje v štandardnej administrácii vrátane Gutenbergu a vlastných polí cez ACF. Rozdiel je v tom, ako sa obsah vykresľuje na frontende, nie v tom, ako sa zadáva.

Prevezme takúto tému po vás iný vývojár?

To je jeden z hlavných dôvodov, prečo Sage používam. Štruktúra je štandardná a známa v celej Roots komunite, kód je v repozitári a závislosti v composer.json. Odovzdávam aj krátky popis komponentov a postup pre lokálne spustenie projektu.

Dá sa existujúca téma prepísať na Sage?

Dá, ale nerobím to automaticky. Najprv prejdem existujúce šablóny a zistím, koľko z nich sa reálne používa. Často sa web dá prestavať s menším rozsahom, než čakáte, pretože veľká časť pôvodného kódu nie je nikde použitá.

Nespomalí Blade web oproti čistému PHP?

Nie. Blade sa kompiluje do bežného PHP a skompilovaný výstup sa cachuje, takže rozdiel je prakticky nemerateľný. Rýchlosť webu ovplyvňuje skôr počet pluginov, veľkosť obrázkov a hosting než zvolený šablónovací jazyk.

Chcete WordPress tému, ktorá sa dá udržiavať aj o tri roky?

Napíšte mi, koľko typov stránok web potrebuje a či ide o nový projekt alebo prestavbu. Poviem odhad rozsahu a rovno aj to, či má Sage v tomto prípade zmysel.

Prebrať tému na Sage