How to put different images on each page of a Joomla template with CSS…

[Eric101]

I am working with a Joomla 1.5 template. My URL is: http://www.feedbackforbusiness.com
The image I am focused on is the one in the upper right of each page. It’s actuall 2 images 1 over top of another. It is assigned through the css in the file “template.css”. Below is the actual section of css…..with notes….

/*

---

header—*/
#tail {
background:#17191c url(../images/gradient.gif) repeat-x 0 0;
}
#top {
height:88px;
}
#logo {
padding:0px 0px 0px 0px;
margin:0px 0px 0px 0px;
}
*****THIS IS WHERE THE IMAGES ARE*****
#header {
background:url(../images/header-bg.jpg) repeat-x 0 0;
}
THIS IS THE IMAGE ON BOTTOM
#header-bg {
background:url(../images/header.jpg) no-repeat right 0;
height:300px;
overflow:hidden;
}
#menu {
float:left;
width:290px;
height:300px;
background:url(../images/menu-bg.gif) no-repeat 0 0;
}
THIS IS THE IMAGE ON TOP
#slogan {
float:right;
margin:0px 0px 0px 0px;
padding:50px 345px 0px 0px;

---

Under here probably doesn’t matter but I included it just in case.
}
#mid {
background:#0a0d13;
height:62px;
overflow:hidden;
}
#topmenu {
margin:0px 223px 0px 0px;
}
#search {
float:right;
width:223px;
}

#boxes {
background:#111317 url(../images/boxes-bg.gif) no-repeat 0 0;
overflow:hidden;
width:100%;
}
#boxes .module h3 {
background:none;
border-bottom:1px solid #3d444f;
padding:0px 0px 10px 0px;
}
#boxes .module h3 span{
background:none;
font:normal 14px Arial;
color:#be7116;
padding:0px 0px 0px 0px;
}
#boxes .box-indent {
padding:25px 0px 35px 0px;
}
#boxes .space {
padding:36px 10px 10px 36px;
}
#boxes ul {
list-style:none;
}
#boxes li {
padding:0px 0px 5px 0px;
}
#boxes li a {
color:#7c828e;
padding:0px 0px 0px 20px;
background:url(../images/list-item2.gif) no-repeat 0 3px;
text-decoration:underline;
}
#boxes li a:hover {
text-decoration:none;
}

OK on each page or on different pages of the Joomla site I want different images to be in that same place.
How do I assign a different header section or images within the header section to the different page url’s.

In a regular HTML site I might have a different CSS file for each page but I can’t or don’t want to do that because this is Joomla.

How do I go about this?

Thanks,
Eric

[TheDoc]

You should be able to add some sort of class to the body. I’ve never used Joomla, but there should be a function to do that.

Also, having links to PDFs in what looks like a navigation is a huge usability no-no. I was offended that by simply clicking on what I thought was a link to an inside page, I was prompted to download a file.

[Eric101]

Thanks for the comments and criticism.

[standuncan]

I’m just learning Joomla, but if there isn’t a way to do it in the admin panel then I think you can open up your template file and modify the body tag. Or maybe on each category file? Possibly use:

">

or a variable and then define that variable on each page??

I’m sorta just making guesses in the dark at this point lol…

[Author]

Posts