Button Shortcode for Sidebar Widget

I know there is a page of sample shortcodes for the buttons, but I want to add several things to the code and don’t know what code to insert.

  1. I would like the button to go full width.
  2. I would like to remove the shadows from text.
  3. I would like to make the font 700 - Bold (currently using Lato sitewide) at 1.29 EM size.

What do I need to add/change to this code to accomplish that?

[button type=“flat” shape=“square” size=“large” href="#example" title=“Example”]Square Button[/button]

Thanks!

Hello Kevin,

Thanks for writing in!

You can make use of a custom css together with the button shortcode.
You’ll have to use this shortcode:

[button class="my-button" type="flat" shape="square" size="large" href="#example" title="Example"]Square Button[/button]

And then, please add the following CSS code in the X > Theme Options > Global CSS (http://prntscr.com/evui3r)

.x-btn.my-button {
  display: block;
  width: 100%;
  text-shadow: none;
  font-weight: 700;
}

We would love to know if this has worked for you. Thank you.

Thanks @RueNel, but it still looks like the standard button code in the widget. It doesn’t go 100% width. I have your CSS code in place.

I don’t know why… but now it seems to work. Thanks for the help!!

Glad to hear that. :slight_smile:

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.