Spędził Pan godziny na dopracowywaniu motywu: poprawił czcionki, przekroił nagłówek, dodał niestandardowe style dla kart produktów. Strona wygląda dokładnie tak, jak Pan chciał. A potem przychodzi powiadomienie „dostępna aktualizacja motywu" i po jednym kliknięciu wszystkie Pana zmiany znikają.

Brzmi znajomo? Ten ból prześladuje każdego, kto choć raz edytował motyw WordPress bezpośrednio, nie pomyślawszy o zabezpieczeniu przed aktualizacjami. Dobra wiadomość: problem można rozwiązać całkowicie i nie trzeba być do tego programistą.

Poniżej znajduje się instrukcja krok po kroku, która działa dla każdego motywu WordPress. Od utworzenia motywu potomnego po bezpieczne testowanie aktualizacji na działającej stronie.

💡 Szybki przegląd:

• Dowiedzą się Państwo, dlaczego ustawienia motywu znikają podczas aktualizacji i jak WordPress przechowuje zmiany
• Stworzą Państwo motyw potomny w 5 minut, od zera lub przez wtyczkę
• Przeniosą Państwo już wprowadzone zmiany do motywu potomnego bez strat
• Skonfigurują Państwo kopię zapasową i przetestują aktualizację bez ryzyka dla strony

Dlaczego ustawienia motywu giną podczas aktualizacji

WordPress jest skonstruowany prosto: każdy motyw leży w swoim folderze wewnątrz /wp-content/themes/. Kiedy klikają Państwo „aktualizuj", WordPress całkowicie zastępuje pliki motywu nowymi wersjami z repozytorium. Wszystko, co edytowali Państwo w style.css lub functions.php starej wersji, jest bezpowrotnie nadpisywane.

Ten mechanizm to nie błąd, a cecha. Gwarantuje on, że po aktualizacji otrzymają Państwo czystą, spójną wersję motywu, bez nagromadzonych „śmieci" z pośrednich edycji. Problem polega tylko na tym, że WordPress nie wie, które zmiany wprowadzili Państwo sami, a które były w motywie od początku.

Stąd główna zasada dostosowywania motywów: nigdy nie edytować plików motywu nadrzędnego bezpośrednio. Zamiast tego wszystkie zmiany przenosi się do osobnego bytu, czyli motywu potomnego.

Motywy potomne: jak to działa

Motyw potomny to lekka nadbudowa nad motywem nadrzędnym. Dziedziczy on całą funkcjonalność i style oryginału, ale pozwala nadpisać tylko to, co trzeba zmienić. Podczas aktualizacji motywu nadrzędnego motyw potomny nie jest w ogóle ruszany, a Pana zmiany pozostają nietknięte.

Zasada działania przypomina warstwy w Photoshopie: warstwa bazowa to motyw nadrzędny, a na niej znajduje się przezroczysta warstwa motywu potomnego. Rysuje Pan na górnej warstwie, a kiedy wymienia Pan dolną, górna zostaje zachowana.

Co można przenieść do motywu potomnego:

• Reguły CSS (czcionki, kolory, odstępy, responsywność)
• Szablony stron i poszczególnych bloków: header.php, footer.php i single.php
• Zmiany funkcjonalne przez functions.php (rejestracja widgetów, niestandardowych typów wpisów, shortcode)
• Tłumaczenia i ciągi tekstowe

W istocie motyw potomny pokrywa zdecydowaną większość typów dostosowań, dla których wchodziłby Pan w pliki motywu nadrzędnego.

Tworzymy motyw potomny: instrukcja krok po kroku

Proces zajmie nie więcej niż pięć minut i wymaga jedynie dostępu do plików strony przez FTP lub menedżera plików hostingu.

Krok 1: tworzymy folder

W katalogu wp-content/themes/ proszę utworzyć nowy folder. Proszę nazwać go jak motyw nadrzędny z przyrostkiem -child. Na przykład dla motywu twentytwentyfour folder będzie się nazywał twentytwentyfour-child. Taka nazwa nie jest sztywnym wymogiem, ale ogólnie przyjętą konwencją, która od razu daje do zrozumienia, z jakim motywem powiązany jest potomny.

