CODEWITHSUNDEEP
htmlcsswordpressfonts
user3537256
user3537256

Reputation: 61

uploading fonts to wordpress site

what's the easiest and most effective method for uploading fonts to a wordpress site? I have fonts on my computer I'd like to reference instead of google fonts already embedded in. wasn't sure if ftp (and in what location) or an app works best. danke.

Upvotes: 0

Views: 62

Answers (1)

Matthew R.
Matthew R.

Reputation: 4350

There are several things you need to know before embedding a font in your site. I can walk you through the process here:

  1. Make sure the font you want to upload is allowed to be on the web. Some foundries don't want their fonts embedded because people can steal them from the embedding website. Check who makes your font and what you need to do to satisfy their licensing. All Google fonts are open licenses, so you don't have to worry there.
  2. Find the font file on your system. This is usually a .ttf or .otf file. If it is not one of those, it will be difficult to embed them correctly.
  3. Once you have your font, you need to convert it and package it. This is easy with services like FontSquirrel. They will do all of the converting and packaging for you as well as writing the CSS to embed the fonts.
  4. The method you are using to embed the fonts is known as @font-face. This code should be in your stylesheet. Here is a tutorial on using @font-face. Make sure when you put the code in your CSS file that the fonts are in the right directory that you are targeting in the URLs for the fonts in the stylesheet. FYI the normal stylesheet location for Wordpress themes is in your theme folder under styles.css. I believe that FontSquirrel's generated CSS puts the fonts in the same directory as the stylesheet, so they may need to be in the theme's root to work properly. Though, I would suggest putting them in a fonts folder and updating the URLs in the stylesheet.

That's it! It's a little more difficult than just adding a file, but it should work. If you have issues with spacing or lining things up, I have another answer I wrote that might help you out, there as well.

Upvotes: 1

Related Questions