Poznejte základní koncepty WordPressových šablon.
Před tím, než vytvoříte plně funkční a snadno udržovatelné téma pro WordPress, musí vývojář ovládat jeho základní architekturu. Téma je v podstatě soubor tematických souborů, které definují vzhled a funkce webové stránky. Nejdůležitějším souborem je… style.cssNejenže obsahuje pravidla stylizace daného tématu, ale také prostřednictvím poznámek v hlavičce souboru deklaruje metadata tohoto tématu – jako je název tématu, popis, autor a verze. Dalším základním prvkem je… index.phpJedná se o výchozí šablonový soubor, který se použije, když WordPress nenachází konkrétnější šablonu.
Kromě toho funguje téma prostřednictvím hierarchické struktury šablon. Například, pokud chcete zobrazit konkrétní blogový článek, WordPress bude nejprve hledat odpovídající šablonu. single.phpPokud neexistuje, pak se vrátí ke předchozímu stavu. index.phpStejně tak bude stránka také využívat… page.phpNa domovské stránce se to pravděpodobně bude používat. front-page.php 或 home.phpNejzjednodušenější téma může obsahovat pouze… style.css 和 index.phpAle pro dosažení profesionálních výsledků je nutné dobře využít tento hierarchický systém. Porozumění tomu, jak tyto soubory prostřednictvím hlavního cyklu WordPressu volají obsah článků, je prvním krokem v procesu vývoje.
Vytvoření šablonových souborů a struktury pro téma
Dobře strukturovaná tematická architektura je klíčem k udržovatelnosti. Typický moderní tematický adresář by měl obsahovat následující základní šablonové soubory: ty slouží k zobrazení jednotlivých článků na jedné stránce. single.phpPoužívá se pro statické stránky. page.phpPoužívá se pro seznam archivovaných článků. archive.php…a také ty, které se používají pro výsledky vyhledávání. search.phpAby bylo možné dodržet princip DRY (Don’t Repeat Yourself) v kódu, společné části, jako je nadpis stránky, podpis stránky a boční lišta, by měly být vyjmuty a převedeny do samostatných šablonových komponent.
Tím je zavedeno… get_header(), get_footer() 和 get_sidebar() Tyto šablónové značky umožňují vývojářům vytvářet odpovídající struktury a funkce v jejich aplikacích. header.php、footer.php 和 sidebar.php Soubory mohou být vytvořeny a poté použity v jiných šablonách. Například, typický příklad… page.php Struktura souborů je následující:
<?php get_header(); ?>
<main id="primary" class="site-main">
<?php
while ( have_posts() ) :
the_post();
get_template_part( 'template-parts/content', 'page' );
endwhile;
?>
</main>
<?php get_sidebar(); ?>
<?php get_footer(); ?> Další výkonnou funkcí je get_template_part() Funkce vám umožňují dále modularizovat obsahové šablony – například můžete logiku zobrazení obsahu článků a stránek oddělit. content.php 和 content-page.php Uvnitř je uloženo v jednom… template-parts V složce lze dosáhnout přesnějšího opakovaného využití a lepší kontroly obsahu.
Integrace základních funkcí WordPressu a hooků
Síla WordPressu spočívá v jeho bohatém API a systému hooků, včetně akcí a filtrů. Vývojáři temát (témů) tak mohou využívat funkční soubory k implementaci různých funkcí a úprav v chování webu. functions.php Slouží k integraci těchto funkcí. Tento soubor se používá k registraci funkcí podporovaných tématů, přidávání skriptovacích stylů, definování umístění nabídek atd.
Například, pokud chcete tematu přidat podporu pro speciální obrázky článků a vlastní menu, musíte… functions.php Použijte to v čínštině. add_theme_support() Funkce:
<?php
function mytheme_setup() {
// 启用文章和页面的特色图像功能
add_theme_support( 'post-thumbnails' );
// 注册一个导航菜单位置
register_nav_menus( array(
'primary' => __( '主导航菜单', 'mytheme' ),
) );
}
add_action( 'after_setup_theme', 'mytheme_setup' ); Další klíčovou operací je správné přidání souborů CSS a JavaScript. Nikdy nepoužívejte přímé odkazy („hard links“) na tyto zdroje přímo do šablonových souborů, ale raději používejte vhodné metody pro jejich načtení. wp_enqueue_style() 和 wp_enqueue_script() Funkce a jejich připojení k wp_enqueue_scripts Na háčku. To zajišťuje správné řízení závislostí mezi jednotlivými komponentami a předchází jejich opakovanému načítání.
function mytheme_scripts() {
// 引入主题的主样式表
wp_enqueue_style( 'mytheme-style', get_stylesheet_uri() );
// 引入自定义脚本
wp_enqueue_script( 'mytheme-navigation', get_template_directory_uri() . '/js/navigation.js', array(), '1.0.0', true );
}
add_action( 'wp_enqueue_scripts', 'mytheme_scripts' ); Implementovat responsivní design a personalizaci témat
Moderní WordPress tématy musí být responzivní, aby poskytovaly dobrý zážitek při prohlížení na různých zařízeních. Toho je dosaženo především pomocí… style.css Je to realizováno pomocí CSS media queries. Současně doporučuje WordPress… head Část obsahu obsahuje přidání metakódů pro zobrazení v okně (viewport meta tags), což se obvykle děje… header.php Dokončeno v…
Ještě důležitější je, že aby i weboví administrátoři, kteří nemají vývojové znalosti, mohli upravovat vzhled témat, poskytuje WordPress API pro vlastní nastavení. Vývojáři mohou integrovat různá nastavení, ovládací prvky a funkce pro předvídky do reálného nástroje na úpravu témat v WordPressu. To zahrnuje použití… WP_Customize_Manager Třída.
Například: Přidání možnosti upravit text autorských práv v podkladovém textu stránky.
function mytheme_customize_register( $wp_customize ) {
// 添加一个设置项
$wp_customize->add_setting( 'footer_text', array(
'default' => 'Copyright © 2026',
'sanitize_callback' => 'sanitize_text_field',
'transport' => 'postMessage',
) );
// 添加一个控件来修改该设置
$wp_customize->add_control( 'footer_text', array(
'label' => __( '页脚版权文本', 'mytheme' ),
'section' => 'title_tagline',
'type' => 'text',
) );
}
add_action( 'customize_register', 'mytheme_customize_register' ); A poté, footer.php V šabloně můžete použít následující způsoby: get_theme_mod() Funkce vypisuje tento hodnotu:<?php echo esc_html( get_theme_mod( 'footer_text', 'Copyright © 2026' ) ); ?>Nyní můžete začít používat službu Google Assistant. transport => 'postMessage' A v kombinaci s JavaScriptem lze dosáhnout reálného předvádění obsahu bez potřeby obnovit stránku, což výrazně zlepšuje uživatelský zážitek.
Závěr
Vývoj tem pro WordPress je systémový proces, který vyžaduje, aby vývojáři nejenom rozuměli PHP, HTML, CSS a JavaScript, ale také hluboce chápali základní filozofii a architekturu WordPressu. Od nejzákladnějších úrovní šablon a hlavního cyklu přes modulární komponenty šablon až po… functions.php Integrace silného WordPress API a systému hooků je základem pro vytváření stabilních a efektivních temat. Každý krok v tomto procesu je důležitým stavebním kamenem.
Během vývoje je velmi důležité dodržovat kódovací standardy a osvědčené postupy WordPressu, neboť to zajišťuje kompatibilitu vašeho tématu s jádrem systému a s velkým množstvím doplňků. Zároveň je pro uživatele na straně klienta důležité implementovat responzivní design a plně využívat API přizpůsobovacích nástrojů, které poskytují vizuální možnosti úprav. Tím se výrazně zvyšuje profesionalita a použitelnost vašeho tématu. Díky neustálému používání těchto principů a metod můžete od nuly vytvořit kvalitní WordPress téma, které splňuje vaše osobní požadavky a zároveň má komerční hodnotu.
Časté dotazy
K vytvoření WordPress tématu „###“ je potřeba nejméně následujících souborů:
Jedno z nejzákladnějších témat, které je schopno WordPress rozpoznat, potřebuje pouze dvě soubory. Prvním z nich je… style.cssV hlavičce souboru musí být obsažen platný blok poznámek s informacemi o tématu. Druhým požadavkem je… index.phpJako výchozí zpáteční šablona pro všechny stránky. S těmito dvěma soubory lze nejjednodušší téma aktivovat a spustit v pozadí.
Co je to hierarchie šablon v WordPressu a jaká je její funkce?
Řízení úrovní šablon (template hierarchy) je soubor pravidel, která WordPress používá při zobrazování různých typů obsahu k automatickému výběru odpovídajících šablonových souborů. Jeho účelem je zvýšit efektivitu a flexibilitu. Například při navštívení stránky určené k zobrazení obsahu podle určité kategorie vyhledává WordPress šablony v určitém pořadí. category-{slug}.php、category-{id}.php、archive.phpA nakonec je… index.phpVývojáři mohou využít tato pravidla k vytvoření detailního, přizpůsobeného vzhledu různých částí webové stránky, aniž by museli psát složitý logický kód.
Jaký je rozdíl mezi funkčním souborem tématu functions.php a pluginem?
functions.php Jak pluginy, tak i další doplňky mohou sloužit k přidávání funkcí do WordPressu, avšak jejich dosah a účel použití se liší.functions.php Je součástí daného tématu a jeho funkce jsou vázány na aktuálně aktivní téma. Po změně tématu funkce přidané pomocí tohoto prvku obvykle přestanou fungovat. Nejvhodnější je použít tento prvek pro přidávání funkcí, které jsou úzce spojeny s vzhledem a způsobem zobrazení tématu – např. registrační menu, podpora speciálních obrázků, načítání skriptů určených k nastavení vzhledu tématu atd. Pluginy naopak poskytují funkce nezávislé na konkrétním tématu a jsou vhodné pro přidávání univerzálních nebo obchodních funkcí, jako jsou kontaktní formuláře, optimalizace pro vyhledávače (SEO), e-shopové systémy atd. Pokud je nějaká funkce potřeba v rámci více témat, měla by být vyvinuta jako plugin.
Jak zajistit, aby téma, které vytvářím, splňovalo kódovací standardy WordPressu?
Abyste se ujistili, že váš téma splňuje kódovací standardy WordPressu, je nejprve nutné se podívat na oficiální dokumentaci „WordPress Coding Standards“. Pro kontrolu kódu v PHP můžete použít nástroj PHP CodeSniffer v kombinaci s sadou pravidel určených pro kódování WordPressu. Pro CSS a JavaScript existují také příslušné pokyny. Během vývoje byste měli pro splnění běžných úkolů využívat funkce a API poskytované samotným WordPressem, místo abyste vytvářeli vlastní řešení. Před tím, než své téma odešlete do oficiálního adresáře temat, tým příslušných revizorů také důkladně prověří dodržování těchto standardů. Dodržování těchto pravidel je tedy podmínkou pro zveřejnění vašeho tématu a zároveň nejlepší praxí pro zajištění kvality a udržovatelnosti kódu.
Jaký je další krok? Co bych měl udělat dál?
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.
- Proč používat WooCommerce k vytvoření online obchodu?
- Od začátků až po dokonalost: Kompletní průvodce procesem vytváření profesionálních webových stránek pomocí WordPress
- Průvodce výstavbou webových stránek pomocí WordPress: Kompletní kroky a osvědčené postupy pro vytvoření profesionálních webových stránek od nuly
- 10 pokročilých triků pro WooCommerce, které zvýší konverzi a zlepší uživatelský zážitek na vašem e-shopu
- Proč zvolit WordPress: Deset hlavních výhod open-source redakčního systému (CMS)