Change Logo for Index Page Using CSS?

[kuroi]

The header background image is usually controlled by your stylesheet, not the template or labguage files.

To use a different one on the about_us page only, you could create a very small about_us.css file that over-rides the background_image for the logoWrapper. Put it in the same directory as your stylesheet.css and Zen Cart will automatically pick it up and use it on that page only.

[Sawhorse]

The header background image is usually controlled by your stylesheet, not the template or labguage files.

To use a different one on the about_us page only, you could create a very small about_us.css file that over-rides the background_image for the logoWrapper. Put it in the same directory as your stylesheet.css and Zen Cart will automatically pick it up and use it on that page only.

Kuroi, it worked like a champ!! How in the world did ZC know that the css was just for the about_us page. Did it key in on the fact that the css file was called about_us.css? If the answer is yes, (which I assume it will be), can I assume that any defined page can have a separate css file and all you need to do is use the defined page name to implement a new stylesheet for that page (i.e. links.css for the links defined page or privacy.css for the privacy notice defined page, etc.)?

Again Thank you. (I bet a lot of others will benefit from this info)

Sawhorse

[Kim]

Zen uses some very sophisticated code to auto-magically find things. If you check your includes/templates/template_default/css/ for the CSS readme.txt - it gives the bases of per page CSS

[Sawhorse]

Kim,
Found it - readme_css_system.html below is just part of the text so others can see the system. Very nice.

Zen Cart Stylesheets

Zen Cart(tm) stylesheets are located in this folder: /includes/templates/YOUR_TEMPLATE/css
What follows is a description of how one can use Zen Cart's built-in power to pull certain stylesheets for certain conditions.

The CSS files are sent to the browser in this order: (and alphabetically within each case of more than one match):

style*.css // are always loaded and at least ONE should contain site-wide properties.

language_stylesheet.css // changes to ALL pages, when that language is used

page_name.css // changes to one page (use index_home.css for "just the home page")

language_page_name.css // changes to one page, when that language is used

c_??.css // changes to all info pages in a category

language_c_??.css // changes to all info pages in a category, when that language is used

m_??.css // changes to a manufacturer's listing page

language_m_??.css // changes to a manufacturer's listing page, when that language is used

p_??.css // changes to a product's info page

language_p_??.css // changes to a product's info page, when that language is used

print*.css // printer-friendly global usage site-wide changes for printing-only

again the above is just a portion of the text file.

Thanks,
Sawhorse

[Sawhorse]

Kuroi, Kim & others,

The about_us.css works great, however my template is a bit different. I used a psd file and sliced it up (used ImageReady) to make my homepage. The header image area really has two/three main images. The largest image is indicated in the about_us.css but the other two are used in the tpl_main_page.php (the main purpose is for the change of the log in/log out tab. That slice includes a bit of background found in the lower part of the total header. (sorry about the amount of detail).

Anyway, can I make a new file like tpl_about_us_page.php to include the two new slices that help make up the the new header? Will ZC correctly recognize this new file for only the about_us defined page?

I hope I am making myself clear.

Sawhorse