Кейс: Укрощение блочной темы WordPress. Путь через боль к контролю

Автор: Hallow / Sarcastic Saint

---

Я просто хотел создать простой, минималистичный блог. Выбрал стандартную, современную тему WordPress — Twenty Twenty-Five — и это стало началом долгого и мучительного квеста. То, что должно было занять один вечер, превратилось в многодневную битву с неинтуитивным интерфейсом, скрытыми меню и нелогичным поведением. Эта статья — мой бортовой журнал этой битвы.

Часть 1: Первые «грабли» — хаос в шаблонах

Первая проблема проявилась сразу: контент выглядел не так, как я его писал. На страницах появлялись дублирующиеся заголовки, лишние меню и блоки, которых я не добавлял. Я быстро понял, что редактировать просто «страницу» недостаточно. Нужно было редактировать сам «чертеж», по которому она строится — Шаблон.

Оказалось, что в WordPress для каждого типа контента есть свой шаблон:

• Для статичных страниц — Страницы.
• Для ленты блога — Главная страница блога (Home).
• Для отдельных статей — Отдельные записи (Single Post).

В каждом из них жили «призраки» — демонстрационные блоки. Мне пришлось методично заходить в каждый шаблон через «Внешний вид» -> «Редактор» и проводить «генеральную уборку», удаляя все лишнее: автоматические заголовки, метаданные, блоки комментариев и навигации по записям.

Часть 2: Тайна пропавшей Шапки

В процессе «зачистки» я совершил фатальную ошибку: случайно удалил всю шапку целиком. И так как шапка — это глобальный, «синхронизированный» элемент (шаблонная часть), она исчезла со всех страниц сайта. Навигация пропала. Сайт «ослеп».

Попытки найти и восстановить ее через стандартные меню провалились. Оказалось, что в моей теме нет очевидного раздела «Шаблонные части». Решение нашлось — создать новую Шапку с нуля. Я добавил пустую «Часть шаблона», назвал ее «Шапка 3» и начал собирать ее из отдельных «кирпичиков»:

1. Сначала добавил контейнер «Строка» (Row), чтобы выстроить все элементы в линию.
2. Внутрь него поместил блоки «Название сайта», «Навигация» и «Поиск».
3. Выровнял их с помощью опции «Интервал между элементами».

После этого оставалось лишь «прописать» эту новую, созданную вручную шапку во всех остальных шаблонах.

Часть 3: Финальный босс — «Липкая» шапка и CSS

Последним вызовом стало желание зафиксировать шапку. Встроенная опция «Позиция: Липкий» в теме не работала как надо. Стало ясно, что шаблон сломан или имеет свои особенности. Пришлось прибегнуть к «хирургическому вмешательству».

Я открыл сайт, нажал «Просмотреть код» и, как детектив, нашел настоящее имя (CSS-класс) контейнера моей шапки. Затем, я воспользовался «секретным» способом добавить CSS-код — открыл классический «Настройщик» по прямой ссылке /wp-admin/customize.php, так как в моей теме его убрали из меню. В разделе «Дополнительные стили» я вставил код, который решил проблему.

Вот этот «магический» код:

* Финальный код для "липкой" шапки */
.home .wp-block-template-part:first-of-type,
.blog .wp-block-template-part:first-of-type,
.single .wp-block-template-part:first-of-type,
.page .wp-block-template-part:first-of-type {
    position: sticky;
    top: 0;
    z-index: 1000;
    width: 100%;
    background-color: white;
}

/* Компенсируем отступ для админ-панели */
.admin-bar .home .wp-block-template-part:first-of-type,
.admin-bar .blog .wp-block-template-part:first-of-type,
.admin-bar .single .wp-block-template-part:first-of-type,
.admin-bar .page .wp-block-template-part:first-of-type {
    top: 32px;
}

Выводы и размышления

Современные блочные темы WordPress — невероятно мощный, но ужасно недружелюбный инструмент. Они обещают простоту, но скрывают фундаментальные настройки за слоями неочевидных меню. Главный урок, который я вынес: не бояться «ломать». Только разбирая и собирая сайт по кирпичику, можно по-настоящему понять, как он устроен. В итоге я получил не просто работающий сайт, а полный контроль над его архитектурой. И этот опыт, несмотря на всю боль и разочарование, оказался бесценным.