Задать вопрос
@ingeniero
css

Как задать фоновое изображение конкретной страницы сайта при помощи style.css?

Привет!
Сайт на WP. Дочерняя тема. Правки вносятся через style.css дочерней.

Подскажите новичку, как задать фоновое изобр. конкретной страницы сайта при помощи style.css?
Дело в том, что если по умолчанию задавать какие-то директивы в это файл, то изменения затрагивают только главную страницу. Задача же состоит в добавлении фона на другую страницу.
Нагуглил, что задать фоновое изобр. снизу страницы слева можно так:

body {
background: #000 url("image.jpg") no-repeat fixed left bottom;
}

Вопрос, как сделать это на отличной от главной странице?
  • Вопрос задан
  • 2854 просмотра
Комментировать
Подписаться 1 Оценить Комментировать
Решения вопроса 1
0example
@0example
У вас для каждой страницы в body добавляется класс этой страницы, например <body class="page-15">что соответствует странице с ID = 15, прописываете в style.css:
body.page-15 {background:url(ссылка на изображение);}
Ответ написан
7 комментариев
7 комментариев
Пригласить эксперта
Ответы на вопрос 3
iiiBird
@iiiBird Куратор тега CSS
Пока ты спишь - твой конкурент совершенствуется
для внутренних страниц для body задай класс к примеру .inner-page а потом bg вешай по этому классу
к примеру отредактировав header.php в шаблоне примерно так:
<?php if ( is_home() ) : ?>
	<body <?php body_class(); ?>>
<?php else : ?>
	<body <?php body_class('inner-page'); ?>
<?php endif; ?>>

а если тебе нужно сделать bg только на какой то одной странице сайта, то добавляй filter:
add_filter('body_class', 'add_body_class');
function add_body_class($classes){
	if ( is_single(62) )  //62 - id страницы.
		$classes[] = 'inner-page';
    return $classes;
}

p.s. и не слушай тех кто предлагает это делать через js на фронтенде
Ответ написан
3 комментария
3 комментария
politon
@politon
HTML5,CSS3,JS,PHP,SQL,API,canvas,animation...
Как вариант в шаблон вкинь ) Перед закрывающим body
<script>
   let hostUrl = window.location.href;
    if(hostUrl == 'http://твой_сайт.ru/'/*Здесь в зависимости от настройки apach для главной http://твой_сайт.ru/, http://твой_сайт.ru/index.html или  http://твой_сайт.ru/index.php вставь */){
        document.body.style.background = "#000 url(\"путь к картинке для главной\") no-repeat fixed left bottom";
    }else{
        document.body.style.background = "#000 url(\"путь к картинке для других страниц\") no-repeat fixed left bottom";
    }
</script>
Ответ написан
Комментировать
Комментировать
mrusklon
@mrusklon
Не получается? Яростно гугли!
если совсем совсем нет желания лезть в html , я бы лучше сделал на js , но самый простой вариант сделать доп. шаблон , а в него мудрить что угодно

я имею введу
<?php
/*
Template Name: Мой шаблон страницы
*/
?>
Ответ написан
Комментировать
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы
Вакансии с Хабр Карьеры
Fullstack Developer под Wordpress
Future Search
от 90 000 до 150 000 ₽
JavaScript FullStack разработчик
Rocket • Смоленск
от 80 000 до 130 000 ₽
Trainee - IT Support
move2usajobs LLC • Лос-Анджелес
от 2 000 до 4 000 $
Ещё вакансии
Заказы с Хабр Фриланса
Написание статей в нужном стиле ( интерьер, дизайн спальни etc )
25 нояб. 2024, в 15:01
1000 руб./за проект
Разработать телеграмм бота для заказа такси!!!
25 нояб. 2024, в 14:54
25000 руб./за проект
Нужен грамотный директолог
25 нояб. 2024, в 14:51
10000 руб./за проект
Ещё заказы