Skip to:
Content
Pages
Categories
Search
Top
Bottom

custom ‘bbp-forum-link’ css code


  • denrocs
    Participant

    @denrocs

    7 years, 2 months ago

    Hi all

    I’m using the ‘Kleo’ WordPress theme on WordPress 4.7.5 and BBPress 2.5.13, and am trying to change the standard links to forums in BBPress as they are too difficult to read currently, specifically the ‘bbp-forum-link’ class.

    What I’m trying to achieve is a background highlight on each link, with rounded corners, plus a little extra space between them using the following code: 

    color: #e4e4e4;
    background: #232323;
    padding: 1px 2px;
    margin: 2px 2px;
    line-height: 1.7;
    border-radius: 3px;

    I have also put this image together of what I’m trying – https://imgur.com/OKO9pZ8

    How would I put this code into the custom style.css file of Kleo to stylise these links, please?

    No link to site as it is on my local host (MAMP PRO 4 if that helps)

    Many thanks

Viewing 6 replies - 1 through 6 (of 6 total)

  • Robin W
    Moderator

    @robin-w

    7 years, 2 months ago

    since I don’t have the Kleo theme and your site is local, it’s a bit hard to tell you want to alter


    denrocs
    Participant

    @denrocs

    7 years, 2 months ago

    Apologies, I realised this would help after posting 🙂
    I’ve set up a temporary WP site on a personal server with the same theme, WP 4.7.5 and BBPress 2.5.13 at http://wp.createlabs.co.uk/forums/

    At the moment, the links to Child Forum 1 and Child Forum 2 are just plain blue links with a comma after Child Forum 1 which separates them.
    What I’d like to achieve is what I have put in the image link above? The bottom image is what I’m trying to get the links to look like (https://imgur.com/OKO9pZ8)

    Instead of a plain blue link, alter the CSS to highlight each link so they look more like flat rounded buttons rather than standard links.

    I hope that helps, please let me know if I can do anything else 🙂


    Robin W
    Moderator

    @robin-w

    7 years, 2 months ago

    Try this

    a.bbp-fourm-link {
color: #e4e4e4;
    background: #232323;
    padding: 1px 2px;
    margin: 2px 2px;
    line-height: 1.7;
    border-radius: 3px;
}

    denrocs
    Participant

    @denrocs

    7 years, 2 months ago

    Perfect! Thank you very much! I was missing the a. tag
    Had to clear my cache but now working exactly as needed 🙂


    Robin W
    Moderator

    @robin-w

    7 years, 2 months ago

    great – glad you’re fixed


    Info Ekonomi
    Participant

    @dakwahislami

    5 years, 11 months ago

    Hi Robin, how about changing the link to only on the post / topic not on any other area of forum.

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

Topic Info

Topic Tags

Skip to toolbar