The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

Reputation button showing as URL address after voting

View previous topic View next topic Go down

In progress Reputation button showing as URL address after voting

Post by babette on Thu Sep 18, 2014 5:20 pm

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

But when I tried to insert the URL of the image (http://s9.postimg.org/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?

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 on Fri Sep 19, 2014 2:30 am

That code is for phpBB2, not phpBB3.


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


SLGray
Administrator
Administrator

Male Posts : 36681
Reputation : 2445
Language : English
Location : United States

http://ztwds.forumotion.com/

Back to top Go down

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

Post by babette on Fri Sep 19, 2014 4: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:



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?


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 on Fri Sep 19, 2014 8:32 am

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
Forumaster

Male Posts : 13028
Reputation : 2704
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

View previous topic View next topic Back to top


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