Hlavní stránka/Znalosti/WordPress/Podrobnosti o obsahu

Postupné osvojení vývoje témat WordPress: kompletní průvodce od začátku až po praktické využití.

Čtení za 3 minuty.
2026-03-18
2026-06-03
2,195
Získávám provize, když nakupujete prostřednictvím níže uvedených odkazů, aniž by vás to něco stálo navíc.

Základy vývoje témat WordPress a nastavení prostředí

Než začnete psát jakýkoli kód, je zásadní vytvořit stabilní vývojové prostředí. Profesionální vývojové prostředí nejen zvyšuje efektivitu, ale také vám pomáhá dodržovat osvědčené postupy. Pro vývoj temát pro WordPress doporučujeme výrazně používat lokální vývojové nástroje, jako jsou Local by Flywheel, XAMPP nebo MAMP. Tyto nástroje umožňují na vašem osobním počítači simulovat kompletní serverové prostředí, včetně PHP, MySQL a Apache/Nginx.

Následně budete muset nainstalovat zcela nový WordPress ve svém lokálním prostředí. Tím zajistíte, že vaše vývojové práce neovlivní webové stránky online a že budete moci volně provádět testování a ladění. Po dokončení instalace byste měli přejít k základní části vývoje tématu: pochopení struktury adresářů tohoto tématu. Standardní WordPress téma musí obsahovat alespoň dvě soubory:style.css和index.phpMezi nimi jestyle.cssSoubor není pouze šablonou stylů – jeho důležitější funkcí je poskytovat metadaty pro váš téma.

Potřebujete…style.cssV bloku hlavičkových poznámek souboru jsou definovány název tématu, autor, popis, verze a licenční podmínky. Toto je jediný způsob, jakým WordPress rozpozná vaše téma. Níže je uveden příklad základních informací v hlavičce šablony:

Doporučujeme k přečtení. Chcete se naučit vývoj témat pro WordPress? Kompletní praktický průvodce od nuly až po odbornost.。

/*
Theme Name: My Custom Theme
Theme URI: https://example.com/my-theme
Author: Your Name
Author URI: https://example.com
Description: A custom WordPress theme built from scratch.
Version: 1.0.0
License: GPL v2 or later
Text Domain: my-custom-theme
*/

Kromě dvou výše uvedených nutných souborů obsahuje plně funkční téma obvykle i další šablonové soubory, jako např.:header.php、footer.php、sidebar.phppřílišfunctions.phpMůžete v adresáři wp-content/themes vytvořit novou složku (např. “my-custom-theme”), do které uložíte tyto soubory. Nakonec nezapomeňte aktivovat právě vytvořené prázdné téma v administraci WordPressu v sekci “Vzhled” -> “Témata” – to je výchozí bod pro veškerou další vývojovou práci.

UltaHost – hosting služby pro weby postavené na platformě WordPress
Záruka vrácení peněz do 30 dnů, neomezený šířka pásma a databáze, bezplatná ochrana proti DDoS útokům. Sleva 501 TP4T při nákupu na 3 roky.
LOGO UltaHostu přístupová stránka

Core template files and the theme hierarchy structure

Síla systému temát WordPress je do značné míry způsobena jeho přehlednou hierarchií šablon. Tato hierarchie určuje, který soubor PHP šablony WordPress automaticky použije k zobrazení obsahu na různých typech stránek na webu. Porozumění této hierarchii je klíčové pro vytváření flexibilních a funkčně bohatých temát.

Nejzákladnějším souborem šablony jeindex.phpJedná se o konečný záložní soubor pro všechny stránky. Pokud WordPress nenajde konkrétnější šablonu, použije tento záložní soubor. Aby však webová stránka měla různé vzhledy (různé uspořádání obsahu), vytváříme konkrétnější šablony. Například při návštěvě seznamu blogových článků (hlavní stránky) bude WordPress preferovat použití konkrétní šablony určené právě pro tuto stránku.front-page.php或home.phpPři přístupu k jednotlivému blogovému článku hledá…single.phpPři přístupu ke statickým stránkám hledá…page.php。

Abychom obsah stránek modularizovali, používáme…get_header()、get_footer()和get_sidebar()Používejte šablonové značky k zavádění společných částí kódu. To znamená, že…header.phpSoubor by měl obsahovat veškerý HTML kód na začátku webové stránky až do začátku hlavní části obsahu, což obvykle zahrnuje…<head>Části webové stránky, identifikátor webové stránky a hlavní navigační menu.footer.phpTakto jsou zahrnuty všechny části po skončení hlavního obsahu, jako jsou informace o autorských právech, zavádění skriptů atd.

Typický…index.phpStruktura souborů je následující:

Doporučujeme k přečtení. Ultimátní průvodce vývojem WordPress temat: Od principů až po praktické aplikace。

<?php get_header(); ?>

<main id="primary" class="site-main">
    <?php
    if ( have_posts() ) :
        while ( have_posts() ) :
            the_post();
            // 显示每篇文章的内容
        endwhile;
    else :
        // 没有找到文章时的内容
    endif;
    ?>
</main>

<?php get_sidebar(); ?>
<?php get_footer(); ?>

Vytvoření vlastního šablónu stránky

Někdy možná budete potřebovat navrhnout úplně odlišný layout pro konkrétní stránku. V takovém případě můžete vytvořit vlastní šablonu stránky. Stačí přidat specifický blok komentářů na začátek jakékoli PHP šablonové souboru, abyste ji deklarovali jako šablonu stránky. Například, vytvořte šablonu s názvem “Celoplošná stránka”:

<?php
/**
 * Template Name: 全宽页面
 * Description: 一个没有侧边栏的全宽页面模板。
 */
get_header(); ?>

Uložte tento soubor jako…template-fullwidth.phpPoté, při editování stránky v záložce WordPress, můžete v rozbalovacím menu “Šablony” pod položkou “Vlastnosti stránky” vybrat možnost “Celoplošná stránka”.

Tématické funkce a WordPressové cykly

functions.phpTento soubor představuje “motorovou komoru” vašeho tématu – slouží k přidávání funkcí daného tématu, registraci menu, nastavení oblasti nástrojů, aktivaci speciálních obrázků, a také k načítání šablon a skriptovacích souborů postupně. Tento soubor se automaticky načte při inicializaci tématu. Díky různým možnostem poskytovaným WordPressem můžete takové funkce v tématu libovolně upravit nebo rozšířit.add_theme_support()Funkce a „hooky“ (speciální mechanismy pro připojení dalších modulů) vám umožní výrazně rozšířit možnosti daného tématu (tematického rámce).

Shared hosting na hosting.com
Vysoký výkon, vybavený procesorem AMD EPYC, úložištěm NVMe SSD a LiteSpeedem, nepřetržitá interní podpora odborníků 24 hodin denně a 7 dní v týdnu, pokročilá bezpečnostní opatření včetně SSL, ochrany proti útokům hrubou silou, malwaru a DDoS, úspora až 731 TB/měsíc.
LOGO hosting.com přístupová stránka

Jednou z klíčových funkcí je možnost registrace navigačního menu. To umožňuje správci webové stránky spravovat obsah menu prostřednictvím rozhraní “Vzhled” -> “Menu” v administraci. Potřebujete…functions.phpPoužijte to v čínštině.register_nav_menus()Funkce slouží k deklaraci umístění jídelního lístku.

function my_custom_theme_setup() {
    register_nav_menus(
        array(
            'primary' => __( '主导航菜单', 'my-custom-theme' ),
            'footer'  => __( '页脚菜单', 'my-custom-theme' ),
        )
    );
    // 启用文章和页面的特色图像功能
    add_theme_support( 'post-thumbnails' );
    // 为文章摘要添加支持
    add_theme_support( 'excerpt' );
}
add_action( 'after_setup_theme', 'my_custom_theme_setup' );

Porozumění a použití cyklů v WordPressu

Výstup veškerého dynamického obsahu je založen na “WordPressově cyklu”. Jedná se o strukturu kódu v PHP, která zjišťuje, zda na aktuální stránce existují články (nebo stránky), které je třeba zobrazit. Pokud ano, cyklus prochází jednotlivými články a vypisuje jejich obsah. Tento cyklus je ústřední součástí šablonovacích souborů. Níže je příklad…index.php或archive.phpPříklad standardního cyklu použitého v…:

<?php if ( have_posts() ) : ?>
    <div class="posts-list">
        <?php while ( have_posts() ) : the_post(); ?>
            <article id="post-<?php the_ID(); ?>" no numeric noise key 1009>
                <h2><a href="/cs/</?php the_permalink(); ?>"><p><strong> Řekněte mi něco o sobě.</strong></p></a></h2>
                <div class="entry-meta">
                    <?php the_time( 'Y年m月d日' ); ?>
                </div>
                <div class="entry-content">
                    <?php the_excerpt(); ?>
                </div>
            </article>
        <?php endwhile; ?>
    </div>
    
    <p><?php _e( '抱歉，没有找到符合条件的文章。', 'my-custom-theme' ); ?></p>
<?php endif; ?>

Uvnitř cyklu můžete používat řadu šablonovacích značek, jako např.the_title()、the_content()、the_excerpt()和the_permalink()Na stránce jednotlivého článku:single.phpV tomto kontextu obvykle používáte…the_content()Vygenerujte kompletní obsah článku.

Doporučujeme k přečtení. Úvodní průvodce vývojem WordPress temat: Kompletní tutoriál od začátečníka až po odborníka。

Personalizace stylů, skriptů a témat

Moderní WordPress téma musí správně zpracovávat načítání souborů CSS a JavaScript a zároveň zohledňovat potřeby uživatelů při personalizaci. Nejlepší praxí je…wp_enqueue_style()和wp_enqueue_script()Funkce slouží k řazení zdrojů, které jsou načítány do systému, což zajišťuje správné pořadí závislostí mezi jednotlivými komponentami a předchází jejich duplicitnímu načítání.

Potřebujete…functions.phpVytvořte funkci v… a použijte ji.wp_enqueue_scriptsKliky slouží k jeho připojení (montáži).

Shared hosting od InterServeru
Sdílený hosting za 1 TB + 5 TB měsíčně za 2,50 USD, slevový kód tryinterserver pro první měsíc za 1 TB + 5 TB za 0,1 USD, a 461 skriptů cloudových aplikací k jednoduché instalaci.
Logo InterServeru přístupová stránka 
function my_custom_theme_scripts() {
    // 引入主样式表
    wp_enqueue_style( 'my-custom-theme-style', get_stylesheet_uri(), array(), wp_get_theme()->get( 'Version' ) );
    // 引入自定义JavaScript文件
    wp_enqueue_script( 'my-custom-theme-navigation', get_template_directory_uri() . '/js/navigation.js', array(), wp_get_theme()->get( 'Version' ), true );
}
add_action( 'wp_enqueue_scripts', 'my_custom_theme_scripts' );

Implementace podpory vlastních přetvářovačů (customizers)

WordPress Theme Customizer je velmi výkonný nástroj, který umožňuje uživatelům v reálném čase předvídat a upravovat určité nastavení témat, jako je název webové stránky, barvy, obrázek pozadí atd. Integrací vašich tématových nastavení do tohoto nástroje můžete výrazně zlepšit uživatelský zážitek.

Implementace podpory vlastních nastavení (customizers) zahrnuje především použití určitých nástrojů a technik.WP_Customize_ManagerTřídy. Můžete…functions.phpVytvořte funkci v… (specifikujte, v jakém jazyce nebo prostředí), která prostřednictvím… (uveďte, jakého postupu nebo dat)…customize_registerKliky slouží k přidávání nastavení a ovladačů. Například k přidání možnosti pro nastavení barvy pozadí:

function my_custom_theme_customize_register( $wp_customize ) {
    // 添加一个设置项（存储在数据库中）
    $wp_customize->add_setting( 'background_color', array(
        'default'           => '#ffffff',
        'sanitize_callback' => 'sanitize_hex_color',
        'transport'         => 'postMessage', // 支持实时预览
    ) );
    // 添加一个颜色选择器控件（显示在定制器界面）
    $wp_customize->add_control( new WP_Customize_Color_Control( $wp_customize, 'background_color', array(
        'label'    => __( '背景颜色', 'my-custom-theme' ),
        'section'  => 'colors',
    ) ) );
}
add_action( 'customize_register', 'my_custom_theme_customize_register' );

Poté potřebujete…header.phpNebo v interním stylu (inline style).get_theme_mod()Funkce získá tuto hodnotu a vypíše ji ve formátu CSS.

<style type="text/css">
    body {
        background-color: <?php echo esc_attr( get_theme_mod( 'background_color', '#ffffff' ) ); ?>;
    }
</style>

Závěr

Vývoj tem pro WordPress je postupný proces, který začíná nastavením prostředí, pochopením struktury šablon, napsáním základních funkcí až po implementaci interakcí s uživateli. Zvládnutí všech těchto kroků je zásadní pro efektivní vývoj funkčních a esteticky příjemných webových stránek.style.css和index.phpZačátek souboru až po důkladné osvojení šablonovacích značek a WordPressových cyklů pro vytváření dynamického obsahu představují základ pro vytváření vlastních temat (custom themes).functions.phpFunkce registrace souborů, nabídka menu a příslušné nástroje, spolu s správným načítáním zdrojových souborů pomocí systému wp_enqueue, zajistí stabilitu a výkon tématu. Konečně, integrace možností nastavení tématu do nástroje WordPress Customizer poskytne správci webu intuitivní a přívětivé uživatelské rozhraní, což výrazně zvyšuje profesionalitu a použitelnost tématu. Dodržováním těchto základních principů a kroků budete schopni od nuly vytvořit WordPress téma s vysokou funkcionalitou, flexibilním designem a v souladu se současnými standardy.

Časté dotazy

Je nutné se učit PHP pro vývoj tem pro WordPress?

Ano, znalost PHP je nezbytná pro vývoj temát pro WordPress. Samotný jádro WordPressu je napsáno v PHP a všechny šablony (.php soubory) využívají PHP k dynamické generaci HTML obsahu, volání funkcí WordPressu a zpracování dat. I když můžete používat nástroje na vytváření stránek k navrhování rozvrhu, pro hlubokou kontrolu nad strukturou temát, jejich funkcemi a vlastní logikou je nutné dobře ovládat PHP.

Jak můj projekt podporovat více jazyků ( internacionalizaci)?

Aby vaše téma podporovalo více jazyků, je nutné ho připravit na internacionalizaci (i18n). Základním postupem je použití funkcí pro překlad, které poskytuje WordPress, k označení všech textových stránek v tématu, které se zobrazují uživatelům. Nejčastěji používanou funkcí je…()Slouží k zobrazení přeloženého textu.()Je použito k vrácení přeloženého řetězce. Potřebujete…functions.phpPoužijte to v čínštině.load_theme_textdomain()Funkce slouží k načtení souborů s překlady. Poté lze pomocí softwaru jako je Poedit vytvořit šablonový soubor typu .pot, a překladatelé vytvoří příslušné soubory typu .mo pro požadovaný jazyk (např. zh_CN). Zároveň je důležité zajistit, aby…style.cssVe všech voláních funkcí WordPress se používá stejný textový domén (Text Domain), který obvykle odpovídá názvu adresáře vašeho tématu.

Jak zajistit, aby můj tematický design splňoval oficiální požadavky WordPressu, a poté jej odeslat do repozitáře tematických nástrojů (WordPress Theme Directory)?

Aby váš motiv splnil požadavky a mohl být odeslán do oficiálního katalogu motivů WordPressu, musí striktně dodržovat standardy pro kontrolu motivů. To zahrnuje: kód musí být v souladu s kódovými standardy WordPressu a nejlepšími praktikami PHP; zajistit bezpečnost motivu a správně escapovat a sanovat všechna dynamická data; zajistit funkčnost, aniž by bylo nutné spoléhat na konkrétní pluginy třetích stran; front-end kód by měl být responzivní a přístupný; a musí být licencován pod open source licencí GPLv2 nebo novější. Během vývoje můžete využít plugin Theme Check k předběžné kontrole. Před odesláním si pečlivě přečtěte oficiální příručku pro vývoj motivů a kontrolní seznam a poté postupujte prostřednictvím stránky pro odesílání na webu WordPressu.

Jaký je rozdíl mezi podtématek a hlavním tématem a kdy by se měly používat podtémata?

Rodičovská témata jsou plně funkční a samostatná témata WordPressu. Dceřiná témata závisí na konkrétním rodičovském tématu, dědí všechny funkce, styly a šablony rodičovského tématu a umožňují přepsat nebo přidat nové funkce, aniž by bylo nutné upravovat soubory samotného rodičovského tématu. Při přizpůsobování stávajícího tématu (zejména populárního nebo rámcového) by měla být použita dceřiná témata. Výhodou je, že při aktualizaci rodičovského tématu nedojde ke ztrátě vašeho vlastního kódu (obsaženého v dceřiném tématu) a aktualizace bude probíhat bezpečně. K vytvoření dceřiného tématu stačí pouze soubor obsahující nezbytné informace o hlavičce.style.cssSoubor, a poté prostřednictvím…@importNebo pomocí čekací fronty načtěte styly mateřského tématu.

Jaký je další krok? Co bych měl udělat dál?

Pokud právě vytváříte nebo optimalizujete webové stránky pomocí WordPressu, doporučujeme vám pokračovat ve čtení o optimalizaci výkonu, konfiguraci pluginů a přizpůsobování témat.

Další čtení a praktické znalosti

Následující obsah souvisí s tématem tohoto článku a je vhodný k dalšímu prostudování. Obvykle je lepší začít čtením článku, který je nejblíže vašemu aktuálnímu problému, a poté postupně přecházet k souvisejícím tématům.

Štítky: