Change Username Font.

Go down

Solved Change Username Font.

Post by jarn on July 29th 2014, 4:55 pm

Pics:
Change Username Font. JUMGLeC

Change Username Font. 5Vfyrvh

Anyone know how to create an effect like this?
avatar
jarn
Forumember

Posts : 80
Reputation : 1
Language : English

http://cwentertainment.forummotion.com/

Back to top Go down

Solved Re: Change Username Font.

Post by TK2 on July 29th 2014, 8:32 pm

Add to your CSS:



Code:
@font-face {
  font-family: 'Open Sans Condensed';
  font-style: normal;
  font-weight: 700;
  src: local('Open Sans Condensed Bold'), local('OpenSans-CondensedBold'), url(http://themes.googleusercontent.com/static/fonts/opensanscondensed/v7/gk5FxslNkTTHtojXrkp-xONSK5BxN3NFS4EJkViHIqo.woff) format('woff');
}

.body {
 font-family: 'Open Sans Condensed';
}
TK2
TK2
New Member

Posts : 1
Reputation : 1
Language : English

https://help.forumotion.com

Back to top Go down

Solved Re: Change Username Font.

Post by jarn on July 30th 2014, 5:12 am

Nothing happened.
avatar
jarn
Forumember

Posts : 80
Reputation : 1
Language : English

http://cwentertainment.forummotion.com/

Back to top Go down

Solved Re: Change Username Font.

Post by SLGray on July 30th 2014, 5:31 am

Add it to the top of your CSS stylesheet.


Change Username Font. 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 : 46311
Reputation : 3257
Language : English
Location : United States

https://help.forumotion.com/

Back to top Go down

Solved Re: Change Username Font.

Post by jarn on July 30th 2014, 5:57 am

Still the same result, nothing happened.
avatar
jarn
Forumember

Posts : 80
Reputation : 1
Language : English

http://cwentertainment.forummotion.com/

Back to top Go down

Solved Re: Change Username Font.

Post by SLGray on July 30th 2014, 6:13 am

Code:
@font-face {
  font-family: 'Open Sans Condensed';
  font-style: normal;
  font-weight: 700;
  src:
 local('Open Sans Condensed Bold'), local('OpenSans-CondensedBold'),
url(http://themes.googleusercontent.com/static/fonts/opensanscondensed/v7/gk5FxslNkTTHtojXrkp-xONSK5BxN3NFS4EJkViHIqo.woff)
 format('woff');
}

.body {
 font-family: 'Open Sans Condensed' !important;


Change Username Font. 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 : 46311
Reputation : 3257
Language : English
Location : United States

https://help.forumotion.com/

Back to top Go down

Solved Re: Change Username Font.

Post by jarn on July 30th 2014, 6:18 am

''Detected error
We have counted a different number of "{" and of "}". It means your CSS risks to be not valid and will not be posted correctly on your forum.

We advise you to reread your code.''

That popped up after I put in the code.
avatar
jarn
Forumember

Posts : 80
Reputation : 1
Language : English

http://cwentertainment.forummotion.com/

Back to top Go down

Solved Re: Change Username Font.

Post by TheCrow on July 30th 2014, 10:11 am

Hello,

SLGray forgot to close the last code. Please replace his code with the below:
Code:
@font-face {
  font-family: 'Open Sans Condensed';
  font-style: normal;
  font-weight: 700;
  src:
 local('Open Sans Condensed Bold'), local('OpenSans-CondensedBold'),
url(http://themes.googleusercontent.com/static/fonts/opensanscondensed/v7/gk5FxslNkTTHtojXrkp-xONSK5BxN3NFS4EJkViHIqo.woff)
 format('woff');
}

.body {
 font-family: 'Open Sans Condensed' !important;
}
TheCrow
TheCrow
Energetic

Male Posts : 6103
Reputation : 702
Language : Greek, English
Location : Cyprus, Greece

https://www.inforumgr.com

Back to top Go down

Solved Re: Change Username Font.

Post by jarn on July 30th 2014, 10:56 am

The error is gone, but there is still no change. I think maybe I'm doing something wrong. My CSS stylesheet looks like this.

Code:
    @font-face {
      font-family: 'Open Sans Condensed';
      font-style: normal;
      font-weight: 700;
      src:
    local('Open Sans Condensed Bold'), local('OpenSans-CondensedBold'),
    url(http://themes.googleusercontent.com/static/fonts/opensanscondensed/v7/gk5FxslNkTTHtojXrkp-xONSK5BxN3NFS4EJkViHIqo.woff)
    format('woff');
    }

    .body {
    font-family: 'Open Sans Condensed' !important;
    }

.circular {
   width: 75px;
   height: 75px;
   border-radius: 150px;
   -webkit-border-radius: 150px;
   -moz-border-radius: 150px;
   background: url(http://link-to-your/image.jpg) no-repeat;
   box-shadow: 0 0 8px rgba(0, 0, 0, .8);
   -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, .8);
   -moz-box-shadow: 0 0 8px rgba(0, 0, 0, .8);
   }

avatar
jarn
Forumember

Posts : 80
Reputation : 1
Language : English

http://cwentertainment.forummotion.com/

Back to top Go down

Solved Re: Change Username Font.

Post by SLGray on July 30th 2014, 11:05 am

Do you have that font in your font library on your computer?

This is how it should look - https://www.google.com/fonts/specimen/Open+Sans+Condensed .


Change Username Font. 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 : 46311
Reputation : 3257
Language : English
Location : United States

https://help.forumotion.com/

Back to top Go down

Solved Re: Change Username Font.

Post by jarn on July 30th 2014, 11:21 am

Yes, I'm sure I have the font. Is there anything else that could be the problem?
avatar
jarn
Forumember

Posts : 80
Reputation : 1
Language : English

http://cwentertainment.forummotion.com/

Back to top Go down

Solved Re: Change Username Font.

Post by SLGray on July 30th 2014, 11:24 am

Code:
    @font-face {
      font-family: 'Open Sans Condensed';
      font-style: normal;
      font-weight: 700;
    }

    .body {
     font-family: 'Open Sans Condensed' !important;
    }



Change Username Font. 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 : 46311
Reputation : 3257
Language : English
Location : United States

https://help.forumotion.com/

Back to top Go down

Solved Re: Change Username Font.

Post by jarn on July 30th 2014, 11:42 am

Still nothing. Does this mean I don't have the original font installed?
avatar
jarn
Forumember

Posts : 80
Reputation : 1
Language : English

http://cwentertainment.forummotion.com/

Back to top Go down

Solved Re: Change Username Font.

Post by SLGray on July 30th 2014, 8:33 pm

Have you tried adding the font here?

Administration Panel > Display > Colors & Pictures > Colors
The font options are in the first section box.


Change Username Font. 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 : 46311
Reputation : 3257
Language : English
Location : United States

https://help.forumotion.com/

Back to top Go down

Solved Re: Change Username Font.

Post by Ange Tuteur on July 31st 2014, 6:45 am

Try this :
Code:
@font-face {
  font-family: 'Open Sans Condensed';
  font-style: normal;
  font-weight: 300;
  src: local('Open Sans Cond Light'), local('OpenSans-CondensedLight'), url(http://themes.googleusercontent.com/static/fonts/opensanscondensed/v7/gk5FxslNkTTHtojXrkp-xF1YPouZEKgzpqZW9wN-3Ek.woff) format('woff');
}

* { font-family:'Open Sans Condensed' }
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13223
Reputation : 2960
Language : EN, JA, FR
Location : Macungie, PA

https://github.com/SethClydesdale

Back to top Go down

Solved Re: Change Username Font.

Post by jarn on July 31st 2014, 12:39 pm

That worked, although it changed the entire font of the forum, not only the usernames. Is there any way for it to work only on usernames and not the whole forum?
avatar
jarn
Forumember

Posts : 80
Reputation : 1
Language : English

http://cwentertainment.forummotion.com/

Back to top Go down

Solved Re: Change Username Font.

Post by Japorized on July 31st 2014, 1:01 pm

Just a suggestion but this method will be slightly tedious.
You can add everyone into a certain group and give them all a certain hex color.
With that, add in
Code:
a span[style="color:#000000"] strong {
  /* font-family and other styles go here */
}

The downside to this is that everyone's username will be under the strong font-weight, and you might have to repeat the code for users who already have another color to their usernames.

As I said, this is just a suggestion. Hopefully the someone else can come up with a better idea from this.
Japorized
Japorized
Forumember

Male Posts : 310
Reputation : 3
Language : English
Location : Malaysia

http://infinityhub.ace.st

Back to top Go down

Solved Re: Change Username Font.

Post by Ange Tuteur on July 31st 2014, 1:11 pm

Of course Wink

Replace the CSS I gave you by :
Code:
@font-face {
  font-family: 'Open Sans Condensed';
  font-style: normal;
  font-weight: 300;
  src: local('Open Sans Cond Light'), local('OpenSans-CondensedLight'), url(http://themes.googleusercontent.com/static/fonts/opensanscondensed/v7/gk5FxslNkTTHtojXrkp-xF1YPouZEKgzpqZW9wN-3Ek.woff) format('woff');
}

a[href^="/u"] { font-family:'Open Sans Condensed' }
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13223
Reputation : 2960
Language : EN, JA, FR
Location : Macungie, PA

https://github.com/SethClydesdale

Back to top Go down

Solved Re: Change Username Font.

Post by jarn on July 31st 2014, 1:26 pm

Thanks! Just one more thing though - is there a way to make the letters in capitals like in the original post without having to manually change every name to caps?
avatar
jarn
Forumember

Posts : 80
Reputation : 1
Language : English

http://cwentertainment.forummotion.com/

Back to top Go down

Solved Re: Change Username Font.

Post by Japorized on July 31st 2014, 1:34 pm

Code:
a[href^="/u"]::first-letter {
text-transform:capitalize;
}

See if this works
Japorized
Japorized
Forumember

Male Posts : 310
Reputation : 3
Language : English
Location : Malaysia

http://infinityhub.ace.st

Back to top Go down

Solved Re: Change Username Font.

Post by jarn on July 31st 2014, 1:37 pm

It didn't work, unfortunately.
avatar
jarn
Forumember

Posts : 80
Reputation : 1
Language : English

http://cwentertainment.forummotion.com/

Back to top Go down

Solved Re: Change Username Font.

Post by Japorized on July 31st 2014, 1:56 pm

Hmm... Then try this.
Create a new javascript file and apply it to all pages.
Code:
$(document).ready(function(){
    $('a[href^="/u"]').addClass("capitalize");
});
Then go to your CSS stylesheet
Code:
.capitalize {
text-transform: capitalize;
}
Here's a sample of it working
http://jsfiddle.net/JnY65/
Japorized
Japorized
Forumember

Male Posts : 310
Reputation : 3
Language : English
Location : Malaysia

http://infinityhub.ace.st

Back to top Go down

Solved Re: Change Username Font.

Post by jarn on July 31st 2014, 3:09 pm

Nothing happened. But wouldn't your solution only make the first letter capitalized since it says "Test" rather than "TEST"?
avatar
jarn
Forumember

Posts : 80
Reputation : 1
Language : English

http://cwentertainment.forummotion.com/

Back to top Go down

Solved Re: Change Username Font.

Post by Japorized on July 31st 2014, 3:15 pm

Oh, ahaha. Sorry. My bad.
Then you won't need all the jQuery.
Just change
Code:
a[href^="/u"] {
  font-family:'Open Sans Condensed';
}
to
Code:
a[href^="/u"] {
  font-family:'Open Sans Condensed';
  text-transform: capitalize;
}
will do.

Hope this helps now. Smile
Japorized
Japorized
Forumember

Male Posts : 310
Reputation : 3
Language : English
Location : Malaysia

http://infinityhub.ace.st

Back to top Go down

Solved Re: Change Username Font.

Post by jarn on July 31st 2014, 3:37 pm

I did a quick google search. If I change it from 'capitalize' to 'uppercase', it works. Thanks for the help guys, you can lock this now!
avatar
jarn
Forumember

Posts : 80
Reputation : 1
Language : English

http://cwentertainment.forummotion.com/

Back to top Go down

Solved Re: Change Username Font.

Post by Ange Tuteur on July 31st 2014, 5:20 pm

Topic archived

Have a good day. ^^
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13223
Reputation : 2960
Language : EN, JA, FR
Location : Macungie, PA

https://github.com/SethClydesdale

Back to top Go down

Back to top


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