4.0.1 How to change CSS

Using 4.0.1. Easy to get started and install. But totally confounded by the CSS now. base.css, style.css, scheme.less, the 'standalone.css', none of these files seem to make any changes. I have carefully made changes to all these files to test and nothing does anything. What CSS files are being used?

I am using the trial full version and have not purchased yet, but the add-on “My Changes” is disabled and greyed out, so I can not test that, a few members have said to just add any custom CSS to the my_changes.css file in the add-on and it works. So IF I get the add-on, does all CSS in the my_changes file override all the other CSS as long as I have the !important?

Actually, the main thing I want to do is simply add a background image to the header, seems that should be SO simple. I love the new built-in design editor, but shoot, why cant we add an image as a background to more areas then just the page background?

Thanks for any help…


Changing those CSS files will work (in the full version anyway and I don't see why the trial should be different) but you must have the Rebuild Cache automatically set to On in Design/Template Editor.

So far I haven't come across a style I can't override using the my_changes. Really it shouldn't be necessary to use the !important tag but there seems to be an issue with the order in which the CSS files are compiled into the single one so it's required for some styles to work.

In the layouts editor you can specify styles associated with each grid or block. Might be worth adding it there rather than overriding a base style. Never tried it for an image though so it might now work.

Good luck, It really is worth the effort. I've made more progress with 4.0.1 in the last two weeks than I did in 6 months of trying to understand my previous cart.

Thanks again for your help and the answer Nairdacart. You are right, I did not have the Rebuild cache turned on. But I used the my_changes addon anyway as I never did like the idea of changing base.css and style.css because of upgrades in the future. I got the my_changes working thanks to your reply to below post.

Anyone else need help with the my_changes addon, see this post:

[url=“4.0.1 How to change CSS - General Questions - CS-Cart Community Forums”]4.0.1 How to change CSS - General Questions - CS-Cart Community Forums



sorry - this is the post that explains how to use the my_changes:

[url=“Version 4 Theme Editing beyond built in editor - General Questions - CS-Cart Community Forums”]Version 4 Theme Editing beyond built in editor - General Questions - CS-Cart Community Forums

Can someone explain to me how my changes works? I figured out the directories, but I'm confused by the CSS

sheet that you have to upload. I wouldn't take the CSS from firebug because it is written differently than the CSS with the cart system right? I'm trying to change a lot of things, but the cart designer doesn't take care of the gradients. Any help would be greatly appreciated.

You just put normal everyday CSS into your own style sheet pointed to by the my_changes tpl file. The CSS from firebug is a good starting point as that will tell you what classes you need to override.

What I tend to do is to use the FireFox built-in inspector (I prefer it to FireBug but you can use that) to edit/turn off/add styles until I get near to what I want and then I put that in my CSS file and refine it.

I also use the On-site template editing feature to see which tpl files go with each section and then work out the CSS classes from there,

All depends on what you level of CSS is and what you feel most comfortable with there are many ways of doing it.