Jak utworzyć motyw podrzędny w WordPress (programowo i wtyczka)

Opublikowany: 2020-06-11

Chcesz dostosować wygląd swojej witryny i zrobić wrażenie na odwiedzających? W tym przewodniku pokażemy, jak stworzyć motyw potomny w WordPressie, zarówno z odrobiną kodowania, jak i z wtyczkami .

Personalizacja jest silnym czynnikiem w projektowaniu Twojej witryny. Chcesz mieć pewność, że zrobisz wszystko, aby Twoja witryna się wyróżniała. I chociaż możesz użyć motywu WordPress z projektem, który odpowiada Twoim potrzebom, możesz zrobić znacznie lepiej, jeśli dodasz odrobinę smaku do ustawień domyślnych. Niezależnie od tego, czy chodzi o zmianę kilku ustawień tła, czy skonfigurowanie mega menu dla Twojej witryny.

Jednak dostosowanie witryny może być sporym zadaniem, zwłaszcza jeśli zmieniasz projekt, który działał dobrze dla Ciebie. Dlatego jeśli chcesz dostosować swój motyw WordPress, zdecydowanie zalecamy użycie motywu podrzędnego. I to właśnie oferuje dzisiejszy samouczek: przyjazny dla początkujących przewodnik, jak utworzyć motyw podrzędny w WordPress .

Czym jest motyw potomny?

Mówiąc najprościej, motyw potomny to dodatkowy tworzony motyw , który dziedziczy projekt i wygląd istniejącego motywu nadrzędnego. Motyw potomny dziedziczy również wszystkie funkcje i cechy motywu nadrzędnego, które również możesz modyfikować.

Ale jeśli ma ten sam projekt i funkcje, co motyw nadrzędny, dlaczego potrzebujesz motywu potomnego? Tworzenie motywów potomnych w WordPressie ma pewne zalety. Po pierwsze, możesz oddzielić dostosowywanie od motywu nadrzędnego i dostosowywać je indywidualnie. Na przykład możesz wprowadzić zmiany w kodzie motywu podrzędnego, a to dostosowanie pozostanie oddzielone od motywu nadrzędnego, więc żaden z plików w motywach nadrzędnych nie zostanie naruszony.

Co więcej, kluczową zaletą korzystania z motywu potomnego jest to, że możesz zachować wszystkie dostosowania nawet po zaktualizowaniu motywu nadrzędnego. Ogromnym problemem związanym z dostosowywaniem motywu nadrzędnego jest to, że po aktualizacji motywu te modyfikacje zostaną utracone. Tak więc w przypadku motywu potomnego, niezależnie od tego, czy zmienisz style, szablony czy funkcje, modyfikacje dokonane w plikach motywu pozostaną zapisane nawet po aktualizacji.

Deweloperzy mogą również używać motywów podrzędnych do szybkiego tworzenia nowszych projektów motywów. Korzystając z motywów potomnych, nie muszą zaczynać od zera i mogą modyfikować motywy nadrzędne, aby pasowały również do ich projektów motywów.

Korzyści z motywów potomnych

Podsumowując, jeśli potrzebujesz większej elastyczności w dostosowywaniu motywu, użycie motywu podrzędnego jest doskonałym pomysłem. Niektóre z głównych korzyści płynących z używania motywów potomnych to:

  • Wszelkie dostosowania dokonane w motywie podrzędnym pozostają oddzielone od rodzica, a zatem nie są przywracane ani tracone po aktualizacjach.
  • Nie ma ryzyka przypadkowego uszkodzenia głównego motywu lub jego plików.
  • Deweloperzy mogą używać motywów podrzędnych i motywów nadrzędnych, aby skrócić czas programowania, tworząc elastyczne projekty motywów i struktury motywów.
  • Motywy potomne są bardzo lekkie i zawsze możesz cofnąć wszelkie zmiany, po prostu wyłączając lub usuwając motyw potomny.

Teraz, gdy wyjaśniliśmy, dlaczego warto rozważyć użycie motywu potomnego, przyjrzyjmy się, jak utworzyć motyw potomny w WordPress.

Jak stworzyć motyw potomny w WordPress

Istnieją 2 główne sposoby tworzenia motywu potomnego w WordPress:

  1. Korzystanie z wtyczki
  2. Programowo

Obie metody mają swoje wady i zalety, więc użyj tej, która najlepiej odpowiada Twoim umiejętnościom i potrzebom.

1) Utwórz motyw potomny za pomocą wtyczki WordPress

