Головна/WordPress Fullstack/Блупринти/Кастомні теми/Классическая тема WordPress с нуля: иерархия шаблонов, The Loop, functions.php и wp_enqueue_scripts
До карток розділу «Кастомні теми»
Кастомні теми(ТЗ 50 из 54)
ТЗ: Классическая тема WordPress с нуля: иерархия шаблонов, The Loop, functions.php и wp_enqueue_scripts
Кастомні теми4 шагов • +20 XP

ТЗ: Классическая тема WordPress с нуля: иерархия шаблонов, The Loop, functions.php и wp_enqueue_scripts

Линейное руководство по созданию чистой классической темы: семантическая разметка HTML5, правильное подключение ассетов с хэшированием версий, каскад locate_template(), хуки ядра и прохождение Theme Check.

~6 ч работыУровень: JuniorPHP 8.3/8.4Иерархия шаблоновThe Loopfunctions.phpwp_enqueue_scriptsTheme Checkget_template_partLocal WOFF2
+5 XP за шаг
Выполнено 0 из 4 шагов (0%)
Трудозатраты~6 рабочих часов
Фриланс вилка~$270 – $450 (€240 – €420)
Оценка веб-студии~$570 – $960 (€540 – €900)

ТЗ заказчика (исходный бриф):

Тема должна стать надежным и чистым фундаментом компании: идеальный чистый PHP-код по стандартам WPCS, отсутствие лишних зависимостей и максимальная скорость загрузки.
Ключевые требования:
  • •Создание темы в каталоге wp-content/themes/ с правильными метаданными в style.css
  • •Модульная организация functions.php с разделением инициализации, подключения ассетов и хелперов
  • •Каскадная иерархия шаблонов: header.php, footer.php, index.php, single.php, page.php, archive.php, 404.php
  • •Корректная реализация цикла The Loop с пагинацией и декомпозицией через get_template_part()
  • •Подключение CSS и JS строго через хук wp_enqueue_scripts с динамической версией по filemtime()
  • •100% соответствие стандартам WordPress Theme Check
Ограничения проекта:
  • •Окружение: PHP 8.3+, WordPress 6.7+
  • •Запрет на прямое подключение тегов <link> и <script> в header.php
  • •Все текстовые строки должны быть подготовлены к локализации через textdomain
Критерии приёмки (KPI):
  • 0 предупреждений в плагине Theme Check
  • LCP < 1.2 сек, CLS = 0 на чистой установке
  • Полная валидность W3C HTML5

Пошаговое практическое руководство по ТЗ

Подробный разбор архитектуры, код реализации и советы эксперта по каждому этапу:

1
Этап 1 из 4

Файловая структура и манифест style.css

Практическое руководство:

Создайте каталог темы wp-content/themes/company-theme/. Создайте обязательные файлы style.css и index.php. Заполните метаданные темы в style.css: Theme Name, Author, Version, Requires at least, Requires PHP, Text Domain.

План и контрольные точки реализации:
1Создать style.css с метаданными темы
2Создать index.php с базовым фолбэком
3Добавить скриншот screenshot.png (1200x900)
Важные технические нюансы и подводные камни:

Убедитесь, что Text Domain строго совпадает со слагом папки темы для корректной работы переводов.

CSS
/*
Theme Name: Company Classic Theme
Theme URI: https://example.com/theme
Author: Fullstack AI Lab
Author URI: https://example.com
Description: Высокопроизводительная классическая тема WordPress по стандартам WPCS 2026.
Version: 1.0.0
Requires at least: 6.7
Requires PHP: 8.3
License: GNU General Public License v2 or later
Text Domain: company-theme
*/
Освіжити знання в теорії: Иерархия шаблонов в WordPress с нуля
2
Этап 2 из 4

Инициализация темы и add_theme_support

3
Этап 3 из 4

Подключение стилей и скриптов через wp_enqueue_scripts

4
Этап 4 из 4

Реализация The Loop и декомпозиция шаблонов

Типичные грабли на этом ТЗ

3 антипаттерна

Что сдаём клиенту (Deliverables)

Чек-лист сдачи
Готовая и активированная классическая тема в wp-content/themes/company-theme
Модульный functions.php с регистрацией меню и theme support
Шаблоны index.php, single.php, page.php, archive.php, 404.php
Файл readme.txt и скриншот темы screenshot.png (1200x900)
Отчет Theme Check с нулевым количеством ошибок

Инструменты экосистемы Fullstack AI Lab для этого ТЗ

Интеграция

AI-Собеседование

Пройти голосовое или текстовое интервью по технологиям ТЗ

Архитектурные Воркфлоу

43 пошаговых сценария с командами CLI и готовыми конфигами