Wordpress - изображение баннера случайной страницы

Question

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

Я использовал следующий код в своем файле functions.php -

add_filter('body_class','random_background_images');
function random_background_images($classes) {

    // Generate Random number from 1 to 10.  
    $background_class = 'background_' . rand(1,10);

    $classes[] = $background_class;

    return $classes;
}

, а затем это в моем файле custom.css -

body.background_1 {
   background-image: url("images/home-bg/website-background1.jpg");
}
body.background_2 {
   background-image: url("images/home-bg/website-background2.jpg");
}
body.background_3 {
   background-image: url("images/home-bg/website-background3.jpg");
}

кажется, что работает, но помещает изображение в качестве фонового изображения, а не баннера. Может кто-нибудь помочь мне изменить этот код, чтобы он применялся к разделу с баннерами?

(Текущий баннер устанавливается из внешнего интерфейса с загруженным изображением в настройках «домашней» страницы.

Веб-сайт - https://flowersforeveryone.feedmybeta.com/

Спасибо! :)

Answer 1

Так что это будет зависеть от HTML для баннера. Предполагая, что баннер имеет класс .page-banner, вы можете слегка изменить свой CSS следующим образом:

body.background_1 .page-banner {
   background-image: url("images/home-bg/website-background1.jpg");
}

body.background_2 .page-banner {
   background-image: url("images/home-bg/website-background2.jpg");
}

body.background_3 .page-banner {
   background-image: url("images/home-bg/website-background3.jpg");
}

В CSS селектор, следующий за пробелом, является дочерним по отношению к предыдущему селектору.