Krok 2: podłączamy style, style.css

Wewnątrz folderu proszę utworzyć plik style.css z nagłówkiem:

1
/*
2
Theme Name: Twenty Twenty-Four Child
3
Template: twentytwentyfour
4
*/

Minimalnie wymagane są tylko dwa pola: Theme Name (dowolna unikalna nazwa) oraz Template (nazwa folderu motywu nadrzędnego, dokładnie taka jak na dysku, z uwzględnieniem wielkości liter). Błąd w Template i motyw potomny nie pojawi się na liście dostępnych w panelu administracyjnym.

Krok 3: dziedziczymy style rodzica, functions.php

Proszę utworzyć plik functions.php z takim kodem:

1
<?php
2
function child_enqueue_parent_styles() {
3
    $theme = wp_get_theme();
4
    $version = $theme->parent() ? $theme->parent()->get('Version') : '1.0';
5
 
6
    wp_enqueue_style(
7
        'parent-style',
8
        get_template_directory_uri() . '/style.css',
9
        array(),
10
        $version
11
    );
12
}
13
add_action('wp_enqueue_scripts', 'child_enqueue_parent_styles');

Ten kod robi dwie rzeczy: ładuje arkusz stylów motywu nadrzędnego i wiąże się z jego numerem wersji. Powiązanie z wersją jest krytycznie ważne: kiedy motyw nadrzędny się zaktualizuje, zmieni się też numer wersji w URL-u stylów. Przeglądarki i CDN-y zobaczą nowy URL i wyczyszczą cache, nie otrzymają więc Państwo „zepsutego" CSS przez to, że przeglądarka nadal ciągnie starą, zcache’owaną wersję.

Krok 4: aktywujemy

Proszę wejść do panelu administracyjnego WordPress → „Wygląd" → „Motywy". Znajdują Państwo właśnie utworzony motyw potomny po nazwie, którą podali Państwo w Theme Name, i klikają „Aktywuj".

Po aktywacji WordPress zacznie używać motywu potomnego. Strona będzie przy tym wyglądać dokładnie tak samo, jak z motywem nadrzędnym, ponieważ motyw potomny póki co niczego nie nadpisuje.

Przenoszenie istniejących zmian do motywu potomnego

Jeśli zdążyli już Państwo bezpośrednio edytować motyw nadrzędny, proszę nie panikować. Przeniesienie zmian do motywu potomnego wykonuje się ręcznie, ale jest to operacja jednorazowa.

Algorytm jest następujący:

• Proszę sporządzić listę wszystkich plików motywu nadrzędnego, które Państwo zmieniali. Zazwyczaj jest to style.css i functions.php, rzadziej pliki szablonów.
• Proszę skopiować tylko zmienione fragmenty kodu do odpowiednich plików motywu potomnego. Nie kopiować całego pliku, ponieważ nadpisze to przyszłe aktualizacje motywu nadrzędnego starym kodem. Proszę brać tylko to, co Państwo dodali lub zmienili.
• Po przeniesieniu wszystkich zmian proszę przywrócić oryginalne pliki motywu nadrzędnego z repozytorium (po prostu przeinstalować motyw lub wgrać świeżą kopię).

Jeśli zmian nazbierało się dużo i nie są Państwo pewni, co dokładnie zmieniali, oto lifehack: proszę zainstalować wtyczkę One Click Child Theme (tworzy ona motyw potomny jednym kliknięciem), a następnie ręcznie porównać pliki motywu nadrzędnego z oryginałem z repozytorium za pomocą narzędzia diff lub serwisu online do porównywania. W ten sposób dokładnie zobaczą Państwo, które linie dodali.

Alternatywne podejścia: frameworki i wtyczki

