[Support request] CSS for button customization

Home Forums Support [Support request] CSS for button customization

Home Forums Support CSS for button customization

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #1610075
    Melissa

    Hello,
    I am using the tasty theme and would like to customize my buttons when I add them to a post. Can you give me a css code to input in the additional CSS section to have the background color of the button #CD81B3 and have the button aligned in the center?
    Thank you,
    Melissa

    #1610142
    Ying
    Staff
    Customer Support

    Hi Melissa,

    There’re more than one kind of buttons in the Tasty site, can you specify which button are you trying to style (Read more/ Learn more/ Submit etc)?

    Or are you talking about all of them?

    Let me know 🙂

    #1610149
    Melissa

    Hi Ying,
    I wasn’t aware that there were many buttons. I am referring to the button you add as a block.
    Melissa

    #1610228
    Ying
    Staff
    Customer Support

    You mean add button to your posts?

    If you are using the WordPress default Buttons block, you can set the button’s background color in the block editor, and also align it to center.
    https://www.screencast.com/t/7e0xiyJYo
    https://www.screencast.com/t/aaK9l79idk
    https://www.screencast.com/t/7e0xiyJYo

    Alternatively, you can use the Buttons block from GenerateBlocks that allow you with even more control of the appearance:
    https://docs.generateblocks.com/article/buttons-overview/

    Let me know if you need further assistance.

    #1610360
    Melissa

    I am using the wordpress default button block and customize it each time, which is pretty much every post.

    Rather than adding a button block and changing the background color and position each time, I would like to have them automatically default to the middle position and be the background color #CD81B3.

    Is it possible to add some CSS code to do this?

    #1610402
    Elvin
    Staff
    Customer Support

    Hi there,

    IF you want to style ALL default WordPress Button block the same way, you can use this CSS selector:

    a.wp-block-button__link.has-background {
        background-color: red;
    }

    Or if you want to style only the ones within the content area, you can use this:

    .entry-content a.wp-block-button__link.has-background {
        background-color: red;
    }

    A wise man once said:
    "Have you cleared your cache?"

    #1610436
    Melissa

    Thank you Elvin, that’s perfect! Do you happen to have a code to make the button have center justification every time?

    #1610465
    Elvin
    Staff
    Customer Support

    Thank you Elvin, that’s perfect! Do you happen to have a code to make the button have center justification every time?

    You can try adding in margin-left: auto; margin-right: auto; to the CSS so it’s always centered within its container. 🙂

    A wise man once said:
    "Have you cleared your cache?"

Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.