Site icon Kamil Wyremski

Tworzenie motywu potomnego w WordPress

administrator

W tym wpisie przedstawię pokrótce w jaki sposób możemy stworzyć motyw potomny w WordPress. Dlaczego chcielibyśmy go tworzyć? To chyba najlepsze rozwiązanie jeśli chcemy wprowadzić zmiany w istniejącym, gotowym motywie w taki sposób żeby jego aktualizacja nam ich nie nadpisała. Podobnie z tłumaczeniami – być może używany motyw nie jest przetłumaczony na nasz język, lub ma błędne tłumaczenie i tutaj motyw potomny pomoże nam poprawić tłumaczenie w taki sposób żeby go nie utracić przy aktualizacji plików głównego motywu.

Co to jest motyw potomny?

Motyw potomny to motyw który dziedziczy style po motywie głównym (rodzicu) i działa jako swego rodzaju nakładka na motyw właściwy. W motywie potomnym możemy dodać własne style CSS które będą nadpisywać te z motywu rodzica oraz pliki PHP które będą miały większy priorytet. WordPress będzie najpierw szukał plików PHP w motywie dziecka a jak ich nie znajdzie to dopiero wtedy będzie brał z motywu rodzica. Wyjątkiem jest plik functions.php który jest odczytywany z obu motywów. Dzięki temu nasze modyfikacje w plikach CSS, JS i PHP nie zostaną nadpisane aktualizacją motywu rodzica. A trzeba pamiętać że aktualizacja wtyczek lub motywów powoduje nadpisanie wszystkich istniejących plików na hostingu – a więc jeśli wprowadzaliśmy modyfikacje bezpośrednio w plikach głównego motywu i go zaktualizujemy to wtedy utracimy modyfikacje. Dlatego w tej sytuacji niezbędne jest używanie motywu potomnego.

Tworzenie motywu potomnego w WordPress

Istnieją wtyczki do tworzenia motywów, jednak w tym wpisie przedstawię jak to zrobić bez użycia wtyczek, za pomocą dostępu do konta FTP.

  1. Przejdź na koncie FTP do folderu /wp-content/themes/ i utwórz tam folder o nazwie „nazwa motywu głównego myślnik child” czyli jeśli motyw główny ma nazwę „abc” to motyw potomny powinien mieć nazwę „abc-child”
  2. W nowo utworzonym folderze tworzymy dwa niezbędne pliki: style.css i functions.php
  3. W pliku style.css wklej następującą zawartość:
/*
Theme Name: ABC Child
Theme URL: https://example.com
Description: ABC Child Descrption
Template: abc
Version: 1.0.0
*/

Theme Name to nazwa motywu która będzie wyświetlana w panelu WordPress, razem z opisem (pole Description) i adresem URL (pole Theme URL). Ważne jest zeby w pole Template wpisać nazwę folderu z motywem nadrzędnym, bez tego szablon potomny nie będzie działac.

W tym pliku możesz dodać własne style CSS.

4. W pliku functions.php wklej poniższy kod aby zaimportować style CSS rodzica:

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

W tym pliku możesz też dodawać własne funkcjonalności, importować dodatkowe style, skrypty itd.

5. Włącz motyw potomny w panelu WordPress w Wygląd > Motywy

6. Jeśli chcesz dokonać modyfikacji w jakimś pliku PHP z motywu nadrzędnego skopiuj go do motywu potomnego i dokonaj zmian. WordPress będzie w pierwszej kolejności wczytywał pliki z motywu potomnego i gdy danego nie ma to pobierze z motywu nadrzędnego. W ten sposób możesz w motywie potomnym stworzyć np. własną wersję stopki, nagłówka, wpisu blogowego.

Tłumaczenie motywu potomnego

Jeśli motyw nadrzędny zawiera plik do tworzenia tłumaczeń .pot (np. w katalogu /languages) możemy z niego utworzyć tłumaczenie programem Poedit. Wygenerowane pliki wgrywamy w motywie potomnym do katalogu /languages i w pliku functions.php dodajemy:

function my_child_theme_locale() {
  load_child_theme_textdomain( 'abc', get_stylesheet_directory() . '/languages' );
}
add_action( 'after_setup_theme', 'my_child_theme_locale' );

Gdzie „abc” podmieniamy na domenę tłumaczenia z motywu nadrzędnego (zazwyczaj to nazwa folderu z motywem nadrzędnym).

Podsumowanie

Mam ndzieję, że ten wpis pomoże w tworzeniu własnych motywów potomnym w WordPressie. Jeśli zauważyłeś błąd lub masz pytania – śmiało dodaj komentarz.

Zobacz tez przykładowe wykorzystanie motywu potomnego we wpisie dotyczącym tworzenia motywów w wordpress: Własny motyw do WordPressa – itworksb5

Exit mobile version