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.

How to colorize the points fields

View previous topic View next topic Go down

Solved How to colorize the points fields

Post by th4nhc0n9 on October 18th 2014, 11:02 am

In my forum, there is Points field.
E.g Points: 100000
With "Points" label, I can set color for it. However with the value 100000, it displays with default style of label. It is possible to change 100000 with color and bigger font size by CSS. Thanks

th4nhc0n9
Forumember

Male Posts : 157
Reputation : 3
Language : Vietnam

http://vnbeauties.com

Back to top Go down

Solved Re: How to colorize the points fields

Post by _Twisted_Mods_ on October 18th 2014, 11:41 am

by css no because its not connected to a element .. you would have to use javascript

_Twisted_Mods_
Helper
Helper

Male Posts : 2032
Reputation : 302
Language : English
Location : Ms

http://liquidcode.forumotion.com

Back to top Go down

Solved Re: How to colorize the points fields

Post by Mati on October 18th 2014, 11:45 am

I think i have done this before but I'll give it a try.

Mati
Active Poster

Posts : 1883
Reputation : 283
Language : || HTML || CSS || jQuery ||
Location : At the Gym

http://footballforums.forumotion.net/

Back to top Go down

Solved Re: How to colorize the points fields

Post by Luffy on October 18th 2014, 1:03 pm

Hello,

To change the Points color you mist go to
Admin Panel >> Users & Groups >> Users >> Profiles
and press the edit button ( Edit ) next to the points field and change the color of the default. That should change your "points" text to the color you chose.






Luffy
Manager
Manager

Male Posts : 4245
Reputation : 424
Language : Greek, English
Location : Greece

http://helpgr.forumgreek.com/forum

Back to top Go down

Solved Re: How to colorize the points fields

Post by Mati on October 18th 2014, 1:05 pm

I think he want to change the numbers Wink

Mati
Active Poster

Posts : 1883
Reputation : 283
Language : || HTML || CSS || jQuery ||
Location : At the Gym

http://footballforums.forumotion.net/

Back to top Go down

Solved Re: How to colorize the points fields

Post by Luffy on October 18th 2014, 1:15 pm

Yes, i misunderstood! Thanks Mati and sorry for the wrong answer! Confused






Luffy
Manager
Manager

Male Posts : 4245
Reputation : 424
Language : Greek, English
Location : Greece

http://helpgr.forumgreek.com/forum

Back to top Go down

Solved Re: How to colorize the points fields

Post by Ange Tuteur on October 18th 2014, 5:23 pm

Hello th4nhc0n9,

Try this :
Administration Panel > Modules > JavaScript codes management > Create a new script

Title : Your choice
Placement : In the topics
Paste the code below :
Code:
$(function() {
 var color = '#F00', ptsName = 'Points',
 p = $('.postprofile'), reg = new RegExp('(<span.*?>'+ptsName+': <\\/span>)( \\d+)<br>','i');
 for (i=0; i<p.length; i++) if (reg.test(p[i].innerHTML)) p[i].innerHTML = p[i].innerHTML.replace(reg, '$1<span style="color:'+color+';">$2</span><br>');
});

You only need to modify the first two variables :

color : the color you want the points to be. Currently it is red.

ptsName : the name of your points field. If your points field is "Points" you don't need to change this variable value.

Ange Tuteur
Forumaster

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

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: How to colorize the points fields

Post by th4nhc0n9 on October 18th 2014, 5:33 pm

Thank Ange. However, I have tried but I don't see the changes.
I see in the code, it is to change the color only, is it change the font size also?

th4nhc0n9
Forumember

Male Posts : 157
Reputation : 3
Language : Vietnam

http://vnbeauties.com

Back to top Go down

Solved Re: How to colorize the points fields

Post by Ange Tuteur on October 18th 2014, 5:35 pm

Oooh I forgot about the font size ! Here, replace your script by this one :
Code:
$(function() {
  var ptsName = 'Points',
  p = $('.postprofile'), reg = new RegExp('(<span.*?>'+ptsName+': <\\/span>)( \\d+)<br>','i');
  for (i=0; i<p.length; i++) if (reg.test(p[i].innerHTML)) p[i].innerHTML = p[i].innerHTML.replace(reg, '$1<span class="pointsValue">$2</span><br>');
});

Then use this CSS to style the value :
Display > Colors > CSS stylesheet
Code:
.pointsValue {
  color:#F00;
  font-size:12px;
  font-weight:bold;
}

Ange Tuteur
Forumaster

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

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: How to colorize the points fields

Post by th4nhc0n9 on October 18th 2014, 5:53 pm

It is still KO. Could you check again? Thanks.

th4nhc0n9
Forumember

Male Posts : 157
Reputation : 3
Language : Vietnam

http://vnbeauties.com

Back to top Go down

Solved Re: How to colorize the points fields

Post by Ange Tuteur on October 18th 2014, 5:56 pm

Oops sorry I checked and your field is colored. The HTML is a bit different, so I changed it up for you forum. Try now ^^
Code:
$(function() {
 var ptsName = 'Points',
 p = $('.postprofile'), reg = new RegExp('(<span.*?><span.*?>'+ptsName+'<\\/span>: <\\/span>)( \\d+)<br>','i');
 for (i=0; i<p.length; i++) if (reg.test(p[i].innerHTML)) p[i].innerHTML = p[i].innerHTML.replace(reg, '$1<span class="pointsValue">$2</span><br>');
});

Ange Tuteur
Forumaster

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

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: How to colorize the points fields

Post by th4nhc0n9 on October 18th 2014, 6:01 pm

It is OK now. Thank U so much!!!! Very good

th4nhc0n9
Forumember

Male Posts : 157
Reputation : 3
Language : Vietnam

http://vnbeauties.com

Back to top Go down

Solved Re: How to colorize the points fields

Post by Ange Tuteur on October 18th 2014, 6:11 pm

You're welcome !

Topic archived

Have a great weekend ! Smile

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