Tworzenie motywu potomnego za pomocą wtyczki jest najłatwiejszym i najbardziej przyjaznym dla początkujących sposobem. Wszystko, co musisz zrobić, to zainstalować wtyczkę, kliknąć kilka przycisków tu i tam i gotowe. Istnieje ogromna liczba wtyczek motywów potomnych, które są bardzo łatwe w użyciu.

W tym przewodniku użyjemy wtyczki Generator motywów potomnych. Jeśli chcesz rzucić okiem na inne opcje, zalecamy zapoznanie się z naszą listą najlepszych wtyczek WordPress Child Theme.

Po podjęciu decyzji, który dodatek wolisz, musisz go zainstalować. Otwórz więc pulpit administracyjny WP Admin, najedź kursorem na wtyczki i kliknij Dodaj nowy . Następnie użyj paska wyszukiwania w prawym górnym rogu, aby wyszukać wtyczkę, którą zamierzasz zainstalować. Zamierzamy zainstalować Generator motywów potomnych .

utwórz motyw potomny w WordPressie - tytuł wtyczki

Następnie zainstaluj żądaną wtyczkę. Po zakończeniu instalacji naciśnij Aktywuj. Możesz także aktywować/dezaktywować wtyczki, przechodząc do Wtyczki> Zainstalowane wtyczki na pasku bocznym.

utwórz motyw potomny w WordPressie - zainstaluj wtyczkę

Jak stworzyć motyw potomny za pomocą wtyczki Generator motywów potomnych?

Po zainstalowaniu i aktywacji wtyczki otwórz interfejs wtyczki, klikając Ustawienia > Gen motywu potomnego.

utwórz motyw potomny w WordPressie - interfejs wtyczki

Następnie na karcie Utwórz nowy możesz podać różne szczegóły dotyczące motywu podrzędnego.

Po prostu wybierz motyw, który ma być motywem nadrzędnym, dodaj nagłówek motywu, opis, adres URL motywu podrzędnego, autora i inne szczegóły motywu. Tutaj możesz również dodać licencję GNU GPL wraz z plikami motywów.

Gdy skończysz, kliknij Utwórz nowy motyw podrzędny , a motyw podrzędny zostanie utworzony na podstawie wprowadzonych danych.

Następnie możesz go zmienić lub aktywować, przechodząc do Wygląd> Motywy, wybierając nowo utworzony motyw potomny i aktywując go.

Otóż ​​to! Właśnie stworzyłeś swój motyw potomny! Teraz możesz go dostosować i wprowadzić wszystkie potrzebne zmiany.

Przyjrzyjmy się teraz, jak można programowo utworzyć motyw podrzędny bez użycia wtyczki.

2) Programowo utwórz motyw potomny

Jeśli nie chcesz instalować żadnych wtyczek, możesz programowo utworzyć motyw potomny WordPress . Wymaga to trochę kodowania, ale nadal jest dość łatwe nawet dla początkujących. Wszystko, co musisz zrobić, to utworzyć folder motywu potomnego i utworzyć w nim kilka plików.

Aktywuj motyw nadrzędny

Najpierw musisz aktywować motyw nadrzędny , z którego chcesz utworzyć motyw podrzędny w swojej witrynie.

Następnie musisz użyć panelu sterowania hostingu swojej witryny i uzyskać dostęp do folderów na serwerze. Będziesz musiał użyć menedżera plików panelu lub klienta FTP, aby otworzyć folder motywu witryny. To jest pod public_html/wp-content/themes .

Kroki

Po zlokalizowaniu folderu motywu wykonaj następujące proste czynności:

1) Utwórz folder w katalogu motywów z nazwą motywu potomnego. Na razie będziemy używać Demo motywu podrzędnego . Możesz również użyć nazwy motywu nadrzędnego, po której następuje przyrostek podrzędny, aby ułatwić zarządzanie. Na przykład Flash-Child lub Blacklite-Child .

2) Następnie utwórz plik style.css i skopiuj następujący kod do pliku style.CSS.

 /*
Nazwa motywu: Motyw potomny Demo
Szablon: Blacklite
URL motywu: Quadlayers.com/blog
Opis: Demo motywu potomnego
Autor motywu: Quadlayers
Adres URL autora: Qualayers.com
Wersja: 1.0.0
*/

Nazywa się to arkuszem stylów. Pamiętaj, aby zmienić te informacje dla motywu potomnego. Po prostu dodaj informacje po dwukropkach dla każdego wiersza kodu. Najważniejszymi częściami są tutaj nazwa motywu, która musi być unikalna, oraz nazwa szablonu , którego używasz, ponieważ musisz określić, którego motywu nadrzędnego używasz.

