Od zera: Pokazujemy ci, jak stworzyć profesjonalne podtema dla WordPressa.

W ekosystemie WordPress tematy podstawowe (subthemes) stanowią bezpieczną podstawę do personalizacji i aktualizacji witryny. Pozwalają na korzystanie z wszystkich funkcji, stylów oraz plików szablonów tematu rodzicowskiego (parent theme) oraz na wprowadzanie zmian w osobnym katalogu. Dzięki temu, gdy temat rodzicowski otrzymuje aktualizacje bezpieczeństwa lub nowe funkcje, można je zainstalować w kilku krokach, bez obawy o to, że napisany przez użytkownika kod zostanie nadpisany. Bez względu na to, czy chodzi o dostosowanie kolorów, zmianę layoutu czy dodanie złożonych funkcji, używanie tematów podstawowych jest najlepszą praktyką.

Czemu konieczne jest używanie podtematów?

Bezpośrednia modyfikacja pliku tematycznego rodzicowego stanowi operację o wysokim ryzyku. Po aktualizacji tematu rodzicowego wszystkie Twoje zmiany zostaną utracone i konieczne będzie ich ponowne ręczne wdrożenie, co jest procesem łatwo skazującym na błędy, czasochłonnym i wymagającym dużych zусиль. Co więcej, brak jasnych записów o dokonanych zmianach może powodować poważne problemy podczas współpracy w zespole lub przeprowadzania migracji witryny w przyszłości.

Problem ten jest rozwiązany za pomocą mechanizmu “przewycięczania” („overriding”). Gdy WordPress renderuje stronę, najpierw sprawdza w katalogu tematu podstawowego („parent theme”) czy znajduje się tam odpowiednia plika szablonu. Jeśli tak, używa wersji tego szablonu z tematu podstawowego; w przeciwnym przypadku automatycznie przechodzi do wersji szablonu z tematu podstawowego. Dzięki temu możesz modyfikować tylko te części strony, które są dla ciebie konieczne, a resztę nadal korzystasz z aktualizacji i obsługi dostępnych w temacie podstawowym.

Polecamy lekturę. Przewodnik po rozwoju tematów dla WordPress: jak stworzyć swoją pierwszą tematę od zera。

Ponadto stosowanie podtematów jest zalecaną praktyką przez WordPress, która pomaga utrzymać kód w porządku i ułatwia jego konserwację – to także znak profesjonalnego rozwoju aplikacji.

UltaHost – hostingu dla stron WordPress

Gwarancja zwrotu pieniędzy w ciągu 30 dni, nieograniczony przepustowość sieci i dostęp do bazy danych, bezpłatna ochrona przed atakami typu DDoS. Promocja: 50% przy zakupie na 3 lata.

strona dostępu

Podstawowa struktura tematu podstawowego (subtopic)

Stworzenie podtematu jest bardzo proste – wystarczą dwa podstawowe pliki: arkusz stylu (stylesheet) i plik z funkcjami (function file). Najpierw musisz… /wp-content/themes/ W katalogu tworzy się nowy folder, zwykle o nazwie “nazwa_głównego_tematu-dziecko”, na przykład: twentytwentyfour-child。

Utworzenie pliku z kluczowymi zasadami stylu

Podstawą tematu pobocznego jest plik z arkuszem stylów (style sheet). style.cssTen plik zawiera nie tylko zasady stylu CSS, ale co więcej, w jego nagłówku znajdują się komentarze, które informują WordPress o tym, że jest to podtema, a także o tym, jaki jest jej temat rodzicielski.

/*
 Theme Name:   Twenty Twenty-Four Child
 Theme URI:    https://example.com/twentytwentyfour-child/
 Description:  Twenty Twenty-Four Child Theme
 Author:       Your Name
 Author URI:   https://example.com
 Template:     twentytwentyfour
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  https://www.gnu.org/licenses/gpl-2.0.html
 Text Domain:  twentytwentyfour-child
*/

Wśród nichTemplate: Ta linia jest kluczowa – jej wartość musi dokładnie odpowiadać nazwie katalogu rodzinnego tematu (z uwzględnieniem różnicy pomiędzy małymi i wielkimi literami). To właśnie umożliwia WordPress-owi rozpoznanie relacji pomiędzy tematami rodzinnymi i dziećmi.

