[BUG] Like (and dislike) button dysfunction

Hello hello!

After installing FAE on my site, I have encountered a problem with the reputation system. The "button" if you can call it that, works, but it is displayed incorrectly.

Most of the immediate bugs I've worked out. However, this one stumped me (surprise surprise).

Here is what I'm getting in the posts for the like button (I've hid the dislike button and rep bar):



Example topic: http://www.geekpolice.net/t30327-wick-hill-feature-delivering-secure-wi-fi#213181

I have edited the JavaScript concerning this, the CSS as well - to no avail. I suppose I'm missing something, because I used Inspector to check the code, and there are no errors either in the debugger.

What do you think?

I tried to view the button but I can't unless I have an account. If you can provide a dummy test account (regular member, not staff or anything) so we can check out the problem that'd be great :3

Sure...

Weird.. o-o I checked the HTML, the CSS, and even the @import rule at the beginning of your CSS (switched it out with the one that Ange has on this forum since it works, but still nope) but it just won't fix o_e'
Idk if something broke during the installation but maybe try uninstalling and re-installing? I know Ange's forum version wipes the old CSS and JS so I doubt that you have some sort of other code conflicting with Font Awesome..

Me too. I did not try swapping import rules.. However, since this is the only bug that's being stubborn... I could try a different reputation system, or I can force it to accept a different button. However, I'm more for fixing the bug at the moment than trying to "force" something.

I posted here, because I was afraid there was an incompatibility in a template that I could not find. I read the code, and the automatic insert for the like button is different from what it does on this forum: ï…¤ (< Rendered as plaintext).

I could easily remove the like button altogether, and just have the Thanks button, because as you can tell @Valoish, the Thanks button is intact and operating well.

Yeah, it's pretty weird.. The HTML, CSS and import rule are all like the ones on here so I don't see why it's displaying the button as "ï…¤" rather than a thumbs up (empty square when viewed in Dev Tools)
If you wanna fix it, then it'd be best to wait for Ange (Hopefully he can answer this even though he's technically not providing support anymore since its a small request ><) Hiding the button altogether could also work if you're okay with that

Okay, we'll leave this open for a few days to see if anymore ideas stream in.

Thanks!

I have fixed the issue...

I replaced the jumbled text that I showed above with the proper font awesome icon in the viewtopic_body Template:

Code:

<ul class="profile-icons">
            <!-- BEGIN switch_vote_active -->
            <li class="vote gensmall">
               <!-- BEGIN switch_vote -->
               <a class="fa vote-button-plus" href="{postrow.displayed.switch_vote_active.switch_vote.U_VOTE_PLUS}"></a>
               <!-- END switch_vote -->

               <!-- BEGIN switch_bar -->
               <span class="vote-bar" title="{postrow.displayed.switch_vote_active.L_VOTE_TITLE}">
                  <!-- BEGIN switch_vote_plus -->
                  <span class="vote-bar-plus" style="width:{postrow.displayed.switch_vote_active.switch_bar.switch_vote_plus.HEIGHT_PLUS}px;"></span>
                  <!-- END switch_vote_plus -->

                  <!-- BEGIN switch_vote_minus -->
                  <span class="vote-bar-minus" style="width:{postrow.displayed.switch_vote_active.switch_bar.switch_vote_minus.HEIGHT_MINUS}px;"></span>
                  <!-- END switch_vote_minus -->
               </span>
               <!-- END switch_bar -->

               <!-- BEGIN switch_no_bar -->
               <span title="{postrow.displayed.switch_vote_active.L_VOTE_TITLE}" class="vote-no-bar"></span>
               <!-- END switch_no_bar -->

               <!-- BEGIN switch_vote -->
               <a class="fa vote-button-minus" href="{postrow.displayed.switch_vote_active.switch_vote.U_VOTE_MINUS}"></a>
               <!-- END switch_vote -->
            </li>
            <!-- END switch_vote_active -->

Wow.. Who would have thought the templates could be the problem o-o
Awesome job figuring it out~! 

Well, after I inspected it, Val, I noticed that the specific characters (I showed above) were inserted as plaintext, which clued me in to the possibility that Templates were the problem.

Hmm.. I'm assuming characters which weren't supported by your forum's charset ( or something similar ) might've been converted to more "readable" ones when the template was retrieved via AJAX. Just an assumption though, I'm not entirely sure how that happened. You can find all the templates here just in case of any other inconsistencies elsewhere.

That's what kept ringing in my head while inspecting was "charset." But yeah, it's solved and works great.