Вы запустили интернет-магазин на ProcessWire, но страницы грузятся по 3 секунды, а LCP зашкаливает? Стандартная тема добавила кучу лишних скриптов, а вёрстка не адаптируется под нужные данные. Кастомный шаблон решает это — вы получаете ровно то, что нужно, без мусора. За 8 лет работы с ProcessWire мы накопили опыт, позволяющий гарантировать надёжное решение. Переход на кастомные шаблоны снижает TTFB в 2–3 раза за счёт исключения неиспользуемых модулей.
Как разработать кастомный шаблон ProcessWire?
Шаблон в ProcessWire — PHP-файл в /site/templates/, имя которого совпадает с именем шаблона в базе. Файл получает объект $page с данными текущей страницы и полный доступ к $pages, $config, $user и остальному API. Чистый PHP — никакого движка по умолчанию, хотя можно подключить Twig через модуль TemplateEngineTwig. Для продакшена мы рекомендуем чистый PHP: он быстрее и не добавляет лишний слой абстракции.
Почему кастомный шаблон лучше стандартного?
Стандартные темы часто перегружены неиспользуемыми скриптами и стилями, что увеличивает LCP и CLS. Кастомный шаблон выводит только нужные данные, использует server-side rendering для тяжёлых компонентов и внедряет lazy loading для изображений. В одном из наших проектов — интернет-магазин на ProcessWire с 5000+ товаров — переход на кастомные шаблоны снизил потребление памяти на 60% и ускорил генерацию страниц в 2 раза. Дополнительно мы уменьшили количество запросов к БД с 50 до 3 на страницу.
Архитектура шаблонов: варианты разделения
Вариант 1: _init.php + _main.php
Самый распространённый подход. ProcessWire автоматически включает _init.php перед каждым шаблоном и _main.php после, если включена опция «Prepend/Append template file» в настройках шаблона:
// _init.php и _main.php — единый поток $baseUrl = $config->urls->root; $homePage = $pages->get("/"); $mainNav = $pages->find("parent=/,template!=error404,sort=sort"); ?><!DOCTYPE html> <html lang="<?= $user->language->name ?>"> <head> <meta charset="utf-8"> <title><?= $page->title ?> | <?= $homePage->title ?></title> <link rel="stylesheet" href="<?= $config->urls->templates ?>css/main.css"> </head> <body> <?php include("partials/nav.php"); ?> <main><?= $content ?></main> <?php include("partials/footer.php"); ?> </body> </html> Вариант 2: контроллер + вид
Для сложных шаблонов логику выносят в отдельный файл-контроллер. Это упрощает поддержку и тестирование:
// templates/services.php — точка входа require __DIR__ . '/controllers/services.php'; extract($viewData); require __DIR__ . '/views/services.view.php'; // templates/controllers/services.php — контроллер $viewData = [ 'items' => $pages->find("template=service, sort=sort, limit=12"), 'categories' => $pages->find("template=service-category, sort=sort"), 'pagination' => $modules->get("MarkupPagerNav"), ]; Сравнение подходов
| Характеристика | init/main | controller+view |
|---|---|---|
| Сложность | Низкая | Средняя |
| Поддержка | Простая | Гибкая |
| Тестируемость | Низкая | Высокая |
| Производительность | Высокая | Высокая |
| Рекомендация | Небольшие проекты | Сложные проекты |
Работа с изображениями
ProcessWire обрабатывает изображения на лету через метод size(). Пример с WebP:
$img = $page->images->first(); if ($img) { $thumb = $img->size(800, 600, ['cropping' => 'center', 'quality' => 85]); echo "<img src='{$thumb->url}' alt='{$img->description}' loading='lazy'>"; $webp = $img->size(800, 600, ['suffix' => 'webp', 'webpAdd' => true]); } Кастомные 404 и редиректы
if ($page->redirect_url) { $session->redirect($page->redirect_url, 301); } if (!$user->isLoggedin() && $page->requires_login) { throw new Wire404Exception(); } Как оптимизировать изображения: пошаговая инструкция
- Выберите изображение из галереи страницы.
- Вызовите
$img->size()с нужными параметрами. - Укажите
suffix: 'webp'иwebpAdd: trueдля генерации WebP. - Добавьте атрибут
loading='lazy'для отложенной загрузки. - Используйте
$pages->findMany()для массовой конвертации на высоконагруженных сайтах.
Производительность: ленивая загрузка связей
По умолчанию FieldtypePage загружает связанные объекты при обращении. При больших списках используйте $pages->findMany() — потоковая обработка без загрузки всего в память:
foreach ($pages->findMany("template=product, sort=title") as $product) { echo $product->title . "\n"; } Детали о findMany()
Метод findMany() обрабатывает страницы по одной, не сохраняя их в память. Это особенно важно на страницах с тысячами товаров. Он работает как генератор: при каждой итерации загружается только текущая страница.Типовые сроки разработки шаблонов
| Задача | Оценка |
|---|---|
| Базовый шаблон (layout + nav + footer) | 4–8 ч |
| Шаблон списка с пагинацией и фильтром | 8–16 ч |
| Детальная страница со связями | 4–10 ч |
| Система шаблонов для 10+ типов контента | 3–6 дней |
| Интеграция Twig + компонентный подход | 2–4 дня |
Что входит в разработку?
- Архитектура шаблонов (init/main или controller+view)
- Настройка prepend/append файлов
- Вёрстка всех типовых страниц (список, детальная, 404)
- Оптимизация изображений (size, WebP, lazy loading)
- Базовая SEO-разметка (meta title, description, og:image)
- Документация по шаблонам и доступам
- Обучение команды заказчика (1 час онлайн)
- Гарантия на код 3 месяца
Обучение и документация — отдельный пункт: мы передаём знания, чтобы вы могли поддерживать проект самостоятельно.
Типичные проблемы и их решение
Неиспользование буферизации вывода при prepend/append приводит к дублированию заголовков. Решение — всегда включать prepend/append или применять паттерн контроллера. Загрузка всех связанных страниц сразу — для наборов более 100 записей используйте $pages->findMany(). Игнорирование кэша изображений: ProcessWire кэширует варианты, но при частой смене контента очищайте кэш в /site/assets/files/. 404-страница обязательна: всегда выбрасывайте Wire404Exception для защищённых разделов.
Свяжитесь с нами для бесплатной консультации — обсудим ваш проект. Закажите разработку кастомного шаблона ProcessWire и получите гибкость и производительность.
MDN Lazy loading guide — подробнее об атрибуте loading. Wikipedia Core Web Vitals — метрики производительности.