Notifications
Clear all

wpForo 1.x.x [Solved] How to change upvote and downvote icons?

5 Posts
3 Users
2 Reactions
784 Views
Posts: 18
Topic starter
(@mpanichi)
Eminent Member
Joined: 2 years ago

I want to change upvote and downvote icons.

I saw on the HTML side that the icons are rendered using font awesome:

<i class="wpforo-voteup fas fa-play fa-rotate-270 wpfcl-0" data-type="reply" data-postid="22"></i>

I wanted to change that output but in the wpf-theme > classic > layouts > 3 that HTML is rendered with a function:

<?php wpforo_post_buttons( 'icon-text', 'positivevote', $forum, $topic, $post ); ?>

From this point I stucked: how can I change the icon?

4 Replies
Robert
Posts: 10587
Admin
(@robert)
Support Team
Joined: 9 years ago

@mpanichi,

Are you looking for changing the icon to another Font-Awesome icon?

Posts: 18
Topic starter
(@mpanichi)
Eminent Member
Joined: 2 years ago

Yes, it could be ok.

The idea is to use the thumb up https://fontawesome.com/icons/thumbs-up?s=solid  and thumb down https://fontawesome.com/icons/thumbs-down?s=solid

Tutrix
Posts: 1453
(@tutrix)
Noble Member
Joined: 5 years ago

@mpanichi

add this to custom css

#wpforo #wpforo-wrap .wpf-positive .fas.fa-play.fa-rotate-270::before {
content: "\f164";
transform: rotate(90deg)!important;
display: inline-block !important;
}
#wpforo #wpforo-wrap .wpf-negative .fas.fa-play.fa-rotate-90::before {
content: "\f165";
transform: rotate(270deg)!important;
display: inline-block !important;
}

Dashboard > Forums > Settings > Style (custom css)

Posts: 18
Topic starter
(@mpanichi)
Eminent Member
Joined: 2 years ago

Amazing 🙂