Włączenie pliku z definicjami stylu tematycznego rodzicowskiego

Jeśli masz tylko powyżej wymienione pliki, to temat podstawowy (subtopic) nie będzie mogł załadować stylów tematu rodzinnego (parent topic). Musisz dodatkowo zainstalować odpowiednie pliki w folderze z funkcjami tematu podstawowego. functions.php Użyj tego w Chinach. wp_enqueue_scripts „Hak” służy do sortowania i kolejnego ładowania plików z definicjami stylu (style sheets) tematów rodzicielskich (parent themes).

Polecamy lekturę. Niezbędne elementy do stworzenia profesjonalnego witryny internetowej: pełny przewodnik po rozwoju i personalizacji tematów WordPress。

<?php
add_action( 'wp_enqueue_scripts', 'my_child_theme_enqueue_styles' );
function my_child_theme_enqueue_styles() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
    wp_enqueue_style( 'child-style',
        get_stylesheet_directory_uri() . '/style.css',
        array( 'parent-style' ),
        wp_get_theme()->get('Version')
    );
}
?>

get_template_directory_uri() Funkcja pobiera URL katalogu rodzinnego tematu. get_stylesheet_directory_uri() Udostępnienie URL katalogu aktualnej tematy (podtematy) aktywnej, za pomocą arrayu zależności. array( 'parent-style' ) Aby upewnić się, że styl podtematów jest ładowany po stylu tematu rodzinnego, co umożliwi prawidłowe przekrycie stylów tematu rodzinnego za pomocą Twoich własnych zasad CSS, należy to ustawić w kodzie źródłowym.

Rozszerzenie funkcji podtematów

Po stworzeniu podstawowej struktury możesz dalej pracować nad jej rozwojem. functions.php Dzięki temu pliku funkcje witryny są rozszerzalne w nieskończonym stopniu. Kód zawarty w tym pliku zostanie wykonywany przed kodem znajdującym się w głównym temacie (parent theme). functions.php Wykonanie pliku daje ci doskonałą możliwość dostępu do modifikacji kluczowych funkcji systemu.

Dostosowane funkcje witryny internetowej

Na przykład chcesz dodać do witryny nowy typ artykułu dostosowanego do potrzeb użytkowników – nazwany “Projekt”. Możesz to zrobić w ramach konfiguracji tematów (subtematów) na stronie witryny. functions.php Zarejestruj to w pliku.

hosting.com Hosting współdzielony

Wysoka wydajność dzięki procesorom AMD EPYC, pamięci masowej NVMe SSD i LiteSpeed, wewnętrzne wsparcie ekspertów 24/7, zaawansowane środki bezpieczeństwa, w tym SSL, brute force, ochrona przed złośliwym oprogramowaniem i DDoS, oszczędność do 73%

strona dostępu

add_action( 'init', 'register_project_post_type' );
function register_project_post_type() {
    $args = array(
        'public'      => true,
        'label'       => '项目',
        'has_archive' => true,
        'supports'    => array( 'title', 'editor', 'thumbnail', 'excerpt' ),
        'menu_icon'   => 'dashicons-portfolio',
    );
    register_post_type( 'project', $args );
}

W tym samym czasie możesz też usunąć niektóre niepotrzebne funkcje rodzinnego tematu. Na przykład, jeśli rodzinný temat dodaje niechciany element interfejsu (np. nagłówek strony) za pomocą określonej funkcji, możesz to wykorzystać, aby ten element został usunięty. remove_action() Aby to odwołać, założmy, że temat rodzicielski (parent topic) znajduje się w… init Na haciku. parent_theme_footer_widgets Do funkcji dodano dodatkowe elementy („mikroaparaty”/„narzędzia”), które można usunąć w następujący sposób:

add_action( 'after_setup_theme', 'remove_parent_theme_features', 15 );
function remove_parent_theme_features() {
    remove_action( 'init', 'parent_theme_footer_widgets' );
}

