Дополнительное настраиваемое изображение заголовка

Вопрос или проблема

Кто-нибудь видел способ добавить новый заголовок заголовка в тему? Мне нужно добавить два настраиваемых изображения в тему. Не имеет значения, будет ли это добавлено как новое меню “Заголовок” в админке темы или будет добавлено в существующее меню Внешний вид->Заголовок.

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

Похоже на этот запрос

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

add_action( 'after_setup_theme', 'wpse_42529_add_header_images' );

function wpse_42529_add_header_images()
{
    register_default_headers( 
        array(
            'a_short_name' => array(
            'url' => '%s/images/headers/a_short_name.jpg',
            'thumbnail_url' => '%s/images/headers/a_short_name-thumbnail.jpg',
            'description' => __( 'Wheel', 'twentyeleven' )
        ),
        'another_image' => array(
            'url' => '%s/images/headers/another_image.jpg',
            'thumbnail_url' => '%s/images/headers/another_image-thumbnail.jpg',
            'description' => __( 'Shore', 'twentyeleven' )
        )
        )
    );
}

Знак %s будет заменен на URI каталога стилей. Вам не обязательно это использовать. Вы можете использовать plugin_dir_url( __FILE__ ) вместо %s.

Вы можете вызывать register_default_headers() несколько раз, она работает так же, как add_default_headers().

Обновление

Чтобы добавить новую страницу для пользовательских изображений, аналогичных пользовательскому заголовку, вы должны расширить класс Custom_Image_Header на странице параметров темы. Но этот класс сейчас на реконструкции прямо сейчас – практически невозможно написать устойчивый к изменениям код на основе этого. Я бы подождал WordPress 3.4 и построил код на более стабильной основе.
Ну … Я сделаю это, потому что, вероятно, мне это тоже нужно.

Другой способ: скопировать и изменить текущий класс вместо того, чтобы его расширять.

На это уже отвечали здесь раньше:

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

    <?php
        // Проверьте, был ли удален заголовок изображения
        $header_image = get_header_image();
        if ( $header_image ) :
            // Совместимость с версиями WordPress до 3.4.
            if ( function_exists( 'get_custom_header' ) ) {
                /*
                 * Нам нужно выяснить, какой минимальной ширины должно быть наше изображение.
                 * Этот результат будет предложенной шириной, если бы тема реализовывала гибкие ширины.
                 */
                $header_image_width = get_theme_support( 'custom-header', 'width' );
            } else {
                $header_image_width = HEADER_IMAGE_WIDTH;
            }
            ?>
    <a href="https://wordpress.stackexchange.com/questions/42529/<?php echo esc_url( home_url("https://wordpress.stackexchange.com/" ) ); ?>">
        <?php
            /*
             * Заголовок изображения.
             * Проверьте, является ли это постом или страницей, имеет ли она миниатюру и является ли она большой
             */
            if ( is_singular() && has_post_thumbnail( $post->ID ) &&
                    ( /* $src, $width, $height */ $image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), array( $header_image_width, $header_image_width ) ) ) &&
                    $image[1] >= $header_image_width ) :
                // Хьюстон, у нас новое заголовок изображения!
                echo get_the_post_thumbnail( $post->ID, 'post-thumbnail' );
            else :
                // Совместимость с версиями WordPress до 3.4.
                if ( function_exists( 'get_custom_header' ) ) {
                    $header_image_width  = get_custom_header()->width;
                    $header_image_height = get_custom_header()->height;
                } else {
                    $header_image_width  = HEADER_IMAGE_WIDTH;
                    $header_image_height = HEADER_IMAGE_HEIGHT;
                }
                ?>
            <img src="<?php header_image(); ?>" width="<?php echo $header_image_width; ?>" height="<?php echo $header_image_height; ?>" alt="" />
        <?php endif; // конец проверки на изображение поста или стандартный заголовок ?>
    </a>
    <?php endif; // конец проверки на удаленное изображение заголовка ?>

Ответ или решение

Как добавить дополнительные заголовочные изображения в тему WordPress

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

Шаг 1: Используйте hook для регистрации изображений заголовка

Для начала, вам надо будет использовать add_action(), чтобы зарегистрировать дополнительный заголовок. Приведем пример кода, который позволяет добавить два настраиваемых изображения заголовка:

add_action( 'after_setup_theme', 'wpse_add_custom_header_images' );

function wpse_add_custom_header_images() {
    register_default_headers( 
        array(
            'custom_image1' => array(
                'url' => '%s/images/headers/custom_image1.jpg',
                'thumbnail_url' => '%s/images/headers/custom_image1-thumbnail.jpg',
                'description' => __( 'Первое настраиваемое изображение', 'your-text-domain' )
            ),
            'custom_image2' => array(
                'url' => '%s/images/headers/custom_image2.jpg',
                'thumbnail_url' => '%s/images/headers/custom_image2-thumbnail.jpg',
                'description' => __( 'Второе настраиваемое изображение', 'your-text-domain' )
            )
        )
    );
}

В этом коде %s будет заменен на URI каталога стилей вашей темы или плагина. Вы можете использовать plugin_dir_url( __FILE__ ), если вы работаете в плагине.

Шаг 2: Добавление нового меню в админке

Если вам необходимо добавить новое меню в админ-панели для управления этими заголовками, вы можете использовать add_theme_page().

add_action('admin_menu', 'wpse_custom_header_menu');

function wpse_custom_header_menu() {
    add_theme_page(
        'Настройка заголовка',
        'Настройка заголовка',
        'edit_theme_options',
        'custom-header-options',
        'wpse_custom_header_options_page'
    );
}

function wpse_custom_header_options_page() {
    // Здесь будет HTML-код для отображения страницы с настройками
    echo '<h1>Настройка кастомных изображений заголовка</h1>';
}

Здесь вы создаете простую страницу настроек, где можете разместить дополнительные поля для управления заголовками.

Шаг 3: Отображение заголовков на сайте

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

$header_image = get_header_image();
if ($header_image) {
    // Проверяем наличие миниатюры для поста
    if (is_singular() && has_post_thumbnail($post->ID)) {
        echo get_the_post_thumbnail($post->ID, 'full');
    } else {
        echo '<img src="' . esc_url($header_image) . '" alt="" />';
    }
}

Заключение

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

В целом, добавление настраиваемых заголовков является отличным способом улучшить внешний вид и функциональность вашего сайта. Не забудьте следовать рекомендациям WordPress Codex и документации по API для обеспечения его совместимости с будущими версиями WordPress.

Оцените материал
Добавить комментарий

Капча загружается...