Kompletny przewodnik po motywach WordPress dla dzieci
Opublikowany: 2017-06-29Ekosystem WordPress jest pełen świetnie wyglądających darmowych i premium motywów, ale znalezienie idealnego motywu dla swoich potrzeb, takiego, który spełniałby wszystkie wymagania, jest bardzo trudne. Na szczęście WordPress ma rozwiązanie tego problemu, zwane motywami potomnymi. Więc nie martw się, możesz użyć motywu potomnego, aby zastosować zmiany, aby stworzyć prawie idealny motyw.
Motywy potomne WordPress mogą być tak proste, jak trochę niestandardowego kodu CSS lub mogą zastępować istniejące szablony motywów nadrzędnych i modyfikować lub dodawać dodatkowe funkcje motywów. W tym artykule wyjaśnię wszystko, co musisz wiedzieć o tematach potomnych, więc przejdźmy od razu do tego.
Co to jest motyw potomny?
Motyw potomny to motyw, który dziedziczy funkcjonalność i styl innego motywu, zwanego motywem nadrzędnym. Motywy potomne to zalecany sposób modyfikowania istniejącego motywu.
Powyższa oficjalna definicja WordPressa jest świetna, ale przyjrzyjmy się bliżej, co to oznacza. Motyw potomny startowy (barebone) będzie wyglądał i działał dokładnie tak samo jak motyw nadrzędny. Wkrótce pokażę Ci, jak utworzyć motyw potomny, ale na razie motyw potomny jest minimalnym motywem potomnym, który odziedziczy wszystko po motywie nadrzędnym. Następnie możesz dodać pliki i kod do motywu potomnego, co zmodyfikuje lub poprawi wygląd i funkcjonalność motywu nadrzędnego, czyniąc go osobnym, unikalnym motywem.

Korzystanie z motywu potomnego ma wiele zalet i nie ma żadnych wad, więc przyjrzyjmy się, dlaczego warto używać motywu potomnego.
Dlaczego powinienem używać motywu potomnego?
Jeszcze lepsze pytanie: dlaczego nie miałbyś użyć motywu potomnego? Właściwie nie mogę wymyślić dobrego powodu, aby go nie używać, ale znam kilka świetnych powodów, dla których powinieneś używać motywu potomnego.
Aktualizacje motywu – jeśli bezpośrednio zmodyfikujesz kod motywu i zaktualizujesz ten motyw w przyszłości, wszystkie te modyfikacje zostaną utracone. Myślę, że sam ten powód jest wystarczający, aby zacząć używać motywów potomnych. Mieliśmy kilku klientów, którzy bezpośrednio edytowali pliki motywów, a następnie otworzyli zgłoszenie do pomocy technicznej, twierdząc, że nasza aktualizacja motywu zniszczyła ich pracę. Gdyby użyli motywu dziecięcego, wszystko byłoby w porządku. Czy potrzebujesz aktualizacji motywów? Tak! Na przykład: Co się stanie, jeśli aktualizacja motywu zawiera poprawkę bezpieczeństwa, a nie aktualizując motywu, Twoja witryna WP może stać się potencjalnym celem hakerów?
Organizacja kodu – ponieważ wszystkie zmiany są umieszczane w folderze motywu potomnego, możesz wyraźnie zobaczyć, jakie zmiany zostały wprowadzone i jak zostały wprowadzone. Jeśli będziesz musiał coś zmienić w przyszłości, będziesz dokładnie wiedział, gdzie znaleźć te zmiany, a to zaoszczędzi Ci dużo czasu.
Szybszy rozwój – rozszerzenie lub nadpisanie stylu i funkcjonalności motywu nadrzędnego w motywie potomnym jest znacznie lepszą opcją niż utrzymywanie zmodyfikowanej bazy kodu motywu, która może zostać nadpisana aktualizacjami motywu (a już ustaliliśmy, że aktualizacje są ważne :)) .
Jak wspomniałem wcześniej, nie mogę wymyślić żadnego powodu, dla którego nie miałbym używać motywu potomnego, więc sugeruję, abyś jak najszybciej założył początkowy motyw potomny. Podczas instalowania nowego motywu należy również utworzyć początkowy motyw potomny i używać go zamiast tego, nawet jeśli nie masz żadnych planów dotyczących dostosowania motywu nadrzędnego. Uwierz mi, kiedy będziesz musiał dokonać kilku zmian, będziesz zadowolony, że używasz motywu potomnego.
Na marginesie: WordPress 4.7 wprowadził dodatkowy edytor CSS w konfiguratorze, w którym można dodać niestandardowy kod CSS. Jeśli więc masz pewność, że jedyną modyfikacją motywu będzie trochę niestandardowego kodu CSS, nie potrzebujesz motywu potomnego. Możesz użyć dodatkowego edytora CSS, aby dodać swój kod CSS i to wszystko. Ale czy na pewno nie wprowadzisz w przyszłości żadnych dodatkowych zmian w motywie? Czy jesteś?
Jak stworzyć początkowy motyw potomny?
Teraz, gdy wiemy, co i dlaczego, spójrzmy, jak. Jak już wspomnieliśmy, początkowy motyw potomny jest bardzo minimalnym motywem potomnym. Będzie wyglądać i funkcjonować dokładnie tak samo, jak motyw nadrzędny, ale będzie punktem wyjścia do twoich modyfikacji i ulepszeń.
W naszym przykładzie stworzymy początkowy motyw potomny dla motywu nadrzędnego Adrenaline:
- Utwórz folder i nazwij go adrenalina-pt-child. Najlepszą praktyką jest użycie nazwy folderu motywu nadrzędnego (adrenaline-pt) i dodanie na końcu „-dziecka”, aby było oczywiste, który motyw jest motywem potomnym, a który nadrzędnym.
- Utwórz plik
style.css
w folderze motywu podrzędnego. Otwórz plikstyle.css
i wklej do niego ten kod (ten kod musi znajdować się na górze pliku):/* Theme Name: Adrenaline Child Theme Theme URI: https://www.proteusthemes.com/wordpress-themes/adrenaline Description: Child theme for the Adrenaline theme Author: ProteusThemes Author URI: https://www.proteusthemes.com Template: adrenaline-pt Version: 1.0.0 License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html Tags: grid-layout, custom-background, custom-colors, custom-menu, featured-images, footer-widgets, full-width-template, microformats, sticky-post, theme-options, blog, e-commerce, entertainment, holiday Text Domain: adrenaline-pt-child */ /* Write your custom CSS code below */
- Utwórz plik
functions.php
w folderze motywu potomnego. Otwórz plikfunctions.php
i wklej do niego ten kod:<?php add_action( 'wp_enqueue_scripts', 'enqueue_parent_theme_style' ); function enqueue_parent_theme_style() { wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' ); }
- Opcjonalnie możesz dodać zrzut ekranu.png (lub .jpg) do folderu motywu podrzędnego, który wyświetli się w sekcji Wygląd -> Motywy jako obraz podglądu (obraz zrzutu ekranu powinien mieć rozmiar 1200x900px).

To jest podstawowy motyw potomny startera. Aby go zainstalować, należy umieścić ten folder w katalogu wp-content/themes/, obok folderu motywu nadrzędnego. Możesz także utworzyć plik zip z tego folderu motywu podrzędnego i zainstalować go jako zwykły motyw WP za pośrednictwem pulpitu administratora WP w Wygląd -> Motywy .
Wyjaśnijmy kod w powyższych fragmentach.
style.css — Jedyne pola, które są „wymagane”, to Nazwa motywu (nazwa motywu podrzędnego) i Szablon (nazwa folderu motywu nadrzędnego). Inne pola są opcjonalne i motyw podrzędny będzie działał bez nich. Jednak te metapola: Theme URI, Description, Author, … są „fajnie mieć” i pojawią się w WP admin -> Appearance -> Themes , dzięki czemu motyw potomny będzie bardziej „kompletny”.
functions.php – aby motyw potomny miał taki sam styl jak motyw nadrzędny, musimy zakolejkować plik CSS motywu nadrzędnego. Zalecanym sposobem na to jest użycie haka akcji wp_enqueue_scripts
. W funkcji zwrotnej umieszczamy w kolejce plik CSS motywu nadrzędnego za pomocą funkcji wp_enqueue_style
. Jeśli motyw nadrzędny używa wielu plików CSS (nie tylko style.css
), może być konieczne umieszczenie ich w kolejce, w zależności od techniki umieszczania motywu nadrzędnego.
W naszym motywie Adrenaline używamy również niestandardowego pliku CSS WooCommerce, więc najlepiej umieścić go również w motywie potomnym. Musimy tutaj uważać, ponieważ parametr handle funkcji wp_enqueue_style
tak samo, jak w motywie nadrzędnym (w naszym przykładzie: adrenaline-woocommerce
). W ten sposób nasz plik CSS motywu potomnego zostanie umieszczony w kolejce jako ostatni i będziemy mogli bez problemu nadpisać dowolne style motywu nadrzędnego. Oto zaktualizowany plik functions.php
dla naszego motywu Adrenaline:
<?php add_action( 'wp_enqueue_scripts', 'enqueue_parent_theme_style' ); function enqueue_parent_theme_style() { wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' ); /** * Enqueue additional parent theme CSS files. * Watch out to name the "handle" parameter the same as it is named * in the parent theme, otherwise the file might be enqueued twice. * In this example the parent handle name for this CSS file was * "adrenaline-woocommerce" */ wp_enqueue_style( 'adrenaline-woocommerce', get_template_directory_uri() . '/woocommerce.css' ); }
W tym miejscu chciałbym wspomnieć, że starym sposobem dodawania stylów rodzicielskich do motywu potomnego była reguła CSS @import
. Jeśli używasz motywu potomnego, który używa reguły @import
w style.css
do zaimportowania pliku CSS motywu nadrzędnego, sugeruję przełączyć się do powyższego przykładu, gdzie plik CSS motywu nadrzędnego jest umieszczony w kolejce w functions.php
(i usuń regułę @import
z style.css
). Problem z regułą @import
polega na tym, że jest ona znacznie wolniejsza niż umieszczanie w kolejce nadrzędnego pliku CSS za pomocą haka wp_enqueue_scripts
. Więcej na ten temat przeczytasz tutaj.
Możesz pomyśleć: „Musi istnieć wtyczka do tworzenia motywów potomnych…” Tak, jest. Przyjrzymy się tej wtyczce w sekcji Przełączanie na motyw potomny w już skonfigurowanym motywie nadrzędnym.
Jak działają pliki szablonów motywów nadrzędnych i podrzędnych?
Zanim przejdziemy do przykładów dostosowywania motywu potomnego, przyjrzymy się, jak działa hierarchia szablonów WordPress.
WordPress wykorzystuje pliki szablonów do tworzenia rzeczywistych stron HTML, które widzą odwiedzający Twoją witrynę. Niektóre z bardziej znanych plików szablonów WordPress to: header.php
, footer.php
, index.php
, single.php
, page.php
, … Na przykład, jeśli odwiedzana jest strona bloga, używany jest plik szablonu index.php
aby wyświetlić listę postów na blogu. Niektóre pliki szablonów są modułowe i wielokrotnego użytku. Na przykład header.php
jest zwykle używany na każdej stronie WordPress.
Niektóre pliki szablonów są bardziej szczegółowe niż inne i są traktowane przez WordPressa jako wyższy priorytet. Na przykład, jeśli motyw ma szablony singular.php
i page.php
, a użytkownik przegląda zwykłą stronę WordPress, szablon page.php
zostanie użyty do wygenerowania strony. Dzieje się tak, ponieważ plik szablonu page.php
jest bardziej szczegółowy niż szablon singular.php
w hierarchii szablonów WordPress. Gdybyśmy usunęli plik page.php
z motywu, użyty zostałby szablon singular.php
. Powinieneś zajrzeć do dokumentacji hierarchii szablonów WordPress, gdzie ten temat jest opisany bardziej szczegółowo i zawiera kilka przykładów.
Kolejnym zasobem, który powinieneś sprawdzić, jest interaktywna wizualizacja hierarchii szablonów WordPress.

Tak więc, w zależności od rodzaju odwiedzanej strony, różne pliki szablonów są używane do generowania strony, którą widzi odwiedzający. Jest to ważne, ponieważ pomaga to ustalić, który plik szablonu należy zmienić lub dodać w motywie podrzędnym, aby dostosować witrynę.
WordPress zawsze użyje najbardziej odpowiedniego pliku szablonu, jaki może znaleźć, w zależności od hierarchii szablonów. Jeśli używamy motywu potomnego, najpierw wyszuka on te pliki szablonu w motywie potomnym, a następnie powróci do motywu nadrzędnego, jeśli plik szablonu nie istnieje w motywie potomnym. Ponadto, jeśli motyw potomny używa bardziej szczegółowego pliku szablonu (w hierarchii szablonów WordPress) niż motyw nadrzędny, użyje tego pliku.
Jak dostosować motyw potomny?
Kontynuujmy nasz przykład motywu potomnego Adrenaline i zobaczmy, jak możemy go dostosować. Omówimy te przypadki użycia:
- dodawanie własnych stylów i nadpisywanie stylów macierzystych,
- dodanie funkcjonalności niestandardowej i nadpisanie funkcjonalności nadrzędnej,
- dodanie nowej funkcjonalności,
- nadpisywanie funkcjonalności nadrzędnej,
- dodawanie nowych plików szablonów,
- nadpisywanie plików szablonów nadrzędnych
Dodawanie własnych stylów i nadpisywanie stylów nadrzędnych
Cały niestandardowy kod CSS należy dodać do pliku style.css
w motywie podrzędnym.
Powiedzmy, że chcemy dodać styl ostrzeżenia dla jakiegoś tekstu do naszego motywu potomnego. Mamy element div HTML z klasą warning
wraz z tekstem na stronie WordPress i chcemy dodać odpowiednią stylizację dla tego elementu. Niestandardowy kod CSS, który piszemy dla tego przykładu, należy umieścić w pliku style.css
, poniżej komentarza nagłówka motywu potomnego (który zawsze znajduje się na górze pliku). Plik style.css
z niestandardowym kodem CSS wyglądałby tak:

/* Theme Name: Adrenaline Child Theme Theme URI: https://www.proteusthemes.com/wordpress-themes/adrenaline Description: Child theme for the Adrenaline theme Author: ProteusThemes Author URI: https://www.proteusthemes.com Template: adrenaline-pt Version: 1.0.0 License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html Tags: grid-layout, custom-background, custom-colors, custom-menu, featured-images, footer-widgets, full-width-template, microformats, sticky-post, theme-options, blog, e-commerce, entertainment, holiday Text Domain: adrenaline-pt-child */ .warning { margin: 1rem 0; background-color: #fcf8e3; border-color: #faf2cc; color: #8a6d3b; padding: 0.75rem 1.25rem; border: 1px solid transparent; border-radius: 0.25rem; }
Ważniejsze niż dodawanie niestandardowego kodu CSS do motywu potomnego jest zastąpienie stylów motywu nadrzędnego. Może podoba Ci się ogólny wygląd motywu nadrzędnego, ale chcesz zmienić kilka rzeczy, na przykład kolor ikony. Jako przykład nadpiszemy kolor ikony koszyka na zakupy w nagłówku strony głównej Adrenaline. Ten kolor ikony zmienia się wraz z ustawieniami dostosowania koloru podstawowego, ale załóżmy, że chcemy nadać mu unikalny kolor.
Aby nadpisać ten styl motywu nadrzędnego, musisz znaleźć selektor CSS w motywie nadrzędnym, czyli ustawić kolor tej ikony. Selektory CSS możesz znaleźć w narzędziach programistycznych Chrome. Oto prosty samouczek wideo, jak to zrobić. Gdy masz już właściwy selektor CSS, w naszym przykładzie jest to .header-info__link .fa
, musisz umieścić kod w pliku style.css
w motywie potomnym. Plik style.css
motywu potomnego z tym nadpisaniem będzie wyglądał tak:
/* Theme Name: Adrenaline Child Theme Theme URI: https://www.proteusthemes.com/wordpress-themes/adrenaline Description: Child theme for the Adrenaline theme Author: ProteusThemes Author URI: https://www.proteusthemes.com Template: adrenaline-pt Version: 1.0.0 License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html Tags: grid-layout, custom-background, custom-colors, custom-menu, featured-images, footer-widgets, full-width-template, microformats, sticky-post, theme-options, blog, e-commerce, entertainment, holiday Text Domain: adrenaline-pt-child */ .header-info__link .fa { color: #2ebd61; }
Najtrudniejszą częścią jest znalezienie odpowiedniego selektora CSS do kierowania, gdy już to zrobisz, to tylko kwestia zastosowania poprawnych reguł CSS.
Świetny! Właśnie zastosowaliśmy kilka niestandardowych stylów do naszego motywu potomnego. Do pliku style.css
motywu podrzędnego można dodać dowolną ilość niestandardowego kodu CSS.
Zobaczmy teraz, jak możemy dodać trochę funkcjonalności do motywu potomnego.
Dodawanie niestandardowych funkcji i zastępowanie funkcji nadrzędnej
To jest część, w której robi się ciekawie, gdzie możesz ulepszyć swój motyw potomny o dodatkowe funkcje lub nadpisać funkcjonalność motywu nadrzędnego, który chcesz zmienić.
Istnieje kilka sposobów realizacji dostosowań, więc przyjrzyjmy się im:
- dodanie nowej funkcjonalności,
- nadpisywanie funkcjonalności nadrzędnej,
- dodawanie nowych plików szablonów,
- nadpisywanie plików szablonów nadrzędnych
Dodawanie nowej funkcjonalności
Wszelkie nowe funkcje w postaci kodu PHP, które możesz chcieć dodać do motywu potomnego, muszą zostać umieszczone w pliku functions.php
. Jeśli dodajesz dużo kodu PHP, powinieneś rozpakować kod do wielu plików PHP, a następnie umieścić te pliki w pliku functions.php
, aby zapewnić lepszą organizację kodu.
Na przykład, jeśli dodasz krótki kod do motywu potomnego, możesz utworzyć plik o nazwie shortcodes.php
i dodać odpowiedni kod do tego pliku. Wtedy potrzebujesz pliku w functions.php
, na przykład: require_once get_stylesheet_directory() . '/shortcodes.php'
require_once get_stylesheet_directory() . '/shortcodes.php'
Nadpisywanie funkcji nadrzędnej
Być może będziesz musiał zmodyfikować niektóre funkcje motywu nadrzędnego, ale ponieważ nie możemy bezpośrednio edytować kodu motywu nadrzędnego, musimy jakoś to zrobić w motywie potomnym. Nie martw się, WordPress ma system właśnie do tego.
Istnieją dwa sposoby modyfikacji funkcji nadrzędnej, pierwszy to działanie WordPress i hooki filtrów , a drugi to funkcje podłączane .
Podpięcia akcji i filtrów WordPress – Jeśli używasz dobrze zakodowanego motywu nadrzędnego, powinieneś być w stanie znaleźć niestandardowe akcje i filtry WP w całym motywie, do których możesz się podłączyć i zmienić zachowanie motywu. Powinieneś wyszukać w motywie nadrzędnym funkcje do_action i apply_filters. Na przykład w motywie Twenty Seventeen można znaleźć ten filtr niestandardowy: twentyseventeen_front_page_sections
, który ma domyślną wartość 4
. Ta wartość reprezentuje liczbę sekcji zdefiniowanych na pierwszej stronie tego motywu. Gdybyśmy mieli stworzyć motyw potomny Twenty Seventeen i chcielibyśmy mieć tylko 2 sekcje, to umieścilibyśmy ten fragment kodu w pliku functions.php
motywu potomnego:
<?php add_action( 'wp_enqueue_scripts', 'enqueue_parent_theme_style' ); function enqueue_parent_theme_style() { wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' ); } // Custom Twenty Seventeen front page sections filter example. add_filter( 'twentyseventeen_front_page_sections', 'twentyseventeen_child_front_page_sections' ); function twentyseventeen_child_front_page_sections() { return 2; }
Funkcje wtykowe – Co to są funkcje wtykowe? Są to normalne funkcje PHP, ale zawarte w instrukcji if, aby sprawdzić, czy funkcja o tej nazwie już istnieje. Wyglądają tak:
<?php if ( ! function_exists( 'some_function_name' ) ) { function some_function_name() { // Function code goes here. } }
Jeśli twój motyw korzysta z tych podłączanych funkcji, możesz nadpisać ich kod w motywie potomnym, definiując funkcję o tej samej nazwie i zmienionym kodzie w pliku potomnym function.php
. W procesie ładowania początkowego WordPress plik motywu potomnego functions.php
ładuje się przed plikiem motywu nadrzędnego functions.php
, dlatego ta metoda funkcji podłączanych jest możliwa. Ponadto, jeśli funkcja motywu nadrzędnego nie jest podłączalna, nie można jej nadpisać, ponieważ dwie funkcje o tej samej nazwie zgłoszą krytyczny błąd PHP.
Funkcje wtykowe były używane w rdzeniu WordPressa na początku i zostały zastąpione przez filtry.
Dodawanie nowych plików szablonów
Dodanie nowego pliku szablonu WordPress (którego motyw nadrzędny nie posiada) do motywu potomnego jest łatwe. Wszystko, co musisz zrobić, to umieścić plik szablonu w katalogu głównym motywu potomnego.
Na przykład, jeśli twój motyw nadrzędny nie ma pliku szablonu category.php
, który jest odpowiedzialny za wyświetlanie postów z poszczególnych kategorii, możesz dodać plik szablonu category.php
do katalogu głównego folderu motywu potomnego (obok functions.php
). WordPress będzie teraz używać tego pliku category.php
do wyświetlania stron kategorii.
Możesz także dodać bardziej szczegółowe pliki szablonów w motywie potomnym, aby przejąć mniejszy segment odpowiednich stron.
Na przykład, jeśli motyw nadrzędny ma szablon archive.php
, który jest plikiem szablonu nadrzędnego do wyświetlania stron autora, kategorii, taksonomii, daty i tagów, ale nie ma szablonu author.php
, który jest bardziej szczegółowym szablonem w hierarchii szablonów WordPress, możesz dodać ten szablon author.php
do motywu podrzędnego i zmienić układ stron autora. W ten sposób pozostawiasz taki sam układ i wyświetlanie kategorii, taksonomii, daty i tagów, a zmieniasz tylko strony autora.
Nadpisywanie plików szablonów nadrzędnych
Ostatnim i prawdopodobnie najczęstszym zastosowaniem nadpisywania funkcji motywu nadrzędnego jest nadpisanie plików szablonów motywu nadrzędnego.
Jeśli chcielibyśmy coś zmienić w szablonie strony w utworzonym wcześniej motywie potomnym Adrenaline, musielibyśmy skopiować plik page.php
z motywu nadrzędnego do naszego folderu motywu potomnego i wprowadzić żądane zmiany.
Jeśli chcielibyśmy zmienić autora i datę wyświetlaną w pojedynczym poście, skopiowalibyśmy plik single.php
do motywu potomnego i dokonali zmian w tym pliku.
Zastępowanie szablonów motywów nadrzędnych jest bardzo wydajne, ponieważ możesz zmienić wszystko, co chcesz, wprowadzając kilka modyfikacji istniejących plików szablonów motywów nadrzędnych, ale zachowując motyw nadrzędny w stanie nienaruszonym i bezpiecznym dla aktualizacji.
Przełączanie na motyw potomny w już skonfigurowanym motywie nadrzędnym
Jeśli masz istniejącą witrynę WordPress bez motywu potomnego i chcesz zacząć korzystać z motywu potomnego, należy zwrócić uwagę na kilka rzeczy.
Możesz utworzyć motyw potomny automatycznie za pomocą wtyczki lub możesz to zrobić ręcznie. W tej chwili prawdopodobnie myślisz: „Tak, wtyczka! Kto chciałby robić cokolwiek ręcznie, jeśli można to zrobić automatycznie?” Cóż, nie mylisz się, ale ponieważ chcesz dowiedzieć się więcej o motywach potomnych, najpierw przyjrzymy się krokom ręcznym
Ręczne przełączanie na motyw potomny
Najpierw utwórz motyw potomny dla motywu nadrzędnego i wyodrębnij wszelkie modyfikacje lub dodatki wprowadzone bezpośrednio w kodzie motywu nadrzędnego do motywu potomnego. Dzięki temu motyw nadrzędny będzie bezpieczny dla aktualizacji, a niestandardowy kod zostanie starannie schowany w motywie potomnym.
Teraz, po aktywowaniu motywu potomnego, niektóre rzeczy mogą wyglądać dziwnie, a nawet zepsute, jeśli spojrzysz na swoją pierwszą stronę. Powodem tego bałaganu jest to, że WordPress widzi motyw podrzędny jako nowy osobny motyw, więc wszystkie ustawienia motywu są resetowane do wartości domyślnych. Powoduje to przełączanie lokalizacji widżetów na pasku bocznym (widżet z paska bocznego w stopce może znaleźć się w sekcji nagłówka itd.), a ustawienia dostosowywania są resetowane do domyślnych ustawień motywu.
Widgety – aby naprawić problem z widżetami, przejdź do Wygląd -> Widgety i przenieś (przeciągnij i upuść) widżety na odpowiednie paski boczne.
Ustawienia dostosowywania — istnieje łatwy sposób na migrację ustawień dostosowywania, które zostały już ustawione w motywie nadrzędnym. Wtyczka Customizer Export/Import jest bardzo łatwa w użyciu i zaimportuje ustawienia dostosowywania motywu nadrzędnego, więc nie musisz ustawiać ich ręcznie. Postępuj zgodnie z tymi instrukcjami, aby przenieść ustawienia dostosowania do motywu podrzędnego.
Jeśli Twój motyw korzysta z innych struktur opcji motywu, może być konieczne ich ponowne skonfigurowanie.
Po wykonaniu tych czynności motyw potomny powinien wyglądać tak samo, jak motyw nadrzędny, ale jesteś gotowy na dalsze modyfikacje i regularne aktualizacje motywu nadrzędnego.
Teraz, gdy rozumiemy, jakie są problemy podczas przełączania na motyw potomny i jak je rozwiązać, spójrzmy na łatwiejszy sposób przejścia na motyw potomny za pomocą wtyczki.
Automatyczne przełączanie na motyw potomny (z wtyczką)
Słowo „automatyczny” może być tutaj trochę za dużo, ponieważ nadal będziemy musieli zrobić kilka rzeczy, aby przełączyć się na motyw potomny, ale jest to o wiele łatwiejsze i szybsze niż robienie tego ręcznie.
Najlepszą wtyczką generatora motywów potomnych, którą przetestowałem, jest wtyczka konfiguratora motywów potomnych. Umożliwi nam to stworzenie motywu potomnego i migrację wszystkich ustawień motywu z motywu nadrzędnego za jednym razem. To cudownie!
Oto krótki samouczek, jak przełączyć się na motyw potomny za pomocą tej wtyczki:
- zainstaluj i aktywuj wtyczkę Child Theme Configurator na swojej stronie WP,
- przejdź do Narzędzia -> Motywy potomne ,
- w pierwszym kroku wybierz opcję „UTWÓRZ nowy motyw podrzędny”, upewnij się, że wybrano właściwy motyw nadrzędny i kliknij przycisk Analizuj,
- po zakończeniu analizy wtyczki możesz przejrzeć wszystkie dodatkowe opcje, które się pojawią i wprowadzić poprawki, w zależności od motywu nadrzędnego, ale ustawienia domyślne są zazwyczaj w porządku,
- możesz kliknąć przycisk Pokaż / ukryj atrybuty motywu potomnego i zmienić nazwę motywu potomnego i inne metadane,
- w opcji Kopiuj menu, widżety i inne ustawienia dostosowywania z motywu nadrzędnego do motywu potomnego należy zaznaczyć pole wyboru, aby widżety i ustawienia dostosowywania zostały przeniesione z istniejącego motywu nadrzędnego do nowo utworzonego motywu potomnego,
- kliknij przycisk Utwórz nowy motyw podrzędny.
Otóż to!
Aby uzyskać pełny samouczek na temat tworzenia motywów potomnych i przykłady dla tej wtyczki, sugeruję obejrzenie filmów zamieszczonych na stronie wtyczki konfiguratora motywów potomnych.
Testowałem tę wtyczkę na naszym motywie Adrenaline i działała świetnie. Motyw potomny został pomyślnie utworzony, a widżety i ustawienia dostosowywania również zostały do niego przeniesione, więc zdecydowanie polecam tę wtyczkę.
Streszczenie
Motywy potomne to zalecany sposób modyfikowania motywów WordPress. Pozwalają użytkownikom na stworzenie własnego motywu, z niewielkimi lub większymi modyfikacjami, ale jednocześnie pozostawiają nienaruszony motyw nadrzędny.
Przyjrzeliśmy się wszystkim, co mają do zaoferowania motywy potomne i jeśli uważasz, że zostawiłem coś odkrytego, podziel się tym z nami w sekcji komentarzy poniżej, a dodam to do tego przewodnika.
Mam nadzieję, że użyjesz motywu potomnego do każdego przyszłego projektu WordPress, ponieważ w zasadzie nie ma żadnych wad, tylko korzyści; jeśli nic więcej, motyw nadrzędny może otrzymywać regularne aktualizacje.