Change Button Colour

[diytravelhq]

How can I change button colours? I would like to make it black.

I added this CSS but it doesn’t work:

.x-btn.my-btn {
color: #000000;
border-color: #000000;
}

.x-btn.my-btn:hover {
  color: #ffffff;
  border-color: #600900;
} 

Button | Themeco Docs

[ruenel]

Hello Sheena,

Thanks for writing in!

You do not need a custom css to change the button styling. To change your button and its styling, please go to X > Theme Options > Buttons. You should be able to select the text color and the color of the text when hovered.

Hope this helps.

[diytravelhq]

Thanks - this method makes all my buttons the same colour & style though?

What code do I add so the link opens in a new window? Thanks. This is what I have now:

[button type=“flat” shape=“square” size=“x-large” href=“https://diytravelhq.com/travel-store/” title=“Example”]Enter[/button]

[paul.r]

Hi,

You can add target attribute to your button shortcode to make it open in New Window.

eg.

[button target="blank" type="flat" shape="square" size="x-large" href="https://diytravelhq.com/travel-store/" title="Example"]Enter[/button]

If you would like to style it individually, you can add a class attribute.

[button class="custom-button" target="blank" type="flat" shape="square" size="x-large" href="https://diytravelhq.com/travel-store/" title="Example"]Enter[/button]

Then you can style it using that class.

.x-btn.custom-button:hover {
     color: #ffffff;
     border-color: #600900;
}

For more information kindly refer to the link below

http://demo.theme.co/integrity-1/shortcodes/buttons/

Thanks