4 простых метода (3 без кода)
Опубликовано: 2022-07-21Заголовок — это первый элемент вашего сайта, который видят большинство посетителей. Как правило, именно здесь размещаются логотип и меню вашего сайта, и это неотъемлемая часть каждой страницы. Если вы не знаете, как редактировать заголовок WordPress, вам будет трудно ️ произвести сильное первое впечатление.
WordPress позволяет редактировать заголовок вашего сайта несколькими способами. Почти каждая тема имеет уникальный дизайн заголовка, который вы можете настроить вручную. В качестве альтернативы вы можете использовать набор инструментов, предоставляемых более широким сообществом WordPress.
В этой статье мы покажем вам четыре способа редактирования заголовка WordPress , как с плагинами, так и без них. Давай приступим к работе!
Оглавление:
- Отредактируйте заголовок с помощью настройщика
- Используйте полное редактирование сайта (и совместимую тему)
- Отредактируйте заголовок с помощью конструктора страниц WordPress.
- Добавьте пользовательский код в шапку с помощью плагина
1. Отредактируйте заголовок с помощью настройщика
Настройщик WordPress — это встроенный инструмент, который позволяет вам редактировать глобальные элементы вашего веб-сайта. Вы можете использовать настройщик для редактирования верхнего и нижнего колонтитула, типографики, меню и других ключевых аспектов вашего сайта.
Чтобы получить доступ к Customizer, перейдите на панель управления и нажмите « Внешний вид » > « Настроить » . Настройщик отобразит меню параметров слева и предварительный просмотр вашего веб-сайта справа:

Обратите внимание: если вы не видите параметр WordPress Customizer на своей панели инструментов, возможно, вы используете тему с поддержкой блоков. Чтобы отредактировать заголовок для темы этого типа, вам нужно использовать полное редактирование сайта, о котором мы расскажем в следующем разделе.
В Настройщике вы должны увидеть параметр, связанный с вашим заголовком. Иногда это может быть видно сразу, как в примере выше. В других случаях вам может понадобиться перейти в подменю. Например, некоторые темы помещают параметры заголовка в параметры макета или что-то подобное.
После того, как вы найдете параметры заголовка своей темы, варианты, которые вы видите сейчас, будут зависеть от того, какую тему вы используете. Например, наша тема Neve включает в себя параметры для изменения вашего логотипа, цвета заголовка и меню, отображаемого в этом разделе:

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

Когда вы довольны конфигурацией своего заголовка, сохраните изменения в своей теме, нажав кнопку « Опубликовать » в верхней части настройщика.
Обратите внимание, что любые изменения, которые вы делаете с помощью Customizer, будут применяться только к вашей активной теме. Если вы измените тему, вам нужно будет снова отредактировать заголовок WordPress.
2. Используйте полное редактирование сайта (и совместимую тему)
Полное редактирование сайта — это новая функция, которая позволяет редактировать шаблоны тем с помощью редактора блоков. Это работает только для тем с поддержкой блоков, поэтому оно может быть доступно или недоступно на вашем сайте.
Чтобы узнать, поддерживает ли ваша тема полное редактирование сайта, откройте меню « Внешний вид » и найдите параметр « Редактор »:

Выберите это и откроется редактор блоков. Однако вы будете редактировать свои шаблоны тем, а не отдельные страницы или сообщения.
По умолчанию редактор откроет шаблон домашней страницы, который должен включать элемент Заголовок :

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

На этом этапе вы можете добавить или удалить блоки из заголовка. Чтобы удалить или отредактировать существующий блок, выберите его и используйте контекстное меню, которое появляется на экране при этом:

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

Чтобы добавить новый блок, выберите элемент Заголовок и найдите значок плюса . Эта кнопка откроет меню, в котором вы сможете выбрать, какой блок добавить:

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


