Posting in the Magento forums has been disabled pending the implementation of a new and improved forum solution which should better serve the community.

For new questions please post at magento.stackexchange.com, the community-run support site for the Magento community. We will be providing updates on the new forum solution soon. For questions or concerns please email community@magento.com.

Magento Forum

Does CSS control ALL images seen on the front end? 
 
Darren E
Member
 
Avatar
Total Posts:  54
Joined:  2008-05-23
The Woodlands, Texas
 

EDIT: I found what I was looking for-

The entire layout refers to a css file called “boxes.css”

Editing this CSS file is giving me the results I desire until I really get a good grasp of how to use this.

I’m trying to customize the store’s background colors and images but there are a few things I cannot find…

Are ALL graphics and background colors assigned via CSS?
If so, why can I not find the correct CSS files that point to these graphics or backgrounds?

For instance, I changed ‘header_top_container_bg.jpg’ but there still remains this blue header image somewhere and it’s driving me insane. Is Magento using a “large borders as a background color” technique? (I sure hope not...)
I would like to re-design the graphics of the layout but it seems less intuitive than I had hoped. I am a huge fan of CSS but not when a page refers to 6 different links.
If anyone can shed some light on this OTHER than pointing me to the “Designers Guide to Magento” it would be greatly appreciated.

 
Magento Community Magento Community
Magento Community
Magento Community
 
Darren E
Member
 
Avatar
Total Posts:  54
Joined:  2008-05-23
The Woodlands, Texas
 

http://www.lisacaroldesigns.com/

This is my test site which I am referring my questions to…

EDIT: Ignore my frustrations earlier…

My first thing was to figure out how to style the darn thing and as I have come to learn - the major styling of your store can be found here:

/skin/frontend/default/default/css/boxes.css

Now I understand the whole thing about making a theme directory but as far as this site goes - I just wanted to be able to modify the layout and graphics....

I could not find where to actually STYLE the site anywhere in the design guide but now that I have found it, I feel like I have more control than I did earlier…

 
Magento Community Magento Community
Magento Community
Magento Community
 
lotusseedsD
Mentor
 
Avatar
Total Posts:  1144
Joined:  2007-08-31
 

probably in the reset.css file.

Look for a or a:link

 
Magento Community Magento Community
Magento Community
Magento Community
 
Darren E
Member
 
Avatar
Total Posts:  54
Joined:  2008-05-23
The Woodlands, Texas
 

Ok Ok Ok!! I figured it out....

Oddly enough, in order for me to effectively style how I want the page to look, the CORRECT place to find your layout is HERE:

boxes.css

EDIT: changed the page because this is what you need to modify to change the look of your layout.

 
Magento Community Magento Community
Magento Community
Magento Community
 
lotusseedsD
Mentor
 
Avatar
Total Posts:  1144
Joined:  2007-08-31
 

But it should be in the ‘skin/frontend/default/default/style_sheet.css’ by default.

or ‘skin/frontend/default/your_custom_theme/style_sheet.css’

In the admin, System > Configuration > Web, and you check the ‘Base Skin URL’

If you have a custom theme, then in the System > Configuration > Design, you name your theme (Package), and enter the url paths for your theme

 
Magento Community Magento Community
Magento Community
Magento Community
 
Darren E
Member
 
Avatar
Total Posts:  54
Joined:  2008-05-23
The Woodlands, Texas
 

In my case - boxes.css contains everything I needed to style my page so far.

I know I’m not following the convention to the exact standards but so far, it’s what I needed to get the desired results.
I’m a little more confident in this product now…

Thanks!

 
Magento Community Magento Community
Magento Community
Magento Community
 
magento-marie
Member
 
Avatar
Total Posts:  37
Joined:  2008-06-01
France
 

Hi Darren,

If you need a hint, you can use Firefox and its extension called “Firebug” (just google it).
Once installed, it will allow you to point elements in your website (just press the “inspect” button of Firebug and hover the element you want to know more about).
And you will be able to know which style applies to what, and particularly in which stylesheet!!!

Good luck!

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