Child-theme na Wordpress – czym jest i jak stworzyć motyw potomny?

 

 

Motyw potomny na stronie Wordpress

Motyw Wordpress może być schludny, przejrzysty i piękny, a i tak z reguły znajdzie się coś do zmiany. Czy to kolor danego elementu czy odstęp pomiędzy przyciskami – kto, choć trochę obeznany z Wordpressem, tego nie zna?

W tym artykule przedstawimy najbezpieczniejszą drogę do wprowadzania zmian i edytowania strony na Wordpressie. Jest nią nic innego niż korzystanie z motywu potomnego, czyli child-theme. Przedstawimy jak go poprawnie zainstalować oraz powiemy, dlaczego powinien być używany w każdej witrynie.

 

Czym jest child-theme?

Child-theme (motyw potomny) jest motywem, który dziedziczy styl, funkcjonalność i konfiguracje innego motywu nadrzędnego. Zmiany wprowadzane w motywie potomnym nie wpływają na motyw nadrzędny, a jedynie go nadpisują.

Oznacza to, że po aktualizacji głównego motywu nadrzędnego, żadne edycje i zmiany w motywie potomnym nie zostaną utracone. Dlatego też korzystanie z child-theme jest uważane za najbezpieczniejszą metodę edytowania strony Wordpress.

Oczywiście, działa to w dwie strony. Jeśli doświadczysz jakichś błędów lub po prostu zdecydujesz, że motyw potomny jest dla Ciebie zbędny, możesz go w prosty sposób wyłączyć – bez strachu, że Twoja strona przestanie działać.

Czy motyw potomny jest mi potrzebny?

Gdy jesteś właścicielem dużej strony, gdzie zmiany wprowadzane są często, albo  programistą działającym na zlecenie, przy którym napisać trzeba setki czy tysiące linijek kodu, użycie child-theme jest wymogem! Mimo że na początku łatwo zapamiętać „co, gdzie i jak” było zmieniane, to z czasem staje się to o wiele bardziej problematyczne, a nawet prowadzi do kompletnego roztargnięcia z pytaniami do samego siebie ‘które pliki były edytowane?’, ‘gdzie ja to zmieniałem?’, …

Sprawdź najszybsze na rynku pakiety hostingowe Wordpress oraz Magento & PrestaShop.

Jak zainstalować child-theme na Wordpressie

Instalacja child-theme jest niesamowicie prosta. Jeżeli używasz płatnego motywu, stworzonego przez sprawdzony zespół developerów, w folderze otrzymanym po zakupie najprawdopodbniej znajdziesz folder „theme-child”, gdzie ‘theme’ to nazwa Twojego motywu, np. twentysix-child. W takim przypadku, wystarczy że zainstalujesz ten plik, tak jakbyś instalował zwykły motyw, a następnie w panelu admina Wordpress, wybierzesz go jako główny motyw używany przez Twoją stronę.

Jeżeli nie posiadasz pliku child-theme, nie ma co panikować. Samodzielne stworzenie motywu potomnego to również bułka z masłem!

 

W poradniku użyjemy „xyz” jako nazwę motywu. Motyw, który używasz nazywa się inaczej, a więc zamiast „xyz” wpisz poprawną nazwę (nazwa folderu motywu nadrzędnego).

1. Na początek, połącz się z FTP za pomocą danych podanych przez Twojego hostingodawcę, lub zaloguj się do panelu hostingowego i przejdź do menadżera plików.

2. Utwórz nowy folder w katalogu „/public_html/wp-content/themes/” o nazwie „xyz-child”.

tworzenie child theme

 

3. Następnym krokiem będzie utworzenie pliku odpowiadającego za styl strony, w folderze „xyz-child” o nazwie „style.css”.

plik style.css motyw potomny

 

Po stworzeniu powyższego pliku, skopiuj i wklej do niego następujący kod:

/*
Theme Name: Xyz Child
Theme URI: https://strona.eu/xyz
Description: Moj pierwszy motyw potomny
Author: Jan Kowalski
Author URI: http://fajnastrona.pl/
Template: xyz
Version: 1.0.0
Tags: black, green, white, light, dark, two-columns, three-columns, left-sidebar, right-sidebar, fixed-layout, responsive-layout, custom-background, custom-header, custom-menu, editor-style, featured-images, flexible-header, full-width-template, microformats
Text Domain: xyz-child
*/

Dwoma najważniejszymi elementami w powyższym kodzie są „Theme Name” oraz „Template”. Pierwsza pozycja przekazuje Wordpressowi nazwę Twojego motywu. Pozycja „Template” informuje Wordpress, który motyw powinien być odbierany jako nadrzędny. Element „Tags” jest listą tagów używanych przez dany motyw – listę można znaleźć w pliku o tej samej nazwie, tj. style.csss, w folderze motywu nadrzędnego. Wszystkie pozostałe elementy są kwestią do samodzielnego odkrycia.

4. Dokładnie tak, jak w kroku 3, stwórz nowy plik – tym razem o nazwie „functions.php”.

plik functions.php child-theme wordpress

 

Wklej do niego poniższy kod:

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

5. Ostatnim krokiem będzie zalogowanie się do panelu admina Wordpress i zmiana wyświetlanego motywu. Przejdź do zakładki ‘Wygląd’, wejdź w ‘Motywy’, a następnie aktywuj „xyz-child”.

 

Podsumowanie

Pomimo iż wprowadzanie zmian w motywie potomnym może wydawać się trudniejsze niż robienie tego w live-edytorze Wordpress, to w przyszłości sam sobie za to podziękujesz – albo podziękują Ci za to programiści, z którymi możliwe, że będziesz miał okazję współpracować.

Za pomocą kilku bardzo prostych kroków, można stworzyć przyszłe ‘zdrowe’ środowisko dla swojej strony, a tym samym uniknąć bólów głowy związanych z nadchodzącymi aktualizacjami i zmianami. Child-theme po prostu rozwiązuje więcej problemów niż ich powoduje, dlatego więc czemu nie poświęcić temu 5 minut i mieć spokój później?

Jeśli chcesz przeczytać więcej artykułów edukacyjnych, nie zapomnij sprawdzić poradnika o tym, jak założyć bloga.

 

 

 

Odbieramy telefony, odpisujemy na maile, nie ukrywamy kosztów, a dodatkowo oferujemy najszybsze pakiety hostingowe na rynku. Uważasz, że to zwroty marketingowe? Sprawdź sam/a!

Jeśli nie będziesz zadowolony/a, zwrócimy Ci pieniądze.
Twoje strony i sklepy przeniesiemy za darmo!

Hosting WordpressHosting Magento & PrestaShop

Jeżeli masz jakiekolwiek pytania, skontaktuj się z nami! Kliknij tutaj.

Chcesz dowiedzieć się o nas trochę więcej? Przejdź na stronę JCHost.pl.

Daj znać znajomym!