the_custom_header_markup()
Виводить HTML розмітку заголовка шапки – HTML код картинки та відео для шапки, встановлені в налаштуваннях кастомайзера.
Обертаючий <div> завжди відображається під час перегляду шаблону в кастомайзері. З цим <div> працює JS скрипт, який додає HTML-код відео.
HTML-код відео додається через JS нальоту, якщо відео є і воно підтримується браузером.
Використовуйте get_custom_header_markup() , коли потрібно отримати тільки HTML код зображення/відео заголовка, але не виводити його на екран і не підключати потрібні скрипти на сторінці.
Хуків немає.
Повертає
null. Нічого. Виводить HTML-код на екран, якщо є що виводити.
Використання
<?php the_custom_header_markup(); ?>
Приклади
#1 Виведемо картинку та відео заголовка
<?php the_custom_header_markup(); ?>
Для картинки виведе HTML:
<div id="wp-custom-header" class="wp-custom-header"> <img src="http://example.com/wp-content/uploads/2016/05/image.jpg" width="954" height="1300" alt="Тестовий сайт" srcset="http://example.com/wp-content/uploads/2016/05/image.jpg 954w, http://example.com/wp-content/uploads/2016/05/image-220x300.jpg 220w , http://example.com/wp-content/uploads/2016/05/image-768x1047.jpg 768w, http://example.com/wp-content/uploads/2016/05/image-751x1024.jpg 751w " sizes="(max-width: 954px) 100vw, 954px" /> </div>
Також підключить наступні скрипти до підвалу. Скрипти відповідають за показ відео, і вони будуть підключені лише якщо є відео заголовка і воно має відображатися на поточній сторінці.
<script type='text/javascript' src='http://example.com/wp-includes/js/wp-custom-header.min.js'></script> <script type='text/javascript' src='http://example.com/wp-includes/js/mediaelement/mediaelement-and-player.min.js'></script> <script type='text/javascript' src='http://example.com/wp-includes/js/mediaelement/wp-mediaelement.min.js'></script>
Підключені скрипти замінювати HTML код картинки на такий:
<div id="wp-custom-header" class="wp-custom-header"> <video id="wp-custom-header-video" autoplay="" loop="" width="954" height="1300" src="http://example.com/wp-content/uploads/2017/ 01/polina.mp4"></video> <button type="button" id="wp-custom-header-video-button" class="wp-custom-header-video-button wp-custom-header-video-play">Пауза</button> </div>
список змін
| З версії 4.7.0 | Введено. |
Код the_custom_header_markup() the custom header markup WP 6.0.2
function the_custom_header_markup() {
$custom_header = get_custom_header_markup();
if ( empty( $custom_header ) ) {
return;
}
echo $custom_header;
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() );
}
}