Changing colors of buttons on plug-in field

Illdy
#1

Hi,
I love your theme and build a nice website with it, hope you like it! I have one thing I would like to change om my website.

My questions is as followed:
The buttons on some pages are yellow, and i want them to be blue. It seems there is a color i can’t change in the customizer and where i can’t change the style of the buttons directly because they come from a plugin/short code (contact form, woocommerce pages etc) and so they remain yellow. Seems like there is a ‘theme color’ I can’t change in the customizer where the buttons fall back to. I would like them to be blue (#1e73be) with white font.

The pages I mean are:
Webshop - Start Hiking (shop page + all the category, product, cart and checkout pages)
Contactformulier - Start Hiking
Aanvraagformulier verhuur - Start Hiking

Can you provide some custom CSS to fix that?

Kind regards,
Mathias

#2

Good evening

Mathias, you wanted to say links or buttons?

try this code in appearance > customize > additional css:

.markup-format a {
color: #1e73be;
}

#comments #respond .comment-form #input-submit, input[type=submit] {
background-color: #1e73be;
}

#3

Hi Noda,

Thanks for your response!
I mean all buttons: on the contact forms and on the shop page, cart page and checkout page.

I tried your code, but it turns the buttons completely blue - including the font - so you cant read them anymore. I only changes the buttons on the contact forms, but not on the shop page/cart page/checkout page.

Is there any other way to get the buttons to blue (#1e73be) with white typefont?

The markup was not what I meant but that looks nice in blue too, so that’s a nice bonus! :slight_smile:

Thanks in advance for your help, hope you have a tip to get the buttons in the right style.

Kind regards,
Mathias

#4

Good morning Mathias

Yes, we just need to add color code in the css :slight_smile:

#comments #respond .comment-form #input-submit, input[type=submit] {
background-color: #1e73be;
colo:white;
}

#5

Hi Noda,

Thanks, that’s perfect. It worked on the contact forms!

However, the woocommerce pages (www.starthiking.nl/maaltijden) are still the old color. How do I change the yellow buttons on the shop pages to blue + white? If that is possible?

Kind regards,
Mathias

#6

Good evening Mathias :slight_smile:

Please try this code and let me know if we killed it :slight_smile:

.woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .woocommerce div.product form.cart .button, .woocommerce #review_form #respond .form-submit input, .woocommerce-cart .wc-proceed-to-checkout a.checkout-button, .woocommerce #payment #place_order, .woocommerce-page #payment #place_order {
background-color: #1e73be;
}

#7

You killed it!
Thanks, looks great now! The hoover color is still yellow, but I actually like it very much - the blue with yellow combi - so I’ll change the hover color for the rest of the site to that yellow. Awesome! Love my website thanks to your theme!

One small last question if it’s ok?
I added this custom CSS:
/Header 2 font size/
h2 {
font-size: 15px;
}

To make the ‘winkelmand - totalen’ header (total in cart) on the cart page smaller. But it also affects the header of the blog page and product category pages (not other pages). Is there something I can do to 1) make cart totals smaller 2) without affecting other headings?

Kind regards,
Mathias

#8

Good morning Mathias

Wait, remove that code, give me a page url and let me know which text you want to style and how, i will create custom css for that page

#9

Good morning Noda,

Ok, thanks! I removed that code.
The page I mean is: Mand! - Start Hiking

The heading totals ‘winkelmand - totalen’ is in such a big font, it’s out of proportion. A bit smaller and in proportion would be awesome.

Kind regards,
Mathias

#10

Good evening Mathias :slight_smile:

here we go:

.cart_totals h2 {
font-size: 16px;
}

#11

Awesome, thank you! Looks beautiful!
Thanks you so much for your support and awesome theme - did never expect I could make a site so beautiful and with so much functionality without coding knowledge. Thanks! :slight_smile:

#12

You are welcome Hiker :slight_smile:

Yes indeed today its really not hard to create beautiful sites
I will close this case, you can open a new ticket if you need anything else