Jak stworzyć motyw potomny WordPress

W tym wpisie dowiesz się jak stworzyć motyw potomny WordPress / WooCommerce bez użycia żadnej wtyczki.
Pomoże Ci to edytować motyw bez obaw o nadpisanie czy usunięcie zmian. Motyw potomny WordPress to również dobry sposób by dodać kod śledzenia Google Analytics czy HotJar, również nie używając żadnej wtyczki.
Czym jest motyw potomny? Jest to motyw, który korzysta z plików motywu głównego. Jednakże ma tę zaletę, że edytując jego pliki, nie znikną one w przypadku aktualizacji motywu głównego.

Na samym końcu tego artykułu znajdziesz również wersję wideo tego poradnika. Zaczynajmy!

Tworzenie motywu potomnego

Zanim przejdziesz do pracy, zrób kopie zapasowe. Podczas pracy zawsze jest ryzyko jakichś błędów w związku z czym lepiej się zabezpieczyć.

Znajdź folder „Themes”

Znajdź dane i zaloguj się do swojego hostingu poprzez FTP. Możesz użyć do tego programu „FileZilla„. Jak to zrobić pokazywałem w filmie o Darmowym hostingu WordPress.

Po zalogowaniu zobaczysz różne foldery dostępne dla Twojego hostingu. Twoim zadaniem jest znaleźć folder „Themes„. Najpewniej będziesz musiał/a wejść w folder „domains„, potem folder z nazwą Twojej domeny, następnie „public_html„, dalej „wp-content” i wreszcie „themes„.

Utwórz folder

Teraz pora na utworzenie folderu. Dobrą praktyką jest to, by nadać mu nazwę składającą się z nazwy motywu głównego + słowo child. Ma to pozwolić uniknąć nieporozumień w przypadku edycji.
W moim przypadku, tworzę motyw potomny oparty na motywie Astra dlatego nazwałem folder „astrachild„. Możesz go znaleźć na zrzucie ekranu z poprzedniego akapitu.
Kliknij prawym przyciskiem myszy i wybierz opcję „Utwórz katalog”, nadając mu odpowiednią nazwę.

Dwa niezbędne pliki

Wejdź do pustego folderu. Żeby stworzyć motyw potomny WordPress, potrzebujesz dwa pliki. Są to: style.css oraz functions.php.
Do tego pierwszego dodamy treść, która odpowiada za połączenie z motywem – rodzicem a w drugim wpiszemy kawałek kodu, który zaimportuje ustawienia stylu od „rodzica”.

Zacznijmy od stworzenia pliku „style.css”. Tak jak poprzednio, klikamy prawym przyciskiem myszy i wybieramy „Utwórz nowy plik„. Nadajemy mu nazwę „style.css” – zwróć uwagę by się nie pomylić. Następnie klikamy na niego prawym i wybieramy „Podgląd/Edycja„. Plik zostanie pobrany na Twój dysk i otworzony jakimś edytorem tekstowym (najpewniej będzie to notatnik) lub zapyta o wybranie takiego programu. Wybierz wtedy notatnik.

Gdy go otworzysz, wklej następującą treść:

/* 
Theme Name:   Astra – motyw potomny
Template:     astra
*/

Pamiętaj żeby dostosować jego treść do motywu, na bazie, którego tworzysz motyw potomny. W moim przypadku jest to Astra, ale jak wybierzesz, na przykład motyw KADENCE to powyższa treść zmieni się następująco:

/* 
Theme Name:   Kadence – motyw potomny
Template:     kadence
*/

Zwróć też uwagę na linijkę „Template: astra”. Po dwukropku musisz podać dokładną nazwę folderu w którym będzie motyw – rodzic. Zwróć też uwagę, że jest to zawsze nazwa pisana małymi literami.
Gdy skończysz edycję, zapisz plik i go zamknij a program zapyta Cię czy wysłać go z powrotem na serwer. Oczywiście wyraź zgodę.

Pora na drugi plik – functions.php

Tutaj postępujesz tak samo, tworzysz nowy plik i nadajesz mu nazwę „functions.php” po czym klikasz prawym i wybierasz „Podgląd/Edycja„.
Gdy już go otworzysz, wklej następujący kawałek kodu:

<?php
add_action( 'wp_enqueue_scripts', 'enqueue_parent_styles' );
function enqueue_parent_styles() {
   wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css' );
}

Odpowiada on za import ustawień stylu z głównego motywu. Gdy skończysz, zapisz go i zamknij po czym wyślij na serwer.

Sprawdź działanie

Żeby sprawdzić czy wszystko działa poprawnie, polecam otworzyć nowe okno prywatne/incognito w przeglądarce i wpisać adres swojej witryny. Zaloguj się do WordPressa i kliknij Wygląd > Motywy. Twoim oczom powinien się ukazać nowy motyw, który utworzyłeś/aś. Włącz go, po czym odśwież stronę i zobacz jak wygląda.

Jeśli wszystko przebiegło pomyślnie, możesz cieszyć się stworzonym motywem potomnym. Teraz, zależnie od potrzeb, możesz dokonywać edycji lub na przykład wkleić kod Google Analytics.

Wolisz bogatszą w treść wersję wideo? Sprawdź wideo-poradnik:

W tym poradniku to już wszystko. Dziękuję za poświęcony czas i zapraszam do śledzenia mojego kanału na YouTube:
Partofweb.pl – Strony internetowe & biznes online.

Jako PARTOFWEB świadczę usługi tworzenia blogów, stron i sklepów internetowych. Pomagam przy optymalizacji SEO oraz diagnostyce usterek witryny. Jeśli potrzebujesz pomocy napisz do mnie za pomocą formularza kontaktowego lub e-mailem na kontakt@partofweb.pl.