Как изменить шапку сайта в теме WordPress

Шапка сайта в WordPress обычно меняется не в одном месте, а сразу в нескольких: логотип загружается отдельно, меню настраивается отдельно, контактные элементы могут жить в настройках темы, а верхняя панель — в блоках, виджетах или шаблоне. Поэтому сначала нужно понять, какая у вас тема: классическая, блочная или тема с собственным конструктором шапки. От этого зависит, где именно искать нужные настройки и можно ли обойтись без кода.

Если задача простая — заменить логотип, поправить пункты меню, добавить телефон или убрать лишнюю верхнюю полоску — чаще всего это делается штатными средствами WordPress и темы. Ниже разбираю, как действовать без лишних экспериментов и где искать настройки в разных типах тем.

Сначала определите, где у вашей темы редактируется шапка

В WordPress нет одного универсального экрана для шапки. На практике встречаются три сценария.

• Классическая тема — шапка настраивается через «Внешний вид» → «Настроить», иногда через отдельные разделы темы.
• Блочная тема — шапка собирается в редакторе сайта через «Внешний вид» → «Редактор».
• Тема с собственными настройками — часть элементов шапки вынесена в отдельные панели темы, а часть остаётся в стандартных настройках WordPress.

Если вы не уверены, откройте админку и посмотрите, что есть в меню «Внешний вид». Если там есть пункт «Редактор», вероятно, у вас блочная тема. Если есть «Настроить», но нет полноценного редактора сайта, чаще всего это классическая тема. Некоторые темы показывают оба варианта, но используют их по-разному.

Как изменить логотип в шапке WordPress

Логотип почти всегда меняется отдельно от остальной шапки. Обычно путь такой: Внешний вид → Настроить → Свойства сайта или похожий раздел с названием вроде Логотип, Site Identity, Header.

Что обычно можно сделать в этом разделе:

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

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

После замены логотипа проверьте шапку на главной странице и на внутренних страницах. В некоторых темах логотип на главной и в каталоге может отображаться по-разному, особенно если в шапке есть липкое меню или мобильная версия.

Где меняется меню в верхней части сайта

Меню в шапке обычно настраивается не в самой шапке, а в разделе меню WordPress. В классических темах это чаще всего Внешний вид → Меню или Внешний вид → Настроить → Меню. В блочных темах меню может быть частью шаблона шапки и редактироваться прямо в редакторе сайта.

Если меню не отображается в шапке, проверьте три вещи:

1. Создано ли само меню в админке.
2. Назначено ли оно в нужную область темы, например Основное меню, Header Menu, Top Menu.
3. Поддерживает ли тема несколько меню и не скрывает ли их на мобильных устройствах.

У многих тем есть отдельные области для основного меню, верхнего меню и мобильного меню. Это не ошибка, а нормальная схема: один набор ссылок может быть в шапке, другой — в верхней полосе, третий — в выезжающем мобильном меню.

Если вы меняете структуру меню, не забывайте проверить адаптивную версию. Иногда на десктопе всё выглядит нормально, а на телефоне пункты меню обрезаются или уходят в «гамбургер» не так, как вы ожидали.

Контакты, кнопки и верхняя панель: где искать эти элементы

Телефон, email, кнопка «Заказать звонок», адрес, иконки соцсетей и другие элементы верхней части сайта могут быть реализованы по-разному. Здесь как раз чаще всего и возникает путаница: пользователь ищет их в меню, а они находятся в настройках темы, виджетах или блоках шаблона.

Проверьте такие места:

• Настройки темы — разделы вроде Header, Top Bar, Contacts, Buttons, Header Builder.
• Виджеты — особенно если тема старая или использует классическую структуру.
• Редактор сайта — в блочных темах контактные элементы часто собраны прямо в шаблоне шапки.
• Дополнительные плагины — иногда кнопка, попап или иконка телефона добавлены не темой, а отдельным расширением.

Если в шапке есть телефон, лучше использовать кликабельную ссылку формата tel:. Это не только удобнее для мобильных пользователей, но и избавляет от лишних копирований номера вручную. Многие темы делают это автоматически, но если вы добавляете контактный элемент вручную, проверьте, чтобы номер был оформлен правильно.

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

Как редактировать шапку в классической теме

В классической теме шапка чаще всего меняется через Внешний вид → Настроить. Там ищите разделы, связанные с заголовком сайта, шапкой, меню и верхней панелью. Названия пунктов зависят от темы, поэтому ориентируйтесь не на конкретный путь, а на смысл раздела.

Обычно в классической теме можно:

• сменить логотип и фавикон;
• включить или отключить название сайта;
• назначить меню в область шапки;
• настроить цвета фона и текста;
• включить верхнюю панель с контактами;
• изменить расположение элементов, если тема это поддерживает.

Если тема давно не обновлялась, часть настроек может быть спрятана в отдельном разделе или вообще отсутствовать. Тогда остаются либо встроенные опции темы, либо доработка через дочернюю тему и CSS. Безопаснее не править файлы основной темы напрямую: после обновления изменения могут исчезнуть.

Как изменить шапку в блочной теме WordPress

В блочной теме шапка редактируется через Внешний вид → Редактор. Дальше нужно открыть шаблон сайта или шаблон части шаблона, который отвечает за header. Там можно менять блоки: логотип сайта, навигацию, кнопки, текст, иконки, разделители и другие элементы.

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

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

Когда без CSS уже не обойтись

Если нужный элемент есть, но его нельзя нормально переставить или скрыть через настройки, тогда подключается CSS. Это уже не первый шаг, а запасной вариант. Он подходит, когда нужно:

• уменьшить высоту шапки;
• сдвинуть логотип и меню;
• убрать лишний отступ;
• скрыть элемент только на мобильных устройствах;
• поправить выравнивание кнопки или телефона.

Добавлять CSS лучше через кастомайзер, дополнительный CSS темы или дочернюю тему. Не вносите правки в файлы основной темы, если не хотите потерять их после обновления.

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

Как проверить, что шапка изменена правильно

После правок не ограничивайтесь просмотром главной страницы. Проверьте несколько сценариев:

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

Смотрите не только на внешний вид, но и на поведение элементов: кликается ли логотип, открывается ли меню, не перекрывает ли шапка контент, не уехали ли контакты за пределы экрана. Если тема использует липкую шапку, проверьте и её: иногда после изменения высоты логотипа или кнопок липкий блок начинает прыгать при прокрутке.

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

Что делать, если нужной настройки в теме нет

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

1. Оставить текущую тему и доработать шапку через CSS или дочернюю тему.
2. Подобрать тему, где шапка настраивается гибче.
3. Если сайт только запускается, сразу перейти на тему с более удобным конструктором шапки.

Если вы только выбираете тему, смотрите не только на внешний вид демо, но и на возможности настройки header, меню и мобильной версии. Для сайта компании, блога или небольшого магазина удобнее брать тему, где шапка настраивается без ручного редактирования шаблонов. В каталоге тем WPShop можно посмотреть варианты с разной структурой и уровнем кастомизации: каталог тем.

Если нужна именно тема с более гибкой структурой и готовыми стартовыми решениями, имеет смысл смотреть на темы, где шапка и меню уже продуманы под тип сайта, а не собирать всё вручную после установки.

Коротко о главном

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