Tym razem na tapetę bierzemy kolejny bardzo ważny dla początkujących z WP temat jakim jest motyw potomny, z angielskiego zwany child theme. Dlaczego temat ważny? Dlatego, że większość wordpressowych żółtodziobów nie ma pojęcia, że coś takiego istnieje, i że dobrą praktyką jest zrobienie “potomka” zaraz po wybraniu idealne dla siebie motywu by nie martwić się, że przy aktualizacji znikną jakieś zmiany wprowadzane w kodzie.
Wiem, że niektórzy dostają drgawek na słowo “kod” i nie planują go w życiu dotykać, ale nigdy nie wiadomo co przyniesie jutro i kogo poprosicie o pomoc przy stronie – często kierujecie swoje prośby do mnie, a ja jak to mówi Kasia z “Miękko o Kompetencjach” robię “czary mary” właśnie w kodzie 😉 Tak więc jeśli nie chcecie zrobić tego dla siebie zróbcie to proszę dla mnie i innych grzebiących w kodzie magików 😉
Czym jest motyw potomny (child theme)?
Jak sama nazwa wskazuje jest to potomek / dziecko, a co dziecko ma po rodzicach? Ano pewne cechy, które dziedziczy. Tak też jest i w WordPressie. Nasz motyw potomny dziedziczy style i funkcje rodzica, czyli tego naszego głównego motywu. W zasadzie jest to jego kopia kropka w kropkę – ten sam wygląd, te same funkcjonalności. Po co więc zaprzątać sobie głowę jego tworzeniem?
Po co komu child theme?
Child theme tworzy się po to, aby móc swobodnie wprowadzać modyfikacje w plikach motywu. Teoretycznie można by edytować motyw główny (rodzica) jednak wtedy podczas aktualizacji wszystkie zmiany zostaną utracone, a motywy jak wiadomo aktualizować trzeba – o tym pisałam w artykule dotyczącym bezpieczeństwa WordPress.
W motywie potomnym tworzymy kopię wybranego pliku rodzica, który chcemy modyfikować i bez obaw wprowadzamy w nim zmiany – oczywiście z głową by sobie nie popsuć strony. Można również nadpisywać ustawienia CSS w pliku style.css. To taka alternatywna dla pola css w personalizacji – preferowana przeze mnie 😉
Po co jeszcze nam motyw potomny? Po to, że możemy się pobawić troszkę kodem, poustawiać po swojemu, a w razie czego szybko wrócić do oryginalnej wersji motywu – jakby jednak okazało się, że nasza wizja jest gorsza od tej proponowanej przez twórców motywu.
Jak działa mechanizm motywu potomnego?
WordPress wyświetlając konkretną stronę przeszukuje wpierw pliki child theme, a następnie, gdy jakiegoś pliku nie znajduje sięga po pliki rodzica – tak więc to co podamy WordPressowi w motywie potomnym będzie wzięte jako pierwsze pod uwagę.
To teraz to czego boicie się najbardziej, czyli proces tworzenia motywu potomnego. Bez obaw – będzie wersja dla totalnie zielonych 🙂
Tworzenie motywu potomnego
Nie będę Wam przedstawiać opcji “z palca”, “w kodzie”, czy jakbyście to nazwali. Mam dla Was rozwiązanie wtyczkowe. Dosłownie kilka kliknięć i będziecie mieć działający child theme. Wtyczkę po całej operacji możecie usunąć, więc nie będzie Wam zaśmiecać WordPressa.
Wchodzimy sobie we Wtyczki. Wyszukujemy, instalujemy i włączamy Child Theme Configurator
Opcje zainstalowanej wtyczki znajdziemy w Narzędzia – Child Themes
Wybieramy Create a new Child Theme a następnie wybieramy motyw, któremu chcemy stworzyć potomka. Klikamy Analyze.
Pokażą się różne opcje – w większości przypadków wystarczą defaultowe i klikamy Create New Child Theme
Po stworzeniu motywu potomnego uaktywniają się nam zakładki widoczne w opcjach tego konfiguratora. Można tam m.in. stworzyć sobie od razu kopie plików, które chcemy edytować. Jeśli nie macie tego w planach nic więcej tutaj nie ruszajcie 🙂
Przejdźcie natomiast w Motywy i włączcie stworzony właśnie child theme
Na koniec usuńcie wtyczkę – zmiany w plikach możecie dokonywać wchodząc przez klienta FTP na swój hosting do folderu wp-content/themes/ – tam będzie i Wasz rodzic i stworzony motyw potomny.
Byłabym zapomniała. Kiedy tworzyć motyw potomny? Najlepiej zaraz po instalacji WordPressa i wyborze motywu. Dlaczego? Bo nie mamy żadnych ustawień, które mogą przypadkiem zniknąć.
Jeśli jednak chcecie to zrobić później polecam wcześniej eksportować sobie ustawienia jakie macie w personalizacji. Pomocna może tutaj być wtyczka https://pl.wordpress.org/plugins/customizer-export-import/ – za jej pomocą potem importujecie także te ustawienia. Wtyczkę po całej operacji usuwamy. W przypadku, gdy motyw ma jakieś własne ustawienia, też zwykle jest przy nich opcja export / import. Na wszelki wypadek warto sobie taką kopię ustawień wykonać. Zajmie Wam to co najwyżej kilka minut, a nie będzie problemu jak coś zniknie przy przechodzeniu na child theme.
Przy tego typu działaniach zaleca się również zrobienie backupu całej strony – jeśli tego jeszcze systematycznie nie robicie to polecam zacząć. Awaria może nastąpić w każdym momencie, więc naprawdę warto mieć kopię zapasową strony, bo może uratować tyłek 🙂
To tyle z mojej strony. Jeśli macie pytania zapraszam na grupę – Biznes Bliższy Kobiecie 🙂
Bardzo przydatna i szczegółowa instrukcja, czyli w sam raz jak dla mnie idealna. Dobrze wiedzieć co zrobić na początku, kiedy założy się własną stronę na WordPress-ie. 🙂
Cieszę się, że mogłam pomóc ?
A jak byś stworzyła child-theme dla strony, która istnieje kilka ładnych lat i nie został na niej zrobiony child-theme na samym początku?
Wspomniałam o tym na końcu – by zrobić eksport ustawień z personalizacji (podał wtyczkę, która w tym pomaga) lub ustawień motywu jeśli takowe występują. Zdarza się, że motyw potomny sam nie zaczyta wcześniejszych ustawień rodzica, więc konieczne będzie zaimportowanie ich.
Blondynka jestem, bo nie wpadłam na to, że do tego może być wtyczka 😉
W WordPress niemalże do wszystkiego jest wtyczka 🙂 Nie ma co jednak bez opamiętania ich instalować 🙂 Tutaj jednak instalujemy, robimy motyw potomny i możemy wtyczkę usunąć 🙂
Bardzo przydatny wpis, w sam raz dla zielonych, którzy nie wiedzą co i jak zrobić 🙂
Bardzo się cieszę, że wpis się przydał 🙂
A co się dzieje przy kolejnej aktualizacji motywu? Znowu instalujemy tą samą wtyczkę. Czy już nie ma takiej potrzeby?
Aktualizuje się główny motyw – potomny zostawiamy tak jak jest, więc nie trzeba kolejny raz instalować i stosować wtyczki do child theme 🙂
dziękuję!!! Super wpis, właśnie to zrobiłam i zajęło mi może ze 3 minuty.
Super ? gratulacje!
Dziękuję Sylwia! The Best!
Cieszę się, że wpis się przydał 🙂
Dziękuję! Udało się ♥ (A byłam tym strasznie przerażona wcześniej 😉 )
Super! Cieszę się, że się przełamałaś – motyw potomny się przydaje : )
Witam. Mam pytanie co do tej drugiej wtyczki – po jej zainstalowaniu eksportuję swoje ustawienia motywu, a już po zrobieniu motywu potomnego importuje je, ale gdzie? Nie rozumiem tej części 🙁 Help
Cześć, wchodzisz w wygląd – dostosuj i tam będzie sekcja eksport/import. Wpierw klikasz tam eksport, pobierasz plik na dysk. Potem robisz motyw potomny. Sprawdzasz czy wszystko wygląda okej. Jak znikło np. logo czy kolory się zmieniły to wchodzisz znów w wygląd dostosuj w tą sekcję z eksportem tylko tym razem ładujesz pobrany wcześniej plik i klikasz import
Czyli import robię tylko jeśli coś się rozjedzie na stronie jak właśnie logo czy kolory? Dziękuję za odpowiedź i porady 🙂
Tak dokładnie. Jeśli wszystkie ustawienia motyw potomny załapał to nie trzeba ich importować ?
Dziękuję :))
Nie ma za co 🙂
Część,
A co w przypadku kiedy robimy child theme dla kadence z zaimportowana strona że starter templates. Po wykonaniu child się rozjeżdża. Jest na to jakiś sposób?
Co konkretnie się rozjeżdża? importowałeś po zrobieniu childa czy przed?
Problem w tym, które pliki dodatkowo tam dać. Jak jakiś powiedzmy header chcemy aby się nie zmieniała a mamy w tym pliku tylko wyciętą 1 linijkę kodu bo nie chcemy widoku kategorii na górze. To zostawić taki plik w potomnym z wyciętym też źle – bo mogą być aktualizowane pozostałe treści kodu. Jak takie cos można by rozwiązać?
Każdy edytowany plik, który chcesz edytować przerzucasz do motywu potomnego, nawet jak zmieniana jest tylko jedna linia