PDA

View Full Version : Awesome free fonts for your forum [TypeKit]


farru
17 Apr 2013, 17:24
By Default, VBulletin uses this font family

Tahoma, Calibri, Verdana, Geneva, sans-serif

And, this is how it looks like on forum home:

https://www.vbulletin.org/forum/

Using TypeKit free fonts, you can change things. And this is what my forum looks like:

https://www.vbulletin.org/forum/

Looking for a live demo? Check Tech Forum (http://forums.techiesay.com/)

What's Typekit?

Typekit is the easiest way to use real fonts on the web.

O.k, enough talk. So this is what you have to do to use TypeKit fonts on your forum:

1) Signup for a free TypKit account, here (https://typekit.com/plans)
2) Once logged in, add your favorite fonts to your kit, and grab the font family code.
3) Also, grab the embed code from your kit and add this to your headinclude template
4) In VBulletin admin area, search and edit forumbits.css and look for this code:

.forumbit_post .foruminfo .forumdata .forumtitle a, .forumbit_nopost .forumbit_nopost .forumrow .forumtitle a


That's the class where you need to add the font family code you have copied in step 2.
This will change the font family for forum titles on homepage.

5) In the same style sheet, look for this code:

.forumbit_nopost .forumbit_nopost .forumrow .forumdata, .forumbit_post .forumrow .forumdata


That's the class where you need to add the font family code you have copied in step 2. Use different code here to make titles and forum description on forum home look different (As seen in above screenshot). Technically, you can replace any font.
Because TypeKit free account comes with only two font families, I have applied it on forum titles and descriptions.

Got any questions? feel free to ask :)

Princeton
22 Apr 2013, 23:08
moved to articles

ForceHSS
23 Apr 2013, 00:10
Looks just like default skin I see no change

farru
23 Apr 2013, 13:29
Looks just like default skin I see no change

Its fonts only, no new theme.

abdobasha2004
26 May 2013, 00:10
nice fonts, however google fonts are better.

Mr basil
09 Oct 2013, 11:15
Where to replace the codes I got from typekit exactly? I get normal code and advanced code so where to put it ?