Utwórz i dostosuj motyw potomny WordPress
Opublikowany: 2020-09-29Jeśli chcesz wprowadzić zmiany w motywie WordPress, prawdopodobnie słyszałeś, że dobrym sposobem na to jest utworzenie i dostosowanie motywu potomnego WordPress . Ale czy wiesz, czym jest motyw potomny i dlaczego warto z niego korzystać? Jeśli nie, to jesteś we właściwym miejscu.
Motyw potomny WordPress
Posiadanie motywu potomnego oznacza, że istnieje również motyw nadrzędny. Relacja rodzic-dziecko to coś, o czym słyszałeś, jeśli wiesz trochę o kodowaniu. Jeśli chodzi o WordPress, mamy na przykład relację rodzic-dziecko w niestandardowych typach postów. Klasa lub motyw dziecka to coś, co ma cechy rodzica, ale może mieć więcej dodatkowych cech, co odróżnia je od rodzica. Mówiąc o motywach, obok czasu nadrzędnego instalowany jest motyw potomny. Motyw potomny umożliwia nam zmianę motywów nadrzędnych, ale w bezpieczny sposób, bez bezpośredniej edycji motywu nadrzędnego . Zasadniczo motyw potomny będzie miał większość ustawień projektowych tak samo jak motyw nadrzędny. Ale jeśli wprowadzisz w nim jakieś zmiany, te zmiany zastąpią ustawienia początkowe.
Powody, dla których warto używać motywu potomnego
Jeśli zastanawiasz się, dlaczego nie wprowadzić zmian bezpośrednio w motywie nadrzędnym, wyjaśnimy to teraz. Głównym powodem, dla którego nie jest to dobry pomysł, są aktualizacje motywów. Aby Twoja witryna działała poprawnie, chcesz zastosować aktualizacje . Jeśli jednak dostosujesz motyw nadrzędny, wszystkie zmiany zostaną utracone za każdym razem, gdy zaktualizujesz motyw, ponieważ zmiany zostaną nadpisane.
Jak działają motywy potomne WordPress?
Motyw potomny jest przechowywany w oddzielnym katalogu niż motyw nadrzędny. Za każdym razem ma swoje własne pliki style.css i functions.php. Chociaż musisz mieć co najmniej dwa pliki w katalogu motywu potomnego, aby działał poprawnie, możesz również dodać inne pliki. Dwa minimalne pliki mogą pomóc w zmianie stylu, kodowania i skryptów oraz parametrów układu. Gdy użytkownik odwiedza Twoją witrynę, WordPress ładuje motyw potomny, a następnie uzupełnia brakujące style i funkcje za pomocą części motywu nadrzędnego. Pozwala to w pełni wykorzystać motyw podrzędny i dostosować go bez poświęcania podstawowej funkcjonalności motywu nadrzędnego.
Jak stworzyć motyw potomny
Istnieje kilka sposobów tworzenia motywu podrzędnego. Możesz to zrobić ręcznie, korzystając z klienta FTP lub katalogu plików, albo utworzyć motyw potomny za pomocą wtyczki lub generatora online.
Ręcznie
Aby ręcznie utworzyć motyw potomny, musisz użyć klienta FTP lub menedżera plików. Pamiętaj też, że tutaj utworzymy plik style.css oparty na motywie Twenty Seventeen.
- Za pomocą klienta FTP lub menedżera plików przejdź do folderu public_html > wp-content > folder motywów
- Tutaj powinieneś utworzyć nowy folder. Konwencje mówią, że powinieneś nazwać ten folder nazwą motywu nadrzędnego, ale dodać -child jako sufiks. Tutaj nazwa nowego folderu będzie miała dwadzieścia siedemnaście dzieci.
- Utwórz plik style.css w folderze i dodaj do niego ten kod:
/* Theme Name: Twenty Twenty Child Theme URL: http://yourdomain.com Description: Twenty Twenty Child Theme Author: Your Name Author URL: http://yourdomain.com Template: twentytwenty Version: 1.0.0 Text Domain: twentytwenty-child */- W razie potrzeby dostosuj wartości. Zwróć szczególną uwagę na wiersz Szablon, ponieważ informuje on WordPress, z którym motywem nadrzędnym jest powiązany Twój motyw potomny. Po zakończeniu zapisz zmiany i zamknij.
- Za pomocą edytora tekstu utwórz kolejny plik o nazwie functions.php, ale nie kopiuj kodu z motywu nadrzędnego. Skopiuj i wklej tam ten kod do pustego pliku:
<?php add_action( 'wp_enqueue_scripts', 'enqueue_parent_styles' ); function enqueue_parent_styles() { wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css' ); } ?>- Po zapisaniu i zamknięciu tego pliku odwiedź swoją witrynę i przejdź do Wygląd> Motyw. Aktywuj motyw potomny, a zauważysz, że wygląda tak samo jak motyw nadrzędny.
Korzystanie z wtyczki motywu potomnego
Korzystanie z wtyczki motywu potomnego może być łatwiejsze i bardziej intuicyjne. Oto niektóre wtyczki, których możesz użyć na przykład Generator motywów potomnych, Konfigurator motywów potomnych lub Kreator motywów potomnych. Pamiętaj, że korzystanie z wtyczek również wymaga pewnej wiedzy. Na przykład może być konieczne wyłączenie wtyczki bez dostępu do obszaru administracyjnego, ponieważ może nadejść czas, w którym nie będziesz mieć tego dostępu. A to wymaga pewnych umiejętności. Jednak ogólnie rzecz biorąc, wtyczki są zwykle łatwe w obsłudze, więc nie bój się ich używać.
Korzystanie z generatora online
Korzystanie z internetowego generatora motywów potomnych jeszcze bardziej ułatwia ten proces. Wystarczy wejść na https://childtheme-generator.com i postępować zgodnie z instrukcjami. Kiedy tworzysz i pobierasz motyw, przejdź do Wygląd> Motyw i prześlij i aktywuj motyw podrzędny.
Jak dostosować motyw potomny
Aby dostosować motyw potomny, musisz wiedzieć, jak sprawdzać elementy na stronie i rozumieć podstawowe zasady CSS. Aby spersonalizować motyw potomny, z aktywnego motywu potomnego przejdź do Dostosuj>Dodatkowy CSS.
Zmień kolor tła
Odpowiednie tło odgrywa ważną rolę w wyglądzie strony. Chociaż możesz dodać obraz tła w WordPress, tutaj porozmawiamy tylko o zmianie koloru tła motywu potomnego. Aby to zrobić, dodaj tę regułę CSS:
.treść-witryny-zawiera {
kolor tła: #DEF0F5;
pozycja: względna;
}
Pamiętaj, że możesz zmienić wartość po kolorze tła. Ta konkretna wartość jest wartością jasnoniebieskiego.
Zmień kolor paska bocznego
To jest reguła CSS, którą powinieneś wstawić, aby zmienić kolor paska bocznego:
.widżet {
tło: #B9EBFA;
wypełnienie: 25px;
Dostosuj typy, rozmiar i kolor czcionki
Aby zmienić typ, rozmiar i kolor czcionki w motywie podrzędnym WordPress, wstaw poniższy kod. Zauważ, że znacznik p reprezentuje tekst akapitowy.
p {
kolor: turkusowy;
}
p {
rodzina czcionek: Georgia;
rozmiar czcionki: 18px;
}
Możesz także zmienić tekst innych części, takich jak tytuł i nagłówek, ale musisz sprawdzić elementy, zlokalizować łącze stylu CSS, skopiować go i zmienić wartości zgodnie z potrzebami.
Wniosek
Jeśli chcesz dostosować motyw bez bezpośredniej zmiany jego kodu, motywy podrzędne to świetny sposób na zrobienie tego. Dzięki temu przewodnikowi będziesz mógł tworzyć i dostosowywać motywy potomne WordPress i używać ich do wielu różnych zadań . Najlepsze jest to, że po zaktualizowaniu motywu nadrzędnego nie stracisz swoich zmian.