Своя тема

Тема — папка с шаблонами в wp-content/themes. Для самой простой темы достаточно двух файлов. Написать её с нуля — лучший способ понять, как WordPress собирает страницу.

Два обязательных файла

Создайте папку wp-content/themes/mytheme и в ней файл style.css с заголовком-комментарием:

/*
Theme Name: My Theme
Author: Анна Иванова
Description: Учебная тема.
Version: 1.0.0
Text Domain: mytheme
*/

По этому комментарию WordPress узнаёт о теме. Второй файл — index.php:

<?php
// index.php
?>
<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
    <meta charset="<?php bloginfo('charset'); ?>">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <?php wp_head(); ?>
</head>
<body <?php body_class(); ?>>
    <h1><?php bloginfo('name'); ?></h1>
 
    <?php wp_footer(); ?>
</body>
</html>

Тема появится в разделе «Внешний вид → Темы». Включите её — сайт покажет название.

wp_head и wp_footer

Эти два вызова обязательны. Через них WordPress и плагины вставляют на страницу стили, скрипты, заголовок окна и служебные теги. Без них не будет работать ни панель администратора вверху сайта, ни большинство плагинов.

Функции шаблона

Данные сайта выводят готовыми функциями:

Функция	Что выводит
`bloginfo('name')`	Название сайта
`bloginfo('description')`	Краткое описание
`home_url('/')`	Адрес главной страницы (возвращает, а не выводит)
`language_attributes()`	Атрибут `lang` для тега `html`
`body_class()`	Классы тега `body` для текущей страницы

Файл functions.php

functions.php выполняется при каждой загрузке сайта. В нём тема сообщает о своих возможностях и подключает стили:

// functions.php
 
add_action('after_setup_theme', function () {
    add_theme_support('title-tag');
    add_theme_support('post-thumbnails');
    add_theme_support('html5', ['search-form', 'gallery', 'caption', 'style', 'script']);
});
 
add_action('wp_enqueue_scripts', function () {
    wp_enqueue_style('mytheme-style', get_stylesheet_uri(), [], '1.0.0');
});

add_action() привязывает функцию к событию WordPress — о хуках будет отдельный урок.

Возможности темы

Возможность	Что даёт
`title-tag`	WordPress сам выводит тег `title`
`post-thumbnails`	Картинка записи (миниатюра)
`custom-logo`	Загрузка логотипа в настройках
`html5`	Современная разметка форм и галерей
`menus`	Меню, настраиваемые в панели

Блочные темы

Современные темы WordPress бывают блочными: вместо PHP-шаблонов в них HTML-файлы из блоков и файл настроек theme.json, а редактировать их можно прямо в панели. Классические темы на PHP по-прежнему работают и проще для понимания — на них и построен этот курс.

Частая ошибка

Тег <title> и подключение стилей не пишут в шаблоне вручную. Строка <link rel="stylesheet" href="style.css"> в index.php сломается на внутренних страницах и помешает плагинам. Заголовок окна включают через title-tag, а стили и скрипты подключают функциями wp_enqueue_style() и wp_enqueue_script().

Спасибо, что читаете!