How to change WPFORO color and font size

Hi there,
I am struggling with this issue.
The preset colors and font sizes of plugin WPFORO get changed by the modifications done in Apparance >Additional CSS.

The forum is at https://www.fineco-bank.com/forum/

I want to change sizes and color for the Forum menu headers (Forums, Members, Recent Posts and so on) and it submenus.

I want also to change size and color of hyperlinks (topic titles) both in the forum table and most-recent topics list. Now both of them are unreadable yellow.
Once I access to any topic, there is a root.-list of the post position (home>forum>topic) , that is yellow too and I wish to change it.

When I make any change, it is reflected to the rest of the website.
Could you please help?

Thanks in advance.
Andrea

Hi Andrea,

Did you manage the font size with custom CSS code applies to Additional CSS? Can you share that code, so I can make a little corrections with it?

Regarding the link color, I found these lines in your Additional CSS that overrides the default WPForo links color.

    #mainnav-mobi a, a:link, a:visited, a:hover, a:active {
      color: #dddd00 !important;
    }

To change links color inside WPForo pages content, you can add another style with this selector:

.entry-content #wpforo a

For example:

    .entry-content #wpforo a:link,
    .entry-content #wpforo a:visited {
      color: #ff0000 !important;
    }

    .entry-content #wpforo a:hover {
      color: #000 !important;
    }

I hope this reply helps.

Regards,
Kharis
aThemes Support

Hi Kharis,

Thank you very much.
Concerning your inquiry, I have in additional CCS:

    .small {
       font-size: small;
    }

Maybe that affects the font size of the forum.

I’ve added the following:

    .entry-content #wpforo a, .entry-content #wpforo a:link, .entry-content #wpforo a:visited, .entry-content #wpforo a:hover, .entry-content #wpforo a:active {
      color: #000040 !important;
        font-size: 18px !important;
        line-height: 24px !important;
    }

Those changes do not affect the rest of the website.
I would need though to those changes do not affect the forum menu headers and submenus - (Forums, Members, Recent Posts…- ; I want to have clear fonts on the forum menu headers.

Thanks
Andrea

Hi Andrea,

Thank you for getting back.

I think, the best approach to deal with this and avoid endles loop of styling you should firstly identify the areas your want to style – separate between site-wide styles and WPForo-specific styles.

Always avoid the !important declaration whenever it is possible, so we’ll get the styles to affect immediately before other shared selectors override it.

Further adding, I’d recommend checking with the WPForo plugin’s developer whether it has an extension or additional plugin that allows us to style the color and font size easier (via Customizer maybe) or not.

Regards,
Kharis
aThemes Support