Magento Forum

Changing Background Colors in Header
 
evanluke
Jr. Member
 
Total Posts:  7
Joined:  2008-05-27
 

This is most likely really easy but I cannot seem to find the right place in the css.

Where do I change the background colors that are used in the global header.  Please see the attached screenshot where arrows are pointed to the areas that I am looking to modify.

Thanks so much!

-Evan

Image Attachments
magento-template.jpg
 
Magento Community Magento Community
Magento Community
Magento Community
 
storeonline123
Member
 
Avatar
Total Posts:  68
Joined:  2007-12-12
 

@ Evanluke
You would need to edit the boxes.css file located in /skin/frontend/default/default/css/boxes.css I also recommend getting these two tools it’s what i use to figure out the color hexes and what css files are being used. Use ColorPix to let you figure out the color hex that you currently have and than go to the boxes.css and just find that color hex by running a search.

ColorPix - Tells you the color hexes
Firebug - Helps you figure out CSS/HTML
Hope this helps.

 
Magento Community Magento Community
Magento Community
Magento Community
 
evanluke
Jr. Member
 
Total Posts:  7
Joined:  2008-05-27
 

Thanks for the response jvalen...i’ve been in that file to create the changes that you see.  I can’t seem to find the line of css that controls the particular “box” in the image.  Can you direct me to a specific object name in the boxes.css file?

 
Magento Community Magento Community
Magento Community
Magento Community
 
storeonline123
Member
 
Avatar
Total Posts:  68
Joined:  2007-12-12
 

@ Evanluke
If i am correct should be Line 386 with the title .header-top-container. Also i HIGHLY recommend those two apps.  grin

 
Magento Community Magento Community
Magento Community
Magento Community
 
evanluke
Jr. Member
 
Total Posts:  7
Joined:  2008-05-27
 

Whoah!! That Firebug program is awesome.  Would have taken me 10 times longer without it…

Thanks for the tip!!  Just to let people know the area that I was looking to change was part of the global body tag css which is located in the reset.css file.

Now I have to figure out why changes in the page.xml file aren’t reflecting in my main template…

 
Magento Community Magento Community
Magento Community
Magento Community
 
Brilliand
Member
 
Total Posts:  34
Joined:  2008-08-29
 
evanluke - 11 September 2008 12:09 PM

Whoah!! That Firebug program is awesome.  Would have taken me 10 times longer without it…

Thanks for the tip!!  Just to let people know the area that I was looking to change was part of the global body tag css which is located in the reset.css file.

Now I have to figure out why changes in the page.xml file aren’t reflecting in my main template…

Could be caching - that caused me some frustration.  Disable it under System -> Cache Management.

 
Magento Community Magento Community
Magento Community
Magento Community
 
evanluke
Jr. Member
 
Total Posts:  7
Joined:  2008-05-27
 

Yup it was the Cache...Thanks for the help!

 
Magento Community Magento Community
Magento Community
Magento Community
Magento Community
Magento Community
Back to top