Функция get_custom_header_markup()
используется для получения HTML-разметки, связанной с кастомным заголовком (header) сайта, включая изображение или видео. Она возвращает разметку заголовка в виде строки, которая может быть выведена в шаблоне темы.
Функция возвращает HTML-код для кастомного заголовка сайта. Разметка заголовка может включать изображение и, если доступно, видео. В кастомайзере контейнер <div>
с разметкой заголовка будет всегда выводиться, даже если заголовок не настроен.
Если на сайте активирован видео-заголовок, для его корректного отображения нужно подключить соответствующий скрипт.
get_custom_header_markup(): string
Параметры
Функция не принимает параметров.
Возвращаемое значение
Функция возвращает строку с HTML-разметкой кастомного заголовка на сайте. Если заголовок не настроен, функция вернёт пустую строку (за исключением случая в кастомайзере, где контейнер всегда будет присутствовать).
Пример использования
// Получаем HTML разметку кастомного заголовка
$html = get_custom_header_markup();
// Выводим разметку
echo $html;
Пример использования с видео-заголовком
Для корректного отображения видео-заголовка на странице необходимо подключить скрипты, если заголовок поддерживает видео:
if ( is_header_video_active() && ( has_header_video() || is_customize_preview() ) ) {
wp_enqueue_script( 'wp-custom-header' );
wp_localize_script( 'wp-custom-header', '_wpCustomHeaderSettings', get_header_video_settings() );
}
// Получаем и выводим разметку кастомного заголовка
echo get_custom_header_markup();
Этот код подключает необходимые скрипты для видео-заголовка и выводит разметку заголовка.
Основные функции, используемые вместе с get_custom_header_markup()
has_custom_header()
— проверяет, установлен ли кастомный заголовок в текущей теме.is_header_video_active()
— проверяет, активен ли видео-заголовок на текущей странице.has_header_video()
— проверяет, установлен ли видео-заголовок.
Пример вывода заголовка с изображением
Пример использования функции для вывода изображения заголовка:
// Получаем и выводим HTML разметку заголовка (если заголовок установлен)
if ( has_custom_header() ) {
echo get_custom_header_markup();
}
Пример HTML-кода
При использовании функции с установленным изображением заголовка, вывод может выглядеть следующим образом:
<div id="wp-custom-header" class="wp-custom-header">
<img src="http://example.com/wp-content/uploads/2021/05/header-image.jpg" width="954" height="1300" alt="Мой сайт"
srcset="http://example.com/wp-content/uploads/2021/05/header-image.jpg 954w,
http://example.com/wp-content/uploads/2021/05/header-image-small.jpg 220w,
http://example.com/wp-content/uploads/2021/05/header-image-medium.jpg 768w"
sizes="(max-width: 954px) 100vw, 954px" />
</div>
Этот HTML-код создаётся на основе загруженного изображения заголовка, и, если это необходимо, он поддерживает адаптивные изображения через атрибуты srcset
и sizes
.
Использование в кастомайзере
В режиме Customizer, даже если заголовок ещё не установлен, контейнер <div>
для заголовка будет выводиться, чтобы дать визуальное представление пользователю:
<div id="wp-custom-header" class="wp-custom-header">
<!-- Здесь будет заголовок, если он установлен -->
</div>
Заключение
Функция get_custom_header_markup()
предоставляет удобный способ получения и вывода HTML-разметки для кастомных заголовков, которые могут включать как изображения, так и видео. Для поддержки видео-заголовков важно подключать необходимые скрипты с помощью функции wp_enqueue_script()
, чтобы они корректно отображались на сайте.