Okay
  Public Ticket #2292015
Blog buttons colour
Closed

Comments

  •  21
    Sanjay started the conversation
    February 5, 2020 at 11:41pm

    Is it possible to change the colour of the 'read more' buttons. Using the blog nectar element for this listing.

    Thanks

  •  3,022
    Andrew replied
    February 6, 2020 at 6:33am

    Hi Sanjay,

    You can try and use the following CSS to alter the black color on those read more buttons:

    .post .more-link span, .blog-recent .more-link span {
    background-color: red;
}

    add it to salient \ general settings - css script related - custom css code.

    Alter the red to whatever color you want.
    Cheers. 

  •  21
    Sanjay replied
    February 6, 2020 at 11:55pm

    That works thanks. And a hover colour? And making the corners rounded? Font in uppercase? I'm trying to make them look like the buttons on the rest of the website.

  •  8,992
    Tahir replied
    February 7, 2020 at 11:56am

    Hey Again,

    Add this into the Custom CSS box located in your Salient Options panel (All custom css provided is tested in the Live Browser so it will work as intended . If you cant see any changes make sure there is no red cross in the Custom CSS Box as that syntax error would cause all css below it to not show up on the Frontend):

    .ascend .masonry-blog-item a.more-link span{
    text-transform: uppercase;
    border-radius:10px !important;
}
.ascend .masonry-blog-item a.more-link:hover span {
    background-color: #702082 !important
}

    Thanks

    ThemeNectar Support Team 

  •  21
    Sanjay replied
    February 10, 2020 at 12:36am

    That's great. I'm also using this code on another site but the uppercase, radius and hover codes don't work:

    https://phoenixyogastudios.com.au/category/ashtanga-yoga/

  •  8,992
    Tahir replied
    February 11, 2020 at 11:50am

    Add this into the Custom CSS box located in your Salient Options panel (All custom css provided is tested in the Live Browser so it will work as intended . If you cant see any changes make sure there is no red cross in the Custom CSS Box as that syntax error would cause all css below it to not show up on the Frontend):

    body[data-button-style*="slightly_rounded"] .post .more-link span, body[data-button-style*="slightly_rounded"] .blog-recent .more-link span {
    text-transform: uppercase;
    border-radius: 10px !important;
    background-color: #702082 !important
}

    Thanks

    ThemeNectar Support Team