Изменить фоновое изображение - PullRequest
Новая
       35

Изменить фоновое изображение

1 голос
/ 02 января 2012

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

код такой.

HTML 

<body>
 <div id="wrapper">
  all content goes here
 </div>
</body>

CSS 

body{margin:0px; padding:0px;}

#wrapper{background:url(../images/bg-img.jpg) repeat-x;}

Ответы [ 4 ]

1 голос
/ 02 января 2012

Как упомянул Пурму, ни один из этих методов не будет работать, потому что Joomla использует тот же index.php из шаблона, поэтому каждая страница на сайте будет содержать класс CSS или идентификатор, если вы там кодируете.

К счастью для вас, Joomla принял это во внимание, и вы можете легко сделать то, что вы пытаетесь сделать, с помощью простого мода для вашего шаблона. Joomla использует так называемый суффикс класса страницы, чтобы позволить вам создавать CSS для конкретной страницы. Каждый раз, когда вы создаете элемент меню, у вас есть возможность включить суффикс класса страницы, который будет добавляться только к страницам в этом элементе меню. Чтобы поместить этот суффикс в тег body, чтобы вы могли достичь того, что вы пытаетесь сделать, добавьте этот код в ваш index.php в своем шаблоне: 

<?php
$app = JFactory::getApplication('site');
$params =  & $app->getParams('com_content');
$pageclass = trim($params->get('pageclass_sfx'));
?>
<body id="<?php echo $pageclass ? $pageclass : 'default'; ?>">

Если вы добавите суффикс класса страницы к пункту меню, он будет вставлен как идентификатор тега body. Если вы этого не сделаете, он будет использовать вместо «по умолчанию». Таким образом, вы можете управлять идентификатором тела для каждой страницы и изменениями, характерными для каждой страницы сайта.

1 голос
/ 02 января 2012

Дайте ID в вашем body, затем определите css для этой страницы.

Как это:

HTML: 

<body id="home">
 <div id="wrapper">
  all content goes here
 </div>
</body>

CSS: 

#home #wrapper{background:url(../images/bg-img.jpg) repeat-x;}
#wrapper{background:red}
0 голосов
/ 02 января 2012

Вы также можете использовать класс. 

 <body>
 <div id="wrapper" class="home">
 all content goes here
</div>
</body>

CSS: 

 #wrapper{}
 .home {background:url(../images/bg-img.jpg) repeat-x;}

Если вы будете использовать фон на (#wrapper), это будетпереписать свойство класса .home, поэтому убедитесь, что вы будете использовать фон в (.home) классе

0 голосов
/ 02 января 2012

Создайте вторую оболочку (только на вашей домашней странице) с идентификатором «homepage_wrapper» и используйте CSS, чтобы установить для этого фон.

...