Motyw potomny to podstawowa i najbardziej elastyczna metoda, ale istnieją też inne narzędzia do bezpiecznego dostosowywania.

Frameworki motywów

Jeśli dopiero wybierają Państwo motyw i planują poważnie go rozbudowywać, proszę przyjrzeć się frameworkom. Najbardziej znany przykład to Genesis Framework od StudioPress. Idea polega na tym, że framework występuje jako „wieczny" motyw nadrzędny, a Państwo od pierwszego dnia pracują w motywie potomnym. Genesis nie aktualizuje się chaotycznie, jego aktualizacje są przemyślane tak, aby nie psuć motywów potomnych. Koszt to 60 dolarów rocznie, ale dla tych, którzy zarabiają na stronach, jest to uzasadniona inwestycja.

Inną opcją jest framework Total, który ma wbudowane pole Custom CSS w panelu administracyjnym. Dla niewielkich poprawek stylistycznych może to być wystarczające, zupełnie bez tworzenia motywu potomnego.

Wtyczki

Jeśli nie chcą się Państwo babrać w plikach motywów, część zadań można przerzucić na wtyczki:

• WP Template Overrides pozwala punktowo nadpisywać szablony bez tworzenia motywu potomnego. Przydatne, gdy trzeba poprawić jeden konkretny szablon, a nie chce się dla tego tworzyć całego motywu potomnego.
• Wtyczka One Click Child Theme tworzy motyw potomny prosto z panelu administracyjnego, bez FTP. Idealna na pierwsze spotkanie z motywami potomnymi: klikają Państwo przycisk i struktura jest gotowa.

Ważne jest, aby rozumieć ograniczenia: wtyczki pokrywają wąskie scenariusze. Do systemowej pracy z dostosowywaniem motyw potomny jest i tak bardziej niezawodny, nie zależy od aktualizacji zewnętrznej wtyczki i działa nawet przy zmianie aktywnych wtyczek.

Kopia zapasowa: ubezpieczenie przed aktualizacją

Niezależnie od tego, z której metody Państwo korzystają, przed każdą aktualizacją motywu proszę zrobić kopię zapasową strony. Zajmie to kilka minut, ale zaoszczędzi nerwów, jeśli coś pójdzie niezgodnie z planem.

Trzy poziomy tworzenia kopii zapasowych, od prostego do niezawodnego:

• Ręczny backup przez FTP. Proszę pobrać folder z motywem i wyeksportować bazę danych przez phpMyAdmin lub WP-CLI (wp db export). Bezpłatne, ale wymaga dyscypliny, łatwo zapomnieć zrobić przed aktualizacją.
• Automatyczny backup wtyczkami. Bezpłatne opcje z katalogu WordPress radzą sobie z codziennym kopiowaniem plików i bazy danych. Spośród rozwiązań premium wyróżniają się Jetpack VaultPress Backup (kopie zapasowe w chmurze w czasie rzeczywistym) oraz Solid Backups (dawniej BackupBuddy, przywracanie jednym kliknięciem).
• Backup na poziomie hostingu. Większość zarządzanych hostingów WordPress wykonuje codzienne kopie automatycznie. Proszę dopytać u swojego dostawcy, jak szybko można przywrócić stronę z takiego backupu.

Zasada jest prosta: im bliżej momentu aktualizacji, tym świeższa powinna być kopia. Zrobili Państwo backup → zaktualizowali motyw → sprawdzili stronę. Padła, cofnęli Państwo zmiany w minutę.

Bezpieczne testowanie aktualizacji

WordPress traktuje różne wersje jednego motywu jako dwa różne motywy. Jeśli w folderze /wp-content/themes/ znajdują się mytheme (v1) i mytheme-new (v1.1), w panelu administracyjnym są to dwie osobne pozycje.

Tę właściwość można wykorzystać do bezpiecznego testowania:

• Proszę skopiować bieżący motyw do folderu o innej nazwie (na przykład mytheme-old).
• Proszę zainstalować nową wersję motywu w zwykły sposób.
• Proszę aktywować nową wersję i sprawdzić stronę.
• Jeśli coś się zepsuło, przełączają się Państwo z powrotem na starą wersję jednym kliknięciem.

