icons not displayin...
 
Notifications
Clear all

Limited Support

Our team is currently on holiday, so support will be limited during this period. Response times may be slower than usual, and some inquiries may be delayed.
We appreciate your patience and understanding, and we’ll resume our usual support by the end of August.

 

wpForo 1.x.x [Solved] icons not displaying correctly

21 Posts
3 Users
4 Reactions
3,372 Views
Tutrix
Posts: 1522
(@tutrix)
Noble Member
Joined: 5 years ago

@rainerpuschner

try this code for the icons

#wpforo #wpforo-wrap i[class*="fas"]::before {
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    top: 0 !important;
}
#wpforo #wpforo-wrap i[class*="far"]::before {
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    top: 0 !important;
}
#wpforo #wpforo-wrap i[class*="fab"]::before {
    font-family: "Font Awesome 5 Brands" !important;
    font-weight: 900 !important;
    top: 0 !important;
}
#wpforo #wpforo-wrap .fas, 
#wpforo #wpforo-wrap .far,
#wpforo #wpforo-wrap .fab {
    text-decoration: none !important;
}
2 Replies
(@rainerpuschner)
Joined: 4 years ago

Active Member
Posts: 13

@tutrix THANK YOU!!! Your CSS Code just works perfectly!

(@rainerpuschner)
Joined: 4 years ago

Active Member
Posts: 13

Oh no! There is still one missing!

 

 

Posts: 13
Topic starter
(@rainerpuschner)
Active Member
Joined: 4 years ago

And this one (or is it the same?)

 

Posts: 13
Topic starter
(@rainerpuschner)
Active Member
Joined: 4 years ago

And what to do here?

8 Replies
Tutrix
(@tutrix)
Joined: 5 years ago

Noble Member
Posts: 1522

@rainerpuschner 

add this too

#wpforo #wpforo-wrap i[class*="fa-layer-group"]::before {
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    top: 0 !important;
}
#wpforo #wpforo-wrap .wpforo-login-wrap .wpf-field .wpf-field-wrap input[type="text"], 
#wpforo #wpforo-wrap .wpforo-login-wrap .wpf-field .wpf-field-wrap input[type="password"], 
#wpforo #wpforo-wrap .wpforo-login-wrap .wpf-field .wpf-field-wrap input[type="email"] {
    padding: 10px 20px 10px 34px !important;
}
(@rainerpuschner)
Joined: 4 years ago

Active Member
Posts: 13

@tutrix Yeah! Its getting better from time to time! THANK YOU SO MUCH!

 

This onei s still missing

Tutrix
(@tutrix)
Joined: 5 years ago

Noble Member
Posts: 1522

@rainerpuschner 

you must use the complete code I posted above

 

(@rainerpuschner)
Joined: 4 years ago

Active Member
Posts: 13

@tutrix i did!

This is the whole Code in the CSS section of wpforo:

 

#wpforo-wrap {
   font-size: 13px; width: 100%; padding:10px 0; margin:0px; border-radius: 5px;
}


#wpforo #wpforo-wrap i[class*="far"]::before {
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    top: 0 !important;
}
#wpforo #wpforo-wrap i[class*="fab"]::before {
    font-family: "Font Awesome 5 Brands" !important;
    font-weight: 900 !important;
    top: 0 !important;
}
#wpforo #wpforo-wrap .fas, 
#wpforo #wpforo-wrap .far,
#wpforo #wpforo-wrap .fab {
    text-decoration: none !important;
}

#wpforo #wpforo-wrap i[class*="fa-layer-group"]::before {
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    top: 0 !important;
}

#wpforo #wpforo-wrap .wpforo-login-wrap .wpf-field .wpf-field-wrap input[type="text"], 
#wpforo #wpforo-wrap .wpforo-login-wrap .wpf-field .wpf-field-wrap input[type="password"], 
#wpforo #wpforo-wrap .wpforo-login-wrap .wpf-field .wpf-field-wrap input[type="email"] {
    padding: 10px 20px 10px 34px !important;
}
Tutrix
(@tutrix)
Joined: 5 years ago

Noble Member
Posts: 1522

@rainerpuschner 

and why not completely?

(@rainerpuschner)
Joined: 4 years ago

Active Member
Posts: 13

@tutrix Did i miss some snippet? Thats all code snippets you showed to me, isnt it?

Tutrix
(@tutrix)
Joined: 5 years ago

Noble Member
Posts: 1522

@rainerpuschner 

you forgot or removed this part of the code

#wpforo #wpforo-wrap i[class*="fas"]::before {
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    top: 0 !important;
}
(@rainerpuschner)
Joined: 4 years ago

Active Member
Posts: 13

@tutrix THANK YOU SO MUCH! I dont know how i missed that code... DANKE DANKE DANKE!

Page 2 / 2