Измените изображение в заголовке, загружаемое с помощью jQuery, чтобы использовать HTTPS.

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

В настоящее время URL выглядит так:

http://example.com/themes/abc/header.jpg

Я хочу изменить его на:

https://example.com/themes/abc/header.jpg

Плагины мне не помогают на этом конкретном файле (они преобразуют другие). Chrome сообщает, что заголовок загружается через jquery.js. Я не знаю, как jQuery делает это.

Я считаю, что редактирование functions.php может помочь, но как это сделать?

Вы рассматривали перезапись протокола? Код ниже преобразует все http: и https: в // для каждого скрипта, ссылки, базы и изображения. Поместите это в ваш functions.php:

add_action( 'plugins_loaded', 'wpse_232287_init' );

function wpse_232287_init() { // Инициализируем функцию
    ob_start( 'wpse_232287_remove_http' );
}

function wpse_232287_remove_http( $buffer ) {
    // Проверяем заголовок Content-Type, применяем переписывание только к "text/html" или неопределенному
    $headers = headers_list();
    $content_type = null;

    foreach ( $headers as $header ) {
        if (strpos( strtolower( $header ), 'content-type:' ) === 0 ) {
            $pieces = explode( ':', strtolower( $header ) );
            $content_type = trim( $pieces[1] );
            break;
        }
    }

    if ( is_null( $content_type ) || substr( $content_type, 0, 9 ) === 'text/html' ) { // Заменяем атрибуты 'href"https://wordpress.stackexchange.com/"src' в тегах script/link/base/img на '//'
        $return = preg_replace( "/(<(script|link|base|img|form)([^>]*)(href|src|action)=[\"'])https?:\\/\\//i", "$1//", $buffer );
        if ( $return ) { // При ошибке регулярного выражения, не перезаписываем содержимое
            $buffer = $return;
        }
    }
    return $buffer;
}

Чтобы изменить URL изображения заголовка на использование HTTPS, вы можете использовать jQuery для изменения элемента, который содержит изображение заголовка, и обновить его атрибут src. Вы можете добавить этот скрипт jQuery в файл js вашей темы или напрямую в нижний колонтитул вашей WordPress темы.

Темы WP уже включают jQuery, но если в вашей его нет, вы можете подключить его в файле functions.php вашей темы.

function my_theme_enqueue_scripts() {
    wp_enqueue_script('jquery');
}
add_action('wp_enqueue_scripts', 'my_theme_enqueue_scripts');

как только jQuery загружен, вы можете добавить скрипт для обновления URL изображения заголовка на использование HTTPS. Используйте файл functions.php в вашей теме (или дочерней теме, если существует) и добавьте этот код ниже.

function add_this_script_footer() { 
?>
<script>
jQuery(document).ready(function($) {
        // Находим элемент изображения заголовка, используя его класс или ID
        var headerImage = $('.parallax-header-image');
    
        // Проверяем, существует ли изображение заголовка
        if (headerImage.length) {
            // Получаем текущий URL изображения
            var imageUrl = headerImage.attr('src');
    
            // Заменяем 'http://' на 'https://' в URL изображения
            var secureImageUrl = imageUrl.replace('http://', 'https://');
    
            // Обновляем URL изображения заголовка на использование HTTPS
            headerImage.attr('src', secureImageUrl);
        }
    });
</script>
<?php } 
add_action('wp_footer', 'add_this_script_footer');

Замените .parallax-header-image на соответствующий селектор для элемента вашего изображения заголовка.