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 September 19th 2014, 12:20 am

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 September 19th 2014, 9: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.

avatar
SLGray
Administrator
Administrator

Male Posts : 40873
Reputation : 2775
Language : English
Location : United States

https://fmthemes.forumotion.com/

Back to top Go down

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

Post by babette on 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:



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 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.
avatar
Ange Tuteur
Forumaster

Male Posts : 13176
Reputation : 2881
Language : EN10, FR5
Location : Macungie, PA

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