Zen Cart Logo
Forums / Templates, Stylesheets, Page Layout / How to change this button color?

How to change this button color?

Views: 2,652

Results 1 to 10 of 10
6 Mar 2011, 11:05 AM
#1
wilsonshen avatar

wilsonshen

New Zenner

Join Date:
Apr 2010
Posts:
53
Plugin Contributions:
0

How to change this button color?

Hi, all:
I have a problem. It might be easy. But i don't know much about web programming. So i hope some one can help me.
I installed COWOA in my new shop. However, i found some buttons are hard to be located because of the button color.
Here is my new store: https://www.elechouse.com/store/
To make it clear, please add any product to the shopping cart and check out. Well, you might feel hard to find the "log in"button in right-bottom of the "Returning Customers" box until you put mouse on that, and also another "continue" button in the right-bottom of the "Checkout Without Account"box.
I want to change those buttons to another color, maybe black. Please tell me how.
Thanks

6 Mar 2011, 3:59 PM
#2
haredo avatar

haredo

Totally Zenned

Join Date:
Apr 2006
Location:
Texas
Posts:
6,185
Plugin Contributions:
0

Re: How to change this button color?

Wilson,
Look like you are using Template Monster (TM).
To find the button folder> includes/ template/ gadgets_black/ buttons/ english/ buttons

  1. http:// www. elechouse.com /store/index.php?main_page=login&action=process
  1. You will have to recreate the buttons
  1. button_login.gif
  1. button_create_account.gif

Need a hand with Zen Cart? Hire the team at myZenCartZone.com for upgrades, repairs, and custom plugins.

Zen Cart Certified hosting at myZenCartHost.com.

6 Mar 2011, 4:11 PM
#3
keneso avatar

keneso

Totally Zenned

Join Date:
May 2009
Posts:
1,273
Plugin Contributions:
3

Re: How to change this button color?

Line 99 of stylesheet_css_buttons
includes/templates/gadgets_black/css/stylesheet_css_buttons.css
find this

span.button_add_address, span.button_continue {
    background: url("../images/marker-right.png") no-repeat scroll 96% 5px transparent;
    padding: 3px 22px 0 7px !important;
}

change it to this

span.button_add_address {
    background: url("../images/marker-right.png") no-repeat scroll 96% 5px transparent;
    padding: 3px 22px 0 7px !important;
}

span.button_continue {
    background: url("../images/marker-right.png") no-repeat scroll 96% 5px #000000;
    padding: 3px 22px 0 7px !important;
}
6 Mar 2011, 4:59 PM
#4
haredo avatar

haredo

Totally Zenned

Join Date:
Apr 2006
Location:
Texas
Posts:
6,185
Plugin Contributions:
0

Re: How to change this button color?

keneso:

Line 99 of stylesheet_css_buttons
includes/templates/gadgets_black/css/stylesheet_css_buttons.css
find this

span.button_add_address, span.button_continue {
background: url("../images/marker-right.png") no-repeat scroll 96% 5px transparent;
padding: 3px 22px 0 7px !important;
}

> ```
span.button_add_address {
    background: url("../images/marker-right.png") no-repeat scroll 96% 5px transparent;
    padding: 3px 22px 0 7px !important;
}

span.button_continue {
    background: url("../images/marker-right.png") no-repeat scroll 96% 5px #000000;
    padding: 3px 22px 0 7px !important;
}

@Keneso
There is no change the values are the same under the declartion ?

Need a hand with Zen Cart? Hire the team at myZenCartZone.com for upgrades, repairs, and custom plugins.

Zen Cart Certified hosting at myZenCartHost.com.

6 Mar 2011, 5:12 PM
#5
keneso avatar

keneso

Totally Zenned

Join Date:
May 2009
Posts:
1,273
Plugin Contributions:
3

Re: How to change this button color?

@haredo

I'm not sure I understand what you mean, when I tried in firebug, it makes the button background black like requested

span.button_continue {
background: url("../images/marker-right.png") no-repeat scroll 96% 5px #000000;
padding: 3px 22px 0 7px !important;
}

Have I got it wrong?
I know, and respect your expertise, please advise.

6 Mar 2011, 5:33 PM
#6
haredo avatar

haredo

Totally Zenned

Join Date:
Apr 2006
Location:
Texas
Posts:
6,185
Plugin Contributions:
0

Re: How to change this button color?

@Kensen
Sorry I had a hick-up in firefox was a cache issue ...

Need a hand with Zen Cart? Hire the team at myZenCartZone.com for upgrades, repairs, and custom plugins.

Zen Cart Certified hosting at myZenCartHost.com.

7 Mar 2011, 11:47 AM
#7
wilsonshen avatar

wilsonshen

New Zenner

Join Date:
Apr 2010
Posts:
53
Plugin Contributions:
0

Re: How to change this button color?

@Kensen & @@haredo

Thanks for your help. It is great.
I found there are many button problems on my web. Would you please me how to locate the code of the problem button? So i can find them all and change them.
Also, if i want to change the words to black, not background color, is there any way to make it?

Thanks to you two. I really appreciate your help.

7 Mar 2011, 1:53 PM
#8
keneso avatar

keneso

Totally Zenned

Join Date:
May 2009
Posts:
1,273
Plugin Contributions:
3

Re: How to change this button color?

You're welcome.
Use firefox and the "web developer" and/or "firebug" add-ons for it.
Google chrome too thru its options has tools for the developer, and I understand ie8 too, though I never use this last one.

7 Mar 2011, 2:09 PM
#9
keneso avatar

keneso

Totally Zenned

Join Date:
May 2009
Posts:
1,273
Plugin Contributions:
3

Re: How to change this button color?

Also, if i want to change the words to black, not background color, is there any way to make it?

That is

color: #000000;

10 Mar 2011, 5:57 AM
#10
wilsonshen avatar

wilsonshen

New Zenner

Join Date:
Apr 2010
Posts:
53
Plugin Contributions:
0

Re: How to change this button color?

Thanks so much.
I fixed it.
Gratitude