Notifications
Clear all

Issues with Font change

6 Posts
2 Users
2 Reactions
43 Views
Posts: 3
Topic starter
(@notquitewrite)
Active Member
Joined: 17 hours ago

I know that wpForo uses my site fonts, but I want to change the font specifically for the forum since I need it to have a different font. 

I have used the CSS from this thread Change font – How-to and Troubleshooting – wpForo Support Forum

#wpforo #wpforo-wrap *:not(.fa):not(.fas):not(.far):not(fab) {
    font-family: "Arial Rounded MT Std", Arial, sans-serif !important;
}

It has worked really well, but it breaks the TinyMCE icons as per the attached image. The TinyMCE icons are not Font Awesome (far) fonts, and so they are not excluded by the "not" clauses in the CSS.

Is there a workaround that would allow me to have both a custom font and working MCE? 

 

Topic Tags
5 Replies
Tutrix
Posts: 1504
(@tutrix)
Noble Member
Joined: 5 years ago

Hi @notquitewrite 

Try

#wpforo #wpforo-wrap *:not(.fa,.fas,.far,fab,.mce-ico) {
    font-family: "Arial Rounded MT Std", Arial, sans-serif !important;
}

 

Reply
Posts: 3
Topic starter
(@notquitewrite)
Active Member
Joined: 17 hours ago

Hi, thanks for the quick response, but unfortunately the icons remain the same with that css update.

Reply
1 Reply
Tutrix
(@tutrix)
Joined: 5 years ago

Noble Member
Posts: 1504

@notquitewrite 

clear the browser cache

and do not use both codes

#wpforo #wpforo-wrap #wpforo-title {
font-weight:bold !important;
font-size: 22px;
text-transform: uppercase;
}
#wpforo #wpforo-wrap *:not(.fa):not(.fas):not(.far):not(fab) {
    font-family: "Arial Rounded MT Std", Arial, sans-serif !important;
}

#wpforo #wpforo-wrap *:not(.fa,.fas,.far,fab,.mce-ico,.mce,.mce-widget) {
    font-family: "Arial Rounded MT Std", Arial, sans-serif !important;
}

remove this one

#wpforo #wpforo-wrap *:not(.fa):not(.fas):not(.far):not(fab) {
    font-family: "Arial Rounded MT Std", Arial, sans-serif !important;
}
Reply
Posts: 3
Topic starter
(@notquitewrite)
Active Member
Joined: 17 hours ago

It works perfectly! Not sure what happened the first time. I really appreciate your help on this. 

Merry Christmas! 

Reply
1 Reply
Tutrix
(@tutrix)
Joined: 5 years ago

Noble Member
Posts: 1504

@notquitewrite 

use

#wpforo #wpforo-wrap *:not(.fa,.fas,.far,fab,.mce-ico,.fa-regular,.fa-solid ) {
    font-family: "Arial Rounded MT Std", Arial, sans-serif !important;
}

.fa-regular,.fa-solid added 😉 

Reply