How to use any font in wordpress and any website

Yesterday a customer specifically requested me a font for his web page menu. Of course this was not Arial. After much struggle I found a surprisingly simple solution using CSS. To do this we use the @ font-face rule and fonts in Open Type (. Otf) or True type format (. Ttf) This method works [...]

Yesterday a customer specifically requested me a font for his web page menu. Of course this was not Arial. After much struggle I found a surprisingly simple solution using CSS.

To do this we use the @ font-face rule and fonts in Open Type (. Otf) or True type format (. Ttf)

This method works for Internet Explorer 4 (haven’t tested yet), Firefox 3.5 and Safari 3.

Download the font kit. Fontsquirrel has a section for @font-face kits: Fontsquirrel http://www.fontsquirrel.com/fontface these kits have both. Tft like. Otf for explorer, and the best the kits are FREE.

For this example I’m using Highland Gothic

After downloading the kit we need to upload it to the main directory of our website. Only the fonts NOT THE CSS demo nor the THAT COMES IN THE KIT (stylesheet.css).

For wordpress folder we upload it in our theme folder (wp-content/themes/example)

Now open the style.css file that is included in the kit (stylesheet.css) and copy the complete rules

Open the style sheet of our theme and paste the complete rules.

Apply the font style on the section you want on your page, an H1, etc.. In this particular case I apply it in the properties menu 2.

To do this just type the name of the typeface as shown on the demo track as a first option and select a second choice. In this case it was Arial.

Upload your stylesheet and that’s all. On my client site is working to perfectly

Now you can use any font on a website

If you have any questions or a different  method please send us your feedback.

Tags: any font on web site, wordpress tutorial

You may also like these stories:

14 Comments to How to use any font in wordpress and any website

1. 

   Aprendi mucho
rourry-online on March 9th, 2010
2. 

   Thanks the author for article. The main thing do not forget about users, and continue in the same spirit. http://odessacity.net/
ZAREMA on March 21st, 2010
3. 

   The subject is fully clear but why does the text lack clarity? But in general your blog is great.
gualetar on March 22nd, 2010
4. 

   Правильно написал, только для чего.
Kinoshnik on April 14th, 2010
5. 

   Good share,you article very great, very usefull for us…thank you
free trial on April 22nd, 2010
6. 

   Thank you for your great

   content.
nfl jerseys throwback classic on April 22nd, 2010
7. 

   Nice Information.. Thx for sharing this

   information
Tiffany Jewelry on April 24th, 2010
8. 

   Thank you for Posting & I got to read nice information on your site.
Forex Marketiva on May 12th, 2010
9. 

   great experience, dude! thanks for this great post wow… it’s very wonderful report.
Wholesale sunglasses on June 5th, 2010
10. 

    I agree with your Blog and I will be back to check it more in the future so please keep up your work. I love your content & the way that you write. It looks like you’ve been doing this for a while now, how long have you been blogging for?
wholesale sunglasses on June 14th, 2010
11. 

    yeah! this is a super cool!
mypadmedia review on July 4th, 2010
12. 

    Was an interesting article, thank you..
best registry cleaner on July 26th, 2010
13. 

    Great post, thanks. Needed more pictures though.
Coloring Pages on August 5th, 2010
14. 

    Cool post cheers, definitely consider a follow up post.
car alarms on August 22nd, 2010