HI,
I have successfully used the #topcolour div command in the custome CSS to modify and place the image background that I wanted, but now I am looking for a way to have a different image for each template style I have created. Is there a way to point to a specifically named template style?

Hi

What template are you working wth?

Cheers
Paul

Nebula from joomlabamboo
And I have saved few different template style for which I like to assign different background

Hi

you can assign a header image per theme via theme magic

or you could target per page of the site as required

using the body class followed by the styling

Cheers
Paul

OK, I tried the theme magic but I cannot control the image position so I prefer the CSS #topcolour div command here the one I am using:
#topcolour {
background: #fff url("../images/header/Tuna.jpg") center top;
}
This isin the custom CSS for the template NEBULA for which I have saved few styles named:
Nebula - Tuna
Nebula - Default
Nebula - Default (2)
Can you please show me how you would modify the line to change the header image only to the "Nebula-Tuna".
Much appreciate your help
Thanks

Hi

One way you could try would be to use the injection tab option and adding a style tag and have your styling after it

<style>
#topcolour {
background: #fff url("../images/header/Tuna.jpg") center top;
}
</style>

This would be added to the before </head> option

You might need an !important after center top

Cheers
Paul

Hi,
Well the style injection before /head work only for full color but not for the image background and it is also injecting on the main Nebula template common to all template styles it is not specific to each style...
Any other ideas? ...

sorry about that - we're checking on this one

Can you try the extra scripts in the template version tuna

e.g.

<style type="text/css">
#topcolour {
background: #fff url("../images/header/Tuna.jpg") center top;
}

</style>


This works for me if use a none for the background

Cheers
Paul

Same issue; the plain color works but the image do not show on the top-background and the tab injection interface is applying the tab to all the templates at the same time ...

Remove the injection code

The path will need to change to relfect the different folder path

Depending on the pages the template is assigned to you may want to try adding the body class for the page

.itemid-101 #topcolour {background etc; }

for me trying it locally on the home page I had

.itemid-101 #topcolour {background: #fff url(../../../images/header/trees.jpg) center top;}

Cheers
Paul

I feel so stupid and so lost on the same time... the moment you mentioned "PAGE" I've got lost, because I have been searching for my precious pages or its equivalent ever since I started the Joomla adventure and all I see is an tricky mesh of PHP, CSS, LESS and others but no more "page" named html like I'm used to...?!

Where can I find a Page amount these articles, contents, items, and so forth that are cross listed on each menus?

I though that the solution would lie on making different template style for each main product but I cannot control the top background and my client will not like it...
Please be patient and explain me again where do you inserted this new .itemid-101 #topcolour ? For homepage and where would you insert it for let say any other main menu item?

It's 11:20PM here its time for me to go home , I'll read you tomorrow
Thanks

Each page on the website will have its own itemid-??? inside the body class

This means any css with styling after this class is unique to a particular page

This of course might be unwieldy if new pages are created by the client

the homepage example I gave is

.itemid-101 #topcolour {background: #fff url(../../../images/header/trees.jpg) center top;}

Cheers
Paul

It works!
Thank you!

Hurrah

Thanks for the update

Cheers
Paul