Uwaga: Tutaj używa się… after_setup_theme „Hak” (hook) oraz ustawienie nieco wyższej prioritetu (na przykład 15) służą do upewnienia się, że kod związany z rodzinnym tematem (parent theme) został już wykonyany. add_actionW ten sposób nasze… remove_action Aby to mogło zadziałać, należy spełnić określone warunki.

Zastąpić plik szablonu tematycznego rodziców

Jedną z najpotężniejszych funkcji podtematów jest możliwość przepisania plików szablonów rodzinnego tematu. Jeśli chcesz zmienić sposób wyświetlania danej strony artykułu, wystarczy skorzystać z tej funkcji i edytować pliki szablonów w podtemacie. single.php Zkopij to do katalogu z subtematami i następnie edytuj. WordPress automatycznie użyje twojej wersji.

Polecamy lekturę. Odkryj potencjał: sprawdź kluczowe technologie i najlepsze praktyki przy tworzeniu zaawansowanych tematów dla WordPress.。

Aby uzyskać większą kontrolę nad detalami, możesz nawet zmienić elementy szablonu (Template Parts) lub określone części szablonu. Na przykład, jeśli chcesz zmienić sposób wyświetlania metadanych artykułu, możesz skopiować i edytować odpowiednie elementy z rodzinnego tematu (parent theme). template-parts/content-post-meta.php Plik znajduje się w tym samym miejscu na drzewie katalogów co i podtema.

Wysokiej jakości techniki rozwoju podtematów

Gdy rozwój podtematów przekroczy poziom początkowy, będziesz mieć do czynienia z bardziej zaawansowanymi kwestiami, takimi jak lokalizacja, dziedziczenie opcji tematów oraz aktualizowanie samych podtematów.

Hosting współdzielony InterServer

Hosting współdzielony $2.50 USD miesięcznie, pierwszy miesiąc $0.1 USD kod promocyjny tryinterserver, 461 skryptów aplikacji w chmurze, instalacja jednym kliknięciem.

strona dostępu

Wymaga się implementacji mechanizmów lokalizacji tekstu, aby można było przekładać teksty z jednego języka na inny.

Aby twoje podtematy obsługiwały kilka języków, konieczne jest poprawne ustawienie pola tekstowego (Text Domain) oraz używanie funkcji tłumaczeniowych. style.css „Góra” i „Czoło” functions.php Krokiem pierwszym jest włączenie pola tekstowego.

在 functions.php W load_child_theme_textdomain Funkcja:

add_action( 'after_setup_theme', 'child_theme_localization_setup' );
function child_theme_localization_setup() {
    load_child_theme_textdomain( 'twentytwentyfour-child', get_stylesheet_directory() . '/languages' );
}

Później, w miejscach, gdzie konieczna jest tłumaczenie tekstu, należy użyć zapisów w formie: „…”. esc_html__( 'Your Text', 'twentytwentyfour-child' ) Taki pakiet funkcji. Następnie możesz użyć narzędzi takich jak Poedit do jego generowania. .po 和 .mo Przetłumacz plik i umieść go w podtemacie. /languages/ W katalogu.

Bezpieczna modyfikacja kluczowych funkcji

Czasami konieczne jest zmienienie złożonej funkcji w rodzinnym temacie, ale ta funkcja nie oferuje wystarczającej elastyczności dzięki hookom. Jeśli funkcja jest “zgodna z zasadami pluggability” (tj. można ją łatwo dostosować), to można to zrobić. if ( ! function_exists( ... ) ) „Pakowanie” – w takim przypadku możesz użyć tego terminu w kontekście podtematów (subtematów). functions.php Można bezpośrednio ponownie deklarować tę funkcję w kodzie, w taki sposób, aby całkowicie jej zakryć (tj. aby jej wcześniejsze definicje zostały ignorowane).

Przed próbą wykonywania tej operacji koniecznie sprawdź, w jaki sposób są definiowane funkcje w rodzinnym temacie. Jeśli nie są modułowe (tj. nie można ich łatwo zastąpić innymi elementami), próba ich ponownego deklarowania może doprowadzić do poważnych błędów. W takiej sytuacji bezpieczniejszym rozwiązaniem będzie skontaktowanie się z deweloperem tematu lub poszukiwanie innych sposobów realizacji Twoich wymagań (na przykład innych „hooków” do filtrowania danych).