Nie zastępuje to motywu potomnego, ale daje pole manewru, podczas gdy przenoszą Państwo ustawienia ze starej wersji do nowej. Szczególnie ratuje, jeśli twórca motywu radykalnie zmienił strukturę szablonów w dużej aktualizacji.

Na powyższym wideo znajduje się poglądowa demonstracja tworzenia motywu potomnego od początku do aktywacji. Jeśli po tekstowej instrukcji pozostały pytania, 7-minutowy film wszystko wyjaśni.

⁉️🤔 Częste pytania

Czy trzeba koniecznie tworzyć motyw potomny, jeśli edytowałem tylko CSS przez „Dostosuj" → „Dodatkowe style"?

Nie. Dodatkowe style przez customizer są zapisywane w bazie danych WordPress, a nie w plikach motywu. Podczas aktualizacji nie giną. Ale jeśli wprowadzał Pan CSS przez plik style.css motywu, motyw potomny jest obowiązkowy.

Czy można utworzyć motyw potomny, jeśli strona już działa i są na niej zainstalowane wtyczki?

Tak, utworzenie motywu potomnego nie wpływa na wtyczki. Proces jest całkowicie niezależny: tworzą Państwo folder i dwa pliki, aktywują motyw potomny, a strona działa dalej, jakby nigdy nic. Jedyny niuans: jeśli korzystali Państwo z funkcji customizera (na przykład ustawili logo lub faviconę), trzeba je ponownie skonfigurować po aktywacji motywu potomnego, ponieważ te ustawienia są powiązane z konkretnym aktywnym motywem.

Co robić, jeśli twórca porzucił motyw nadrzędny?

Motyw potomny będzie nadal działać, ale bezpieczeństwo i kompatybilność z nowymi wersjami WordPress stoją pod znakiem zapytania. Jeśli motyw nadrzędny nie był aktualizowany od ponad roku, warto pomyśleć o migracji na inny motyw. W krótkiej perspektywie proszę nadal używać motywu potomnego jak zwykle, ale zaplanować przejście.

Czym Genesis Framework jest lepszy od zwykłego motywu nadrzędnego?

Genesis został stworzony specjalnie po to, by być motywem nadrzędnym. Nie zmienia drastycznie designu między wersjami, udostępnia czyste API haków i filtrów dla motywów potomnych i aktualizuje się z dbałością o kompatybilność wsteczną. Zwykły motyw może w każdej chwili przekroić strukturę szablonów i Pana motyw potomny przestanie działać. Z Genesis takie ryzyko jest minimalne.

Czy można aktualizować motyw automatycznie, jeśli mam aktywny motyw potomny?

Tak, właśnie po to motyw potomny jest potrzebny. Motyw nadrzędny aktualizuje się automatycznie (lub ręcznie), motyw potomny nie jest w ogóle ruszany. Wszystkie Pana zmiany pozostają na swoim miejscu.

Aktualizować się czy nie aktualizować: co robić od razu

Jeśli z całego artykułu wyniósł Pan tylko jedno, niech to będzie prosta zasada: nie edytować plików motywu bezpośrednio, stworzyć motyw potomny. Zajmie to pięć minut, a oszczędność mierzy się godzinami przywracania po każdej aktualizacji.

Dla początkujących ścieżka jest taka: proszę zainstalować One Click Child Theme → kliknąć jeden przycisk → aktywować motyw potomny → i dopiero wtedy zacząć dostosowywanie. Dla tych, którzy już zdążyli nanieść zmiany w motywie nadrzędnym, proszę przenieść je do potomnego według instrukcji powyżej, przywrócić oryginały i aktualizować się spokojnie.

Ma Pan inny schemat ochrony ustawień podczas aktualizacji motywów? Proszę podzielić się w komentarzach, uzupełnimy instrukcję.