Если вас устраивают изменения в заголовке, нажмите « Сохранить » . Это сохранит изменения в шаблоне заголовка темы, и они автоматически отразятся на вашем сайте.
3. Отредактируйте заголовок с помощью конструктора страниц WordPress.
Некоторые плагины для создания страниц WordPress предлагают варианты редактирования заголовка WordPress. Например, Elementor Pro включает в себя инструмент Theme Builder, к которому вы можете получить доступ с премиальной лицензией.
Если у вас нет доступа к Elementor Pro, вы можете использовать бесплатное стороннее расширение, например плагин Elementor Header & Footer Builder на WordPress.org.
Однако мы собираемся показать вам, как это сделать с помощью Elementor Pro и его функции Theme Builder.
На практике Elementor Theme Builder работает аналогично полному редактированию сайта.
Чтобы получить доступ к Theme Builder, перейдите в Templates > Theme Builder . Выберите параметры заголовка в разделе SITE PARTS и найдите существующие шаблоны справа. Должен быть только один шаблон заголовка, и вы можете нажать кнопку « Редактировать » рядом с ним:

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

Если вы используете Elementor, мы рекомендуем вам воспользоваться этими шаблонами. Это позволяет вам экспериментировать с несколькими стилями заголовков, которые вы можете редактировать, добавляя или настраивая модули:

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

Если вы уже не платите за премиальную лицензию Elementor, инструмент Theme Builder сам по себе может не оправдать покупку. Он делает то же самое, что и полное редактирование сайта, но по более высокой цене. Основное отличие состоит в том, что вы можете использовать более широкий набор модулей Elementor, и если вы уже используете Elementor, будет проще убедиться, что дизайн вашего заголовка соответствует остальной части вашего сайта.
4. Добавьте пользовательский код в шапку с помощью плагина
Как правило, использование плагинов — самый простой способ реализовать настройки в WordPress. Однако это обычно не относится к заголовкам. Если вам нужен плагин, который позволит вам визуально редактировать заголовки, вам нужно будет использовать компоновщик страниц. Как мы обсуждали в предыдущем разделе, большинство компоновщиков страниц, предлагающих эту функциональность, имеют высокую цену.
Бесплатные плагины, которые позволяют настраивать заголовок, обычно предлагают более простой способ добавления в него пользовательского кода. Альтернативой является редактирование файлов темы вручную с помощью дочерней темы, что может быть пугающим (и рискованным), если у вас нет опыта веб-разработки.
Одним из фантастических примеров такого плагина является Header Footer Code Manager. Этот инструмент позволяет добавлять фрагменты HTML, CSS и JavaScript в верхний и/или нижний колонтитулы и выбирать, на каких страницах эти фрагменты будут загружаться:
Когда плагин активен, перейдите на страницу HFCM > Добавить новые фрагменты на панели инструментов. Здесь вы можете выбрать, какой тип сниппета вы хотите добавить, где он должен отображаться и добавлять ли его в верхний или нижний колонтитул:

Если вы планируете добавлять в заголовок новые элементы, вам потребуется использовать HTML. Чтобы изменить стиль заголовка и содержащихся в нем элементов, вы можете использовать фрагменты кода CSS.
Основным недостатком этого подхода является то, что вам нужно проверить код заголовка, чтобы увидеть, какие классы и идентификаторы он использует, чтобы добавить к ним CSS. Это может занять много времени, поскольку вы добавляете новые фрагменты кода, проверяете, работают ли изменения, и корректируете код, пока не будете довольны результатами.
Настройте заголовок WordPress сегодня
Редактировать заголовок WordPress проще, чем вы могли ожидать. Это связано с тем, что WordPress предлагает широкий спектр возможностей для настройки этого элемента, начиная от встроенных настроек вашей темы и заканчивая компоновщиками страниц. Все, что вам нужно сделать, это найти вариант, который вам наиболее удобен, и вы можете приступить к работе.
У вас есть вопросы о том, как редактировать заголовок в WordPress? Давайте поговорим о них в разделе комментариев ниже!