The forum of the forums
Would you like to react to this message? Create an account in a few clicks or log in to continue.

Reputation button showing as URL address after voting

3 posters

Go down

In progress Reputation button showing as URL address after voting

Post by babette September 19th 2014, 12:20 am

Hi! I've been following the steps here: https://help.forumotion.com/t135424-reputation-button-move

But when I tried to insert the URL of the image (https://2img.net/h/s9.postimg.cc/gi41ziyuz/heartm.png) into the Javascript, it turned up as just the address itself. The forum http://studio.liberte.tv and the issue (last post) can be seen here: http://studio.liberte.tv/t8p10-what-s-your-medieval-profession on the top right-hand side of Tulipe's post.

Here's the CSS I've used for the reputation (I know it's messy - sorry!)

Code:
.VCount:before{
content:"http://s9.postimg.org/gi41ziyuz/heartm.png" !important;
}
.VCount{
color:#000 !important;
font-size:12px;
font-weight:bold;
font-family: 'Playfair Display';
cursor:default;
}
.VPlus{
color#000 !important;
font-size:12px;
font-weight:bold;
font-family: 'Playfair Display';
position:relative;
left:9px;
z-index:1;
}
.VPlus:hover{
color:#000 !important;
}
.vote{
opacity:0;
filter:alpha(opacity=0);
}
.vote .vote-button, .vote-no-bar {
  display:none;
}
.vote .vote-button:first-child {
    display:block;
}
.vote .vote-button a {
background-image: url('http://s9.postimg.org/gi41ziyuz/heartm.png') !important;
background-repeat:no-repeat;
padding-right: 20px;
padding-top: 30px;
font-size: 9px !important;
width:16px; !important;
}

And the Javascript:

Code:
$(function() {
    var voteImage = 'http://s9.postimg.org/gi41ziyuz/heartm.png';
 
    $('.vote').each(function() {
       if ($(this).find('.vote-bar').length) { var VCount = $(this).find('.vote-bar').attr('title').replace(/.*\((\d+).*\)/,'$1') }
       if (VCount == '1') { var vote = ' vote' }
       else { var vote = ' votes' }
       var VPlus = $(this).find('.vote-button:first a').addClass('VPlus').attr('title', 'Vote up').html('<img src="'+voteImage+'" alt="+"/>');
     
       $(this).closest('.postbody').find('.profile-icons').append(VPlus);
       $(this).closest('.postbody:has(.vote-bar)').find('.profile-icons').append('<span class="VCount" title="'+VCount+vote+'">'+VCount+'</span>');
       $(this).remove();
    });
   
    $('.VPlus').click(function(){
       $.get($(this).attr('href'), function() {
          location.reload();
       });
       return false
    });
});

Any help would be great, thanks!

EDIT - I also seem to be having problems with my fast/quick reply box. When I click on the colour palette dropdown, it just shows a long horizontal white space. Not sure how this happened?
avatar
babette
New Member

Posts : 2
Reputation : 1
Language : english

http://studio.liberte.tv

Back to top Go down

In progress Re: Reputation button showing as URL address after voting

Post by SLGray September 19th 2014, 9:30 am

That code is for phpBB2, not phpBB3.


Reputation button showing as URL address after voting Slgray10

When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.
SLGray
SLGray
Administrator
Administrator

Male Posts : 51482
Reputation : 3519
Language : English
Location : United States

https://forumsclub.com/gc/128-link-directory/

Back to top Go down

In progress Re: Reputation button showing as URL address after voting

Post by babette September 19th 2014, 11:52 am

Do you happen to know how to make it appropriate for phpbb3? Or is that not possible?

EDIT - Here's a screenshot, incase guests can't vote:

Reputation button showing as URL address after voting Error10

Also, because of the first post in the thread I was following:

I've seen it mentioned elsewhere but only for PHPBB not PHPBB3 which I have.

I thought that the thread was appropriate for 3?

avatar
babette
New Member

Posts : 2
Reputation : 1
Language : english

http://studio.liberte.tv

Back to top Go down

In progress Re: Reputation button showing as URL address after voting

Post by Ange Tuteur September 19th 2014, 3:32 pm

Hello babette,

In your CSS :
Code:
content:"http://s9.postimg.org/gi41ziyuz/heartm.png" !important;

Should be :
Code:
content:url(http://s9.postimg.org/gi41ziyuz/heartm.png) !important;

You're displaying the image as a text string instead of an image.
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13246
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Back to top

- Similar topics

 
Permissions in this forum:
You cannot reply to topics in this forum