Aby stworzyć pełnowartościowy temat dla WordPress, potrzebny jest zestaw podstawowych plików. Te pliki stanowią „składankę” tematu, a każdy z nich ma swoje specjalne zadanie.
Najbardziej podstawowe pliki to:
* `style.css`：主题的样式表，同时也是主题的“身份证”，包含主题名称、作者、描述等元信息。
* `index.php`：主题的主模板文件，是默认的首页和文章列表页模板。
* `header.php`：网站的头部模板，通常包含`<head>`部分和网站顶部的导航区域。
* `footer.php`：网站的底部模板，通常包含版权信息、脚本等。
* `functions.php`：主题的功能文件，用于添加自定义功能、注册菜单、侧边栏等。
Zacznijmy od tworzenia pliku `style.css`. Na początku pliku należy dodać komentarz z informacjami o temacie tego pliku.
/*
Theme Name: 我的第一个主题
Theme URI: https://example.com/my-first-theme
Author: 你的名字
Author URI: https://example.com
Description: 这是一个为学习WordPress主题开发而创建的简单自定义主题。
Version: 1.0
License: GPL v2 or later
Text Domain: my-first-theme
*/Następnie utwórz plik `index.php`. W najprostszym wersji tego pliku należy włączyć elementy nagłówka (`header`) i nagłówka dołu (`footer`) oraz wyświetlić artykuły w formie cyklicznego przekraczania ich listy.
<p><strong>Witaj na mojej stronie!</strong></p>
<main id="main-content">
<?php if ( have_posts() ) : ?>
<?php while ( have_posts() ) : the_post(); ?>
<article id="post-<?php the_ID(); ?>">
<h2><a href="/pl/</?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
<div class="entry-content">
<p><strong>Treść artykułu</strong>: <p><strong>Dzięki za komentarz!</strong></p>
</div>
</article>
<p>Nie ma żadnych artykułów.</p>
<?php endif; ?>
</main>
<?php get_footer(); ?>Pliki `header.php` i `footer.php` zawierają odpowiednio ogólne elementy struktury HTML dla nagłówka i dołu strony internetowej. Plik `functions.php` służy do rozszerzenia funkcjonalności tematu (tema graficznego, który jest używany na stronie).
Rozumienie poziomów struktury szablonów oraz zasad działania cykli
WordPress wykorzystuje inteligentny system poziomów szablonów, aby decydować, jak wyświetlić różne elementy strony. Na przykład, przy wejściu na pojedynczy artykul WordPress najpierw sprawdza czy istnieje plik `single.php`; jeśli nie, sprawdza plik `category.php` (w przypadku strony kategorii). Jeśli żaden z tych plików nie jest dostępny, system użyje pliku `archive.php`, a jeśli i to nie pomaga, użyje pliku `index.php`.
Co to jest główny cykl?
`the loop`是WordPress主题开发的核心概念。它是一段PHP代码，用于从数据库中获取文章内容并将其显示在网页上。你在`index.php`中看到的`while ( have_posts() ) : the_post();`就是循环的开始。在循环内部，你可以使用一系列模板标签来输出文章信息，如`the_title()`, `the_content()`, `the_permalink()`等。
Polecamy lekturę. Pełny przewodnik po rozwoju tematów dla WordPressa: od poznania podstaw do osiągnięcia mistrzostwa。
Utworzenie innych plików z szablonami
Aby temat był bardziej profesjonalny, powinnyś stworzyć kilka standardowych plików szablonów. Na przykład, stworzyć plik `single.php` do wyświetlania pojedynczych artykułów.
<p><strong>Witaj na mojej stronie!</strong></p>
<main>
<?php while ( have_posts() ) : the_post(); ?>
<article>
<h1><?php the_title(); ?></h1>
<div class="post-meta">
发布于： | 作者：
</div>
<div class="post-content">
<p><strong>Treść artykułu</strong>: <p><strong>Dzięki za komentarz!</strong></p>
</div>
</article>
</main>
<?php get_footer(); ?>Podobnie możesz stworzyć plik `page.php` do definiowania szablonu strony, a plik `archive.php` do definiowania szablonu strony archiwu zawierającej kategorie, tagi itd.
Integracja menu z boczną ramką
Temat moderny zwykle zawiera menu nawigacyjne oraz obszar z dodatkowymi elementami („sidebar widgets”) dostępne do personalizacji. Te funkcje muszą zostać zarejestrowane i aktywowane w pliku `functions.php`.
Rejestracja menu nawigacyjnego
Dodanie następującego kodu do pliku `functions.php` umożliwi zarejestrowanie pozycji menu dla danej temy, na przykład “Główne menu”.
function my_first_theme_setup() {
// 注册一个导航菜单位置
register_nav_menus( array(
'primary' => __( '主菜单', 'my-first-theme' ),
) );
}
add_action( 'after_setup_theme', 'my_first_theme_setup' );Po rejestracji użytkownik może przypisać menu do określonego miejsca w panelu administracyjnym WordPressa, w zakładce “Wygląd” → “Menü”. Następnie w pliku `header.php`, w miejscu, gdzie chcesz wyświetlić menu, dodaj następujący kod, aby móc go wykorzystać:
<nav id="site-navigation">
<?php
wp_nav_menu( array(
'theme_location' => 'primary',
'menu_id' => 'primary-menu',
) );
?>
</nav>Dodać boczną panelę z dodatkowymi narzędziami
Narzędzia (“widgets”) to bardzo elastyczna funkcja w WordPress. Aby dodać boczny panel, również konieczne jest zarejestrowanie „obszaru dla narzędzi” w pliku `functions.php`.
function my_first_theme_widgets_init() {
register_sidebar( array(
'name' => __( '主侧边栏', 'my-first-theme' ),
'id' => 'sidebar-1',
'description' => __( '在此添加小工具。', 'my-first-theme' ),
'before_widget' => '<section id="%1$s" class="widget %2$s">',
'after_widget' => '</section>',
'before_title' => '<h2 class="widget-title">',
'after_title' => '</h2>',
) );
}
add_action( 'widgets_init', 'my_first_theme_widgets_init' );Następnie, w pliku szablonu, w którym chcesz wyświetlić boczną nawigację (np. `sidebar.php`), użyj funkcji `dynamic_sidebar()` aby ją wygenerować.
<aside id="secondary" class="widget-area">
<?php dynamic_sidebar( 'sidebar-1' ); ?>
</aside>Na koniec nie zapomnij włączyć ten plik bocznego menu za pomocą funkcji `get_sidebar()` w pliku `index.php` lub `single.php`.
Polecamy lekturę. Przewodnik po tworzeniu tematów dla WordPress: jak stworzyć własną tematę od zera。
Dodanie stylów i skriptów
为了保持代码的整洁和可维护性，不应该直接在HTML中硬编码样式和脚本链接。正确的方式是通过`functions.php`文件，使用`wp_enqueue_style()`和`wp_enqueue_script()`函数将它们加入队列。
Włączenie pliku z zasadami stylu
Choć plik `style.css` jest konieczny, WordPress nie będzie go automatycznie ładać. Musisz go wyraźnie dodać do listy plików do załadowania. Zwykle rozdzielamy główny plik zdefiniujący styl oraz plik służący do przywrócenia standardowego wyglądu strony („reset style sheet”).
function my_first_theme_scripts() {
// 引入主题的主样式表
wp_enqueue_style( 'my-first-theme-style', get_stylesheet_uri() );
// 引入一个自定义样式表 (假设位于 /assets/css/main.css)
wp_enqueue_style( 'my-first-theme-main', get_template_directory_uri() . '/assets/css/main.css' );
// 引入一个自定义JavaScript文件 (假设位于 /assets/js/navigation.js)
wp_enqueue_script( 'my-first-theme-navigation', get_template_directory_uri() . '/assets/js/navigation.js', array(), false, true );
}
add_action( 'wp_enqueue_scripts', 'my_first_theme_scripts' );Wykorzystywanie współczesnych standardów i praktyk rozwoju w CSS
W rozwoju front-endu w 2026 roku kluczową rolę odgrywa responsywny design oraz dostępność witryny. W pliku `style.css` lub osobnym pliku `main.css` należy używać zapytań mediów (media queries), aby zapewnić dobrą wyświetlność witryny na różnych urządzeniach.
/* 基础样式 */
body {
font-family: sans-serif;
line-height: 1.6;
}
/* 响应式导航菜单 */
@media screen and (max-width: 768px) {
#primary-menu {
display: none;
}
/* 移动端菜单样式 */
}Testowanie i debugowanie
Po zakończeniu rozwoju tematu testy są niezbędnym elementem procesu. Konieczne jest przeprowadzenie szczegółowych testów w różnych środowiskach, na różnych przeglądarkach i na różnych urządzeniach.
Włączyć tryb debugowania
Podczas procesu rozwoju koniecznie włącz tryb debugowania w WordPress. To pomoże ci szybko wykrywać błędy, ostrzeżenia i informacje o problemach w kodzie PHP. Otworź plik `wp-config.php` i dodaj następujący kod:
Polecamy lekturę. Przewodnik po rozwijaniu tematów WordPress w 2026 roku: budowanie responsywnych stron internetowych dla firm od zera。
define( 'WP_DEBUG', true );
define( 'WP_DEBUG_LOG', true ); // 将错误记录到 /wp-content/debug.log 文件
define( 'WP_DEBUG_DISPLAY', false ); // 不在页面上显示错误，更安全Tematyczne jednostkowe testy (Subject Unit Tests)
Zaleca się używać oficjalnych danych do testowania tematów WordPress, aby dokładnie sprawdzić, jak twoja tema będzie się zachowywać w różnych sytuacjach. Te dane zawierają różne typy artykułów, stron, mediów, komentarzy itd., co umożliwia sprawdzenie, czy twoja tema będzie poprawnie wyświetlać się we wszystkich przypadkach, bez żadnych problemów z wyglądem lub układem.
Podsumowanie.
Od stworzenia podstawowych plików `style.css` i `index.php` po zrozumienie struktury tematów WordPress oraz zasady pracy z cyklami, a potem do rejestracji menu, bokówki oraz bezpiecznego włączenia skryptów stylizacyjnych – przeszedłeś cały proces tworzenia podstawowej, ale kompletnie funkcjonalnej tematy WordPress. Pamiętaj, że rozwój tematów to iteratywny proces: najlepszą praktyką jest zacząć od najprostszego wersji i stopniowo dodawać nowe funkcje oraz dopracowywać detale. Dzięki ciągłemu uczeniu się tagów tematycznych, aktywnych hooków (actions) i filtrów (filters) będziesz mogąc tworzyć jeszcze bardziej wydajne i elastyczne tematy.
FAQ – najczęściej zadawane pytania.
Jakie są podstawowe wymagania, by rozwijać tematy dla WordPress?
Konieczne jest opanowanie podstaw HTML, CSS i PHP. Wiedza o JavaScriptu również będzie przydatna, szczególnie przy dodawaniu interaktywnych elementów. Ponadto istotne jest znać podstawowe zasady pracy z WordPressem, takie jak artykuły, strony, kategorie, tagi, dodatki (plug-iny) i menu.
Dlaczego zmiany w moim temacie nie są widoczne w witrynie po aktualizacji w tle (w środowisku administracyjnym)?
Zwykle to wynika z ustawie cache w przeglądarcu lub w WordPress. Spróbuj najpierw zrobić forced refresh przeglądacza (Ctrl + F5 lub Cmd + Shift + R). Jeśli problem nadal występuje, sprawdź, czy poprawnie włączyłeś style i skrypty do kolejki wykonywania (queue), oraz upewnij się, że w pliku `functions.php` nie znajdują się żadne błędy gramatyczne. W bardzo rzadkich przypadkach może być konieczne usunąć cache z serwera lub pluginów.
Jak sprawić, by mój temat obsługiwał wiele języków?
你需要做好主题的“国际化”准备。这意味着在代码中所有需要翻译的文本，都应使用翻译函数（如`__()`， `_e()`）进行包装，并为`text-domain`设置一个唯一标识（在`style.css`的头部已定义）。然后，你可以使用如Poedit这样的工具创建`.po`和`.mo`翻译文件，使你的主题能够被轻松翻译成其他语言。
W jaki sposób różnią się dostosowane tematy (custom themes) od podtematów (subtopics)?
Tematy dostosowane są tematami zupełnie nowymi, rozwijanymi od zera. Natomiast tematy podstawowe (subtematy) bazują na istniejącym “temacie rodzinnym” i dziedziczą od niego wszystkie funkcje, style oraz pliki szablonów. Dzięki temu można modyfikować lub dodawać tylko te elementy, które są konieczne (zwykle style oraz kilka plików szablonów), bez konieczności zmian w temacie rodzinnym. To bezpieczniejszy i bardziej efektywny sposób dostosowania lub aktualizacji popularnych tematów, ponieważ zapewnia, że Twoje zmiany nie zostaną przywróczone.
Następny krok, co dalej?
Dalsze lektury i praktyczna wiedza.
Poniższe treści są powiązane z tematem tego artykułu i warto je przeczytać. Zwykle lepiej zacząć od artykułu, który najbardziej odpowiada aktualnemu problemowi, a potem stopniowo przechodzić do tematów pokrewnych.
- Przewodnik po tworzeniu tematów dla WordPressa: budowanie własnych stron internetowych od zera
- Pełny przewodnik po rozwoju tematów dla WordPressa: praktyczny kurs od zera do mistrzostwa
- Pełny przewodnik po tworzeniu tematów dla WordPress: budowanie profesjonalnych szablonów stron internetowych od zera
- Praktyczne tworzenie tematów dla WordPress: budowanie responsywnych witryn internetowych dla firm od zera
- Tworzenie tematów WordPress bez użycia kodu: pełny przewodnik od zera do mistrzostwa
Polski