3) Następnie utwórz plik o nazwie Functions.php w folderze motywu potomnego i skopiuj następujący kod:

 <?php
add_action( 'wp_enqueue_scripts', 'enqueue_parent_styles' );
function enqueue_parent_styles() {
wp_enqueue_style( 'styl nadrzędny', get_template_directory_uri().'/style.css' );
}
?>

4) Zapisz oba pliki, a następnie przejdź do pulpitu nawigacyjnego > Wygląd > Motywy. Zobaczysz nowy motyw potomny z opisem wstawionym do folderu Style.CSS !

I tak programowo tworzysz motyw podrzędny w WordPressie. Zobaczmy teraz, jak to dostosować.

Jak dostosować motyw podrzędny WordPress?

W tej sekcji przyjrzymy się, co możesz zrobić, aby dostosować wygląd motywu potomnego na głębszym poziomie. Po pierwsze, zmieńmy ustawienia czcionki i kolor tła za pomocą odrobiny CSS.

Dostosuj swój motyw CSS

Najpierw przejdź do Wygląd > Dostosuj , aby otworzyć dostosowywanie motywów. Następnie kliknij Dodatkowy CSS w menu paska bocznego.

utwórz motyw potomny w WordPressie - konfigurator

Tutaj możesz dodać kody CSS, które bezpośrednio nadpiszą ustawienia motywu. Na przykład możesz dodać ten mały kod:

 P {
kolor: szary;
}
P {
rodzina czcionek: Helvetica;
rozmiar czcionki: 18px;
}

A gdy wstawisz ten mały fragment kodu, zobaczysz zmiany w konfiguratorze Live. Potrzebujemy trochę więcej koloru, więc zmieńmy kolor tła paska widżetów Twojej witryny:

 .widżet {
tło: #00FFFF;
wypełnienie: 25px;
}

Teraz dodajmy dodatkowy wiersz kodu, aby usunąć stopkę dotyczącą praw autorskich „Powered by WordPress”:

 .site-info { wyświetlanie: brak; }

I gotowe, dostosowałeś swój motyw potomny za pomocą odrobiny CSS. To tylko zarysowanie powierzchni tych modyfikacji. Możesz zrobić o wiele więcej.

Dostosuj plik Theme Functions.php

Możesz bezpośrednio dostosować pliki motywów, przechodząc do opcji Wygląd > Edytor motywów . Następnie kliknij plik Functions.php , aby dodać niestandardowe funkcje do motywu.

stwórz motyw potomny w WordPressie - funkcje

Na przykład, aby wyłączyć kliknięcie prawym przyciskiem myszy w swojej witrynie, dodaj te wiersze kodu do pliku Functions.php:

 funkcja twoja_funkcja() {
?>
<skrypt>
jQuery(dokument).gotowy(funkcja(){
jQuery(dokument).bind("menu kontekstowe",funkcja(e){
zwróć fałsz;
});
});
</script>
<?php
}
add_action('wp_footer', 'twoja_funkcja');

Następnie kliknij Aktualizuj plik.

Wreszcie, jeśli coś zepsujesz, możesz po prostu usunąć motyw potomny, utworzyć nowy, a następnie zacząć od zera bez wpływu na motyw nadrzędny.

Wniosek

Podsumowując, tworzenie i dostosowywanie motywów potomnych otwiera zupełnie nową ścieżkę modyfikacji motywów dla każdego rodzaju użytkownika WordPress. Najlepszą rzeczą w tym jest elastyczność, jaką zapewnia, ponieważ możesz cofnąć wszystko, co mogło zepsuć Twój motyw. Ponadto wszystkie dostosowania pozostają oddzielone od motywu nadrzędnego i nie zostaną utracone po aktualizacjach. Dlatego gorąco zachęcamy do tworzenia motywu potomnego i zabawy z nim, aby ulepszyć swoją witrynę.

To może wydawać się skomplikowane, ale tak nie jest. Wystarczy dodać trochę kodu do plików motywów i zarządzać kilkoma folderami.

Jednak nie wszystkim użytkownikom może być łatwo programowe tworzenie i budowanie motywów podrzędnych, zwłaszcza początkującym. Jeśli tak jest w Twoim przypadku, możesz użyć wtyczki do stworzenia swojego motywu. Jeśli w dowolnym momencie napotkasz problemy, zostaw nam komentarz, a my od razu zabierzemy się za to.

Na koniec, jeśli chcesz jeszcze bardziej dostosować swój motyw, możesz zapoznać się z naszymi przewodnikami , jak edytować stopki i jak dostosowywać nagłówki w WordPressie .