Использование Backstretch для разных изображений для отдельных страниц

Question

Я надеюсь, что есть кто-то, кто может помочь. Я пытаюсь использовать jQuery Backstretch, чтобы применить разные фоновые изображения для каждой конкретной страницы в Bootstrap/Wordpress. например:

Главная страница - bg image a О программе - bg image b Новости - bg image c и так далее...

Мне удалось использовать стандартный сценарий Backstretch для отображения одного изображения для всех страниц, но я совершенно потерял (даже после поиска), как применить вышеупомянутое.

Мой код до сих пор:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="http://myurl.co.uk/wp-content/themes/wpbootstra/bootstrap/js/jquery.backstretch.min.js"></script>

<script>
    $.backstretch("http://myurl.co.uk/wp-content/themes/wpbootstrap/bootstrap/img/test_bg.jpeg");
</script>

Я использовал это в моем footer.php.

у кого-нибудь есть решение?

Answer 1

Вы можете попробовать:

<?php
if(is_page(42))
{
    echo '<script>$.backstretch("http://myurl.co.uk/wp-content/themes/wpbootstrap/bootstrap/img/test_bg.jpeg");</script>';
} 
else if(is_page(41))
{
    echo '<script>$.backstretch("http://myurl.co.uk/wp-content/themes/wpbootstrap/bootstrap/img/test_bg_b.jpeg");</script>';
}
?>

Число 42, 41 является идентификатором страницы. Sp text_bg_b.jpeg будет отображаться только на странице О нас (при условии, что его идентификатор равен 41).

Answer 2

1. Я думаю, что нет необходимости использовать backstretch: просто добавьте эти стили CSS встроенными в ваше тело или основной контейнер:

   background: url(PATHTOYOURIMAGE) center center no-repeat;

   background-size: cover;

2. Вы должны рассмотреть возможность использования настраиваемого поля для указания пути к вашему изображению. Я думаю, что самый простой способ - установить http://www.advancedcustomfields.com/ и добавить поле с именем bg_image на каждый сайт с URL-адресом изображения. Тогда вы можете заменить PATHTOYOURIMAGE с

   <?php the_field('bg_image'); ?>

Это другой способ, но я думаю, вы должны попробовать.