I am redesigning my site and was wanting to make some minor changes to the product pages and shopping cart.
Mostly just colors, font and columns for the products.
I thought I read somewhere that I would want to create a new CSS for stuff like this so it will remain and not be replaced when I update.

Is this correct? If so - can you please show a link where this is discussed as I can not seem to find it.
I did find a tutorial video about making the changes by using a firefox extension - but wouldn't these changes be overridden when I update?

Thanks for any info!

Hi RatFink
Normally your site setup would include the core ECT style sheet which is css/ectcart.css and your own site stye sheet which is typically (but not always) css/style.css. What you want to do is add any changes to your site style sheet and not ectcart.css as the ectcart.css is the one which will be overwritten by updaters.

Vince

Click Here for Shopping Cart Software
Click Here to sign up for our newsletter
Click Here for the latest updater

Thanks for the reply. I forgot to mention that I am using the generic shopping cart.
Also - the types of things that I would like to change are like the color of the checkout buttons.

In your demo site here: http://www.ectdemostore.com/responsivemonochrome/proddetail.php?prod=magicthumbscroll
the "add to cart" and "checkout" buttons are black and switch to yellow when the mouse pointer is over them.

I would like to do the same to my cart (Mine is blue and gray).

Would I still follow your same method to make sure any changes are not overwritten by the update?

Would this also be the same for if I would like to adjust layout - like how many rows/columns?

Thanks!

Hi RatFink
The generic template by default has a style sheet in css/generic.css which really just has the bare minimum for the generic design. The generic design is just meant to be a placeholder for your own design so you can use that style sheet as a starting point or throw it away and use your own.

To style your own buttons try something like this...

input.ectbutton,button.ectbutton{
background:#333;
color:#fff;
}
input.ectbutton:hover,button.ectbutton:hover{
background:#FCA218;
color:#000;
}

All the cart buttons have the "ectbutton" class, and some are "input type=button" where others are "<button>Button Text</button>" tags so that's why you need to set the style for both input and button.

Vince

Click Here for Shopping Cart Software
Click Here to sign up for our newsletter
Click Here for the latest updater