Podsumowanie.

Tworzenie subtematów dla WordPress jest kluczową umiejętnością, którą muszą opanować profesjonali. Dzięki temu tworzy się bezpieczny i wydajny proces personalizacji, przy którym twój własny kod jest wyraźnie oddzielony od kodu bazowego tematu. Počynając od stworzenia pliku zawierającego właściwe informacje nagłówkowe (header)… style.css „Wraz z ładowaniem stylu…” functions.php Od początku, poprzez modyfikację plików szablonów, rozszerzanie funkcjonalności, aż po lokalizację i zaawansowane dostosowania, każdy krok jest realizowany zgodnie z zasadami najlepszych praktyk stosowanych w WordPress. Należy zawsze korzystać z podtematów (subthemes), aby twoja strona internetowa mogła śledzić aktualizacje WordPress i jednocześnie zachować swoj unikalny wygląd oraz funkcje przez wiele lat.

FAQ – najczęściej zadawane pytania.

Jakie są wymagania dotyczące nazw folderów z podtematami?

Nie istnieją żadne surowe ograniczenia dotyczące nazw folderów związanych z podtematami, ale dla lepszej wyrazności zaleca się używać formatu “nazwa rodzinnego tematu–podtema”, na przykład: astra-childKluczowe jest to, że… style.css W nagłówku pliku Template: Pola, których wartości muszą dokładnie odpowiadać nazwom folderów w rodzinnym temacie (włącznie z wielkimi i małymi literami), są konieczne, aby WordPress mógł poprawnie utworzyć relację pomiędzy tematami rodzinnymi a ich podtematami. Inaczej relacja ta nie zostanie utworzona poprawnie.

Czy wszystkie tematy rodzicowe (parent topics) pozwalają na tworzenie tematów dziecięcych (subtopics)?

Większość współczesnych tematów, które są zgodne z standardami kodowania WordPress, pełnie obsługuje subtematy. Teoretycznie każdy temat może być używany jako temat rodzicielski. Jednak niektóre tematy złych projektów lub bardzo starożytne mogą mieć problemy z działaniem subtematów ze względu na używanie absolutnych pathów do referencowania zasobów lub brak niezbędnych plików szablonów. Podczas wyboru tematu rodzicielskiego warto sprawdzić jego dokumentację lub opinie użytkowników.

Jak przenieść bezpośrednio zmieniony temat rodzicielski do tematu dziecięcego?

Najpierw, w swoim lokalnym lub testowym środowisku, stworz nowy podtemat na bazie nienaruszonej, oryginalnej tematy matrycznej. Następnie porównaj dokładnie pliki tematy matrycznej, które wcześniej zmieniłeś, z oryginalnymi plikami. Przeprowadź zorganizowaną migrację tych zmian (może to być kod CSS, PHP lub HTML) do odpowiednich plików w podtemacie: elementy związane z CSS umieść w plikach podtematu. style.cssKod funkcjonalny umieszczono… functions.phpZmienione pliki szablonów kopiuje się do katalogu podtematycznego, po czym wprowadzają się wymagane zmiany. To dokładny i czasochłonny proces, ale po jego zakończeniu problemy związane z tą tematyką nie powinny się więcej powtarzać.

Czy podtematy mogą wpłynąć na szybkość działania witryny internetowej?

Poprawnie przygotowane subtematy wpływają znikomo na szybkość działania witryny. Dodatkowe pliki CSS i JS są zwykle małe, a dzięki prawidłowemu ustawieniu kolejności ich ładowania można je efektywnie łączyć i kierować do cache. Głównym kosztem związanym z subtematami może być… functions.php W kodzie dodano złożoną logikę PHP. Dlatego zachowanie kodu w podtematach powinno być takie samo jak przy rozwoju w temacie głównym – musi być zwięzłe i efektywne. Rozumne używanie technologii cache może dodatkowo zmniejszyć potencjalne wpływy na wydajność.