Кодовые шаблоны: шапка, футер и управляемые вставки

Кодовые шаблоны позволяют централизованно управлять шапкой, футером и повторяемыми вставками. Их польза не в самом хранении HTML в административной панели, а в том, что один проверенный источник разметки применяется во всех нужных местах.

Почему копирование блоков по страницам не работает

Если один и тот же HTML вставлен вручную в десятки страниц, любое изменение превращается в массовую правку. Ссылки расходятся, классы начинают отличаться, а старые версии остаются в неожиданных местах.

Что стоит выносить в шаблоны

Глобальную шапку и навигацию.
Футер и контакты.
Повторяемые CTA-блоки.
Служебные уведомления.
Оболочки WooCommerce.
Интерфейсные фрагменты, которые меняются одновременно на всём сайте.

Проверка шапки

Логотип ведёт на главную.
Все пункты меню открываются.
Активный раздел выделяется.
Мобильное меню открывается и закрывается.
Навигация доступна с клавиатуры.
Шапка не перекрывает первый экран.

Изоляция стилей

Глобальные селекторы body, h1, a, button и .container часто создают конфликты. Все правила лучше ограничивать уникальным корневым классом.

.lana-site-header { ... }
.lana-site-header__nav { ... }
.lana-site-header__button { ... }

Именование классов

Короткие названия .card, .title и .button легко пересекаются с плагинами. Безопаснее использовать пространство имён платформы или проекта и последовательную структуру элементов.

HTML, CSS, JavaScript и PHP

HTML и локальный CSS проще проверить визуально. JavaScript способен нарушить меню, форму или галерею. PHP влияет на серверную логику и должен использоваться только в предусмотренных системой местах.

Правдоподобный код не равен безопасному. Перед применением проверяются синтаксис, область действия, зависимости и поведение при ошибке.

Порядок обновления

Экспортировать текущую версию.
Сохранить исходный файл.
Внести изменение в копию.
Проверить синтаксис и ссылки.
Запустить предварительную проверку.
Открыть главную, внутреннюю страницу, блог и WooCommerce.
Очистить кэш.

Почему шаблон не должен находиться в статье

Шапка, футер и общие вставки относятся к представлению сайта, а не к содержанию публикации. Если хранить их в content, запись получает лишние контейнеры, CSS и служебную разметку.

Типичные ошибки

После обновления изменились все ссылки

В шаблоне использован слишком общий CSS-селектор для a.

Мобильное меню не открывается

Нужно проверить совпадение селекторов HTML и JavaScript, уникальность ID и отсутствие двойных обработчиков.

Шапка отображается дважды

Шаблон одновременно подключён темой и вставлен в content страницы.

Частые вопросы

Можно ли хранить CSS прямо в шаблоне?

Можно, если система это допускает, а стили полностью изолированы. Для большого проекта лучше централизованный файл темы.

Нужно ли менять шаблон на каждой странице?

Нет. Глобальный код меняется в одном месте.

Зачем сохранять старую версию?

Для сравнения, быстрого отката и понимания того, какая конфигурация была рабочей.

Инженерное решение вместо CSS-патчей

В реальном проекте пересечение классов с префиксом kps- привело к тому, что тема не могла однозначно определить управляемый WooCommerce-шаблон. Простого пользовательского атрибута оказалось недостаточно. После введения официального data-lana-woo-template совместимость стала проверяемой на уровне runtime, а не зависела от случайного совпадения CSS.

Что хранить в истории изменений

Для каждого глобального шаблона полезно фиксировать дату, назначение, затронутые области и результат проверки. Например: «обновлена галерея товара; проверены простой и вариативный товар; мобильная версия; блок похожих товаров». Такая запись намного полезнее формального комментария «исправлены стили».

Связанные материалы

Кодовые шаблоны дают пользу только при дисциплине: один источник, изолированные стили, понятные названия, резервная копия и проверка разных типов страниц.