Kiedy masz konkretne wymagania, wybór motywu WordPress nie jest łatwym zadaniem. Twój wybór musi wyglądać odpowiednio i zapewniać wszystkie potrzebne funkcje — Pewien kompromis jest niemal nieunikniony.
Dostosowywanie wybranego motywu to jeden ze sposobów, aby poradzić sobie z tym problemem. Jednak motywy WordPressa wymagają okresowej aktualizacji. Kiedy twórca twojego motywu wyda nową wersję, wszystkie twoje dostosowania mogą zostać zresetowane.
Rozwiązanie?
Stwórz motyw potomny WordPress, który dziedziczy funkcjonalność oryginalnego motywu, ale zachowuje twój styl. Nawet jeśli zastosujesz aktualizację motywu, twój dostosowany motyw potomny pozostanie nienaruszony.
W tym poście przyjrzymy się bliżej motywom potomnym WordPress — od tego, dlaczego są potrzebne, po to, jak stworzyć własny. Zanurzmy się!
Czym jest Motyw Potomny?
Motyw Potomny
Motyw potomny to motyw WordPress z takim samym wyglądem i funkcjonalnością jak jego u2018motyw nadrzędnyu2019. Jednak możesz dostosować jego pliki niezależnie od plików motywu nadrzędnego.
Czytaj więcejWordPress pozwala na stworzenie lekkiej kopii dowolnego motywu w celu jego dostosowania. Oryginalny motyw staje się motywem nadrzędnym, a kopia jest znana jako motyw potomny.
Dziecko jest zależne od rodzica, czerpiąc z funkcji i projektu oryginalnego motywu. Kiedy motyw nadrzędny otrzymuje aktualizację, otrzymuje ją również dziecko.
Ale podobnie jak nastolatek, motyw potomny ma pewną niezależność. Gdy dostosowujesz motyw potomny, zmiany są nakładane na oryginalny motyw nadrzędny. Te dodatki pozostają, nawet gdy motyw nadrzędny jest aktualizowany lub zmieniany w jakiś inny sposób.
Warto również zauważyć, że modyfikacje w motywie potomnym nie wpływają na motyw nadrzędny. W rzeczywistości są przechowywane oddzielnie. Oznacza to, że masz wolność eksperymentowania, nie martwiąc się o uszkodzenie bazowego kodu. Możesz nawet usunąć swój motyw potomny całkowicie, a nie będzie to miało żadnego wpływu na oryginalny motyw nadrzędny.
Korzystanie z motywu potomnego ułatwia utrzymanie i aktualizację strony. Pomoże to również uniknąć ryzyka bezpośredniej edycji motywu nadrzędnego, który może zostać nadpisany i utracony.
Różnice między motywami potomnymi a nadrzędnymi
Motyw Nadrzędny
Pracując z motywami potomnymi WordPressa, zawsze istnieje motyw nadrzędny. To motyw, od którego dziecko dziedziczy swój styl i funkcjonalność. Żadne zmiany wprowadzone w motywie potomnym nie wpłyną na kod motywu nadrzędnego.
Czytaj więcejIstnieje kilka technicznych różnic między motywem nadrzędnym a motywem potomnym. Na przykład, folder motywu nadrzędnego zazwyczaj zawiera:
- Plik style.css , który określa wygląd i działanie Twojej strony internetowej.
- Plik functions.php , który umożliwia dodawanie funkcji lub modyfikowanie domyślnego zachowania WordPress.
- Kilka plików szablonów, które definiują sposób wyświetlania różnych stron na Twojej witrynie.
W przeciwieństwie, folder motywu potomnego wymaga tylko dwóch niezbędnych plików: style.css i functions.php. Dodasz te pliki w katalogu /wp-content/themes/.
Możesz użyć motywu potomnego, aby dokonać zmian stylistycznych na swojej stronie internetowej, takich jak zmiana domyślnej palety kolorów, czcionek i układów.
Na przykład, załóżmy, że chcesz zmienić schemat kolorów swojej strony. Możesz to zrobić, tworząc nowy plik style.css w katalogu motywu potomnego i dodając następujący kod:
body {
background-color:#fff;
}
h1 {
color: #000
}
Zmieniliśmy kolor tła i kolor H1 w powyższym kodzie. Te zmiany zastąpią stylizację motywu nadrzędnego i zaktualizują kolory na Twojej stronie. Możesz dokonać tylu zmian, ile potrzebujesz, w pliku style.css motywu potomnego.
Motyw potomny dziedziczy wszystko po motywie nadrzędnym. Obejmuje to wszystkie pliki szablonów, funkcje oraz zasoby takie jak obrazy i pliki JavaScript. Jeśli chcesz dokonać zmian w tych elementach, musisz skopiować je do katalogu motywu potomnego z motywu nadrzędnego. Następnie możesz edytować te pliki.
Dlaczego powinieneś używać motywu potomnego
Istnieje kilka zalet używania motywu potomnego na Twojej stronie WordPress, w tym:
- Ochrona zmian motywów przed automatycznymi aktualizacjami.
- Dostosowywanie elementów wizualnych twojego motywu.
- Nauka edytowania motywów, co jest krokiem w kierunku tworzenia własnego motywu.
Korzystanie z motywu potomnego wymaga minimalnego doświadczenia w kodowaniu. W większości przypadków wystarczy dodać kilka linii kodu do pliku style.css. Umożliwia to łatwe rozpoczęcie pracy z motywem potomnym, nawet jeśli nie jesteś deweloperem motywów.
Jeśli chcesz zgłębić temat, możesz dodać nowe elementy i funkcje do swojego motywu potomnego za pomocą niestandardowego kodu.
Jak Stworzyć Motyw Potomny WordPress za Pomocą Dodatku
Korzystanie z pluginu to prawdopodobnie najłatwiejszy sposób na stworzenie motywu potomnego WordPress. Plugin przeprowadzi Cię przez cały proces w prostych krokach, co oznacza, że nie potrzebujesz żadnej wiedzy technicznej.
W tym samouczku będziemy pracować z pluginem Child Theme Configurator. To przyjazne użytkownikowi narzędzie może pomóc Ci analizować Twój motyw pod kątem problemów, tworzyć motyw potomny i edytować go, aby spełniał specyfikacje układu i stylu Twojej strony internetowej.
Krok 1: Pobierz i zainstaluj wtyczkę Child Theme Configurator
Aby rozpocząć, musisz pobrać i zainstalować Konfigurator Motywów Potomnych. Możesz to zrobić, przechodząc na stronę wtyczki i klikając przycisk Pobierz:
Twój komputer pobierze pliki motywu w pliku ZIP. Następnie przejdź do panelu WordPress i przejdź do Plugins > Add New, aby przesłać pliki.
Kliknij na Upload Plugin > Choose File, i wybierz pobrany folder:
Po zainstalowaniu pluginu wystarczy go aktywować. Pamiętaj również, że musisz wybrać motyw WordPress, z którego utworzysz swój motyw potomny.
Krok 2: Analizuj Motyw Nadrzędny
Następnie przejdź do Narzędzia > Motywy Potomne:
Plugin poprowadzi Cię przez kroki tworzenia motywu potomnego. Wystarczy wybrać UTWÓRZ nowy Motyw Potomny, aby rozpocząć:
Zostaniesz poproszony o wybranie motywu nadrzędnego z menu rozwijanego. Jeśli masz wiele motywów na swojej stronie WordPress, upewnij się, że wybierasz ten, który chcesz dostosować:
Teraz kliknij Analyze, aby sprawdzić motyw nadrzędny pod kątem potencjalnych problemów z kodem:
Jeśli wtyczka znajdzie jakiekolwiek problemy z kompatybilnością lub kodowaniem, zostaną one wymienione tutaj. W przeciwnym razie zobaczysz zielony komunikat o sukcesie informujący, że możesz bezpiecznie przejść do tworzenia motywu potomnego:
Gdy już ustalisz, że Twój motyw nadrzędny nadaje się na motyw potomny, możesz przejść do następnego kroku. (Możesz także wyświetlić analizę surowych danych lub przesłać prośby o wsparcie do twórcy wtyczki z tej strony.)
Krok 3: Nadaj Nazwę Katalogowi Twojego Motywu Potomnego
Następnie zostaniesz poproszony o utworzenie nazwy katalogu motywu potomnego. Jest to nazwa folderu w plikach twojej strony internetowej.
Możesz nazwać to dowolnie, pod warunkiem że nazwa będzie unikalna dla twojej strony i zawiera akceptowalne znaki. Używamy „twentytwentyfour-child” dla uproszczenia:
Pamiętaj, że nazwanie katalogu motywu nie jest tym samym, co nadanie nazwy motywowi potomnemu lub dodanie opisu motywu. Te kroki nastąpią później.
Krok 4: Wybierz Arkusze Stylów Dla Motywów Potomnych i Nadrzędnych
Następnie musisz wybrać nowy arkusz stylów dla swojego motywu potomnego. Jeśli wybierzesz główny arkusz stylów (style.css), Twoje niestandardowe style CSS zastąpią istniejącą zawartość motywu.
CSS
Cascading Style Sheets (CSS) to niezbędny język kodowania używany do stylizowania stron internetowych. CSS pomaga tworzyć piękne strony, modyfikując wygląd różnych elementów, w tym styl czcionki, kolor, układ i wiele innych.
Czytaj więcejTo jest domyślna opcja, i polecamy wybrać ją, jeśli jesteś nowy w motywach potomnych:
Teraz zostaniesz poproszony o wybranie metody obsługi arkusza stylów motywu nadrzędnego. Istnieje wiele opcji, ale zalecamy przestrzeganie Użyj kolejki stylów WordPress w większości przypadków:
Jako początkujący, lepiej jest używać domyślnej opcji, dopóki nie będziesz lepiej zaznajomiony z tym, jak motyw nadrzędny obsługuje arkusz stylów. Pozostałe opcje nie zawsze są kompatybilne ze wszystkimi motywami.
Krok 5: Nadaj Nazwę Swojemu Motywowi Potomnemu
Kolejnym krokiem jest nadanie nazwy twojemu motywowi potomnemu oraz napisanie dla niego opisu.
Konfigurator motywu potomnego pobierze domyślne informacje z motywu nadrzędnego i wyświetli je tutaj. Jeśli tworzysz motyw potomny tylko do użytku osobistego, możesz pozostawić dane bez zmian.
Jednakże, jeśli twój motyw nadrzędny będzie służył jako baza dla nowego motywu, który rozwijasz, warto dodać krótki opis i unikalną nazwę.
Krok 6: Skopiuj ustawienia motywu nadrzędnego do motywu potomnego
Plugin poprosi teraz o potwierdzenie, że może skopiować ustawienia motywu nadrzędnego do twojego motywu potomnego:
Ten krok zapewni, że twój motyw potomny czerpie swoją funkcjonalność i wygląd z motywu nadrzędnego. Zwróć uwagę, że jeśli pracujesz z motywem premium lub ograniczonym jako rodzic, możesz nie być w stanie wykonać tego kroku.
Krok 7: Stwórz Nowy Motyw Potomny i Podgląd
Ostatnim krokiem jest stworzenie motywu potomnego. Kliknij na przycisk Stwórz Nowy Motyw Potomny i poczekaj, aż plugin wykona swoje zadanie:
Powinieneś otrzymać powiadomienie, że twój motyw potomny został pomyślnie utworzony:
Zawsze zobacz podgląd swojego motywu potomnego przed jego aktywacją na stronie. Ten krok pomoże Ci zweryfikować, czy wszystko działa jak należy. Następnie kliknij Aktywuj & Publikuj, aby rozpocząć korzystanie z motywu potomnego.
Jak ręcznie stworzyć motyw potomny WordPress
Jeśli wolisz nie używać pluginu do tworzenia motywu potomnego, możesz użyć metody ręcznej. Możesz preferować tę drogę, jeśli już używasz zbyt wielu pluginów na swojej stronie.
Dodatkowo, ręczne tworzenie motywu potomnego WordPress pozwala na wprowadzenie wszystkich zmian, które chcesz, na poziomie szczegółowym. Pamiętaj tylko, że potrzebujesz średnio zaawansowanej wiedzy o kodzie CSS.
Oto przewodnik krok po kroku:
Krok 1: Opracuj Plan Swoich Zmian
Najpierw znajdź motyw nadrzędny, który Ci się podoba i wymień zmiany, które chcesz wprowadzić. Możesz wyświetlić narzędzia deweloperskie i zobaczyć kod motywu, aby dokonać odpowiednich zmian.
Aby wyświetlić narzędzia deweloperskie, kliknij prawym przyciskiem myszy w dowolnym miejscu na swojej stronie podczas uruchomionego motywu i wybierz Inspect Element. Następnie zobaczysz stronę z danymi, która wygląda mniej więcej tak:
Tutaj możesz wyszukiwać kolory tła, informacje o czcionkach, rozmiar marginesów i więcej. Następnie możesz stworzyć listę funkcji, które chciałbyś dostosować w swoim motywie potomnym.
Krok 2: Wykonaj kopię zapasową swojej strony
Ważne jest, aby wykonać kopię zapasową obecnej strony przed dokonaniem jakichkolwiek zmian, aby uniknąć utraty ustawień. Możesz zawsze powrócić do tej kopii, jeśli zajdzie taka potrzeba. Możesz także rozważyć użycie strony stagingowej, w przypadku popełnienia krytycznych błędów.
Istnieje kilka różnych sposobów na wykonanie kopii zapasowej Twojej strony. Możesz to zrobić ręcznie za pomocą wtyczki do tworzenia kopii zapasowych, co jest prawdopodobnie najłatwiejszą metodą dla większości osób.
Alternatywnie, możesz współpracować z dostawcą hostingu WordPress, który zajmuje się tworzeniem kopii zapasowych stron internetowych. Nasze plany hostingu zarządzanego DreamPress zawierają automatyczne i na żądanie kopie zapasowe, aby chronić Twoje dane.
Krok 3: Utwórz folder dla swojego motywu potomnego
Musisz utworzyć folder, aby przechowywać pliki swojego motywu potomnego. Aby to osiągnąć, najpierw uzyskaj dostęp do swoich plików za pomocą klienta Secure File Transfer Protocol (SFTP) takiego jak Filezilla i przejdź do folderu z motywami: