What the heck is Cufón?
First you should consider do you even need one?
Maybe you could just use a standard web font and avoid all of this, what are the standard fonts? Read 16 gorgeous web fonts.
You said it was super easy, for you maybe, how do I make one?!
You need to know what character sets are. The basic Character set for English is known as Latin.
Then you have…
Latin extended supplement, or often just called Latin Extended
Latin Extended A
Latin Extended B
Latin Extended C
Latin Extended D
These are the ones that cover most European languages. Remember not all fonts contain all characters.
First make sure you have your font on your local computer, you need to have the font to make a cufon version. There are lots of font sites where you can download fonts, many are free. Check to see if it has the characters you want. Different operating systems have different ways of viewing all of the characters in a font. Or just try typing the characters into a word processing program in that font. Do they work? If they do you are good to go. If not search the web, see if you can find a version with a more complete character set.
Storefront Themes Fonts
There are two main reasons you may want to make a cufon font, because you want to use a new font or because the included font does not include some special characters that your language requires, for example È or Æ. If you are using a WordPress theme by Storefront Themes then your font is available online for free, search for it by name, you should not have trouble locating it. See the end of this post for a few I have already made into cufon with extended character sets.
Making the font
The next step is to make the cufon font. Go to the cufon font site.
On that page Section 1. “Select the font you’d like to use”
You will be asked to upload your font and make various choices.
First select the regular font and upload from your computer. Then decide if you need bold, italic etc versions and upload if you do. If you will not, leave them out and keep the file smaller.
Ignore the text box. Confirm you have a licence by checking the box, you do right!
Section 2. “Include the following glyphs (if available)”
Select what Character sets you need to include. Do not include All, it will be a really big file which your users will not appreciate.
You can select Basic Latin to get all of the basic Uppercase, Lowercase, Numerals, Punctuation. Then you need to choose what extended character sets you want. How do you know? Check out these references click a set to see what characters it includes. Check only the sets you need. If it is really only a couple of extra characters you need you can just select basic Latin and then enter those extra characters in the “add also these single characters ” box
Section 3. “Security”
Add your domain to limit the file for use there.
Section 4. “Performance and file size”
Leave it at defaults.
Section 5. “Customization (for 3rd-party scripts only)”
Leave it default which is…
Section 6. “Terms”
Check the box to Acknowledge.
Now you have done all of that click the “Let’s do this!” button. There will be a short wait and then a file will download to your computer. It will have the file extension .js. This is your cufon font file. I told you it was easy.
Add it to your theme. This is a a whole different topic. Some stuff to get you started can be found here which is specific to Storefronts Gridport Theme. It does give you a general idea though and includes links to more information. If you want to test your new font using a lot of the special characters at once you can copy and paste whole character sets, drop them into a post and see if the characters render. You may need to wrap them in a heading tag to test in a Storefront theme as they only use cufon in headings.
Storefront Themes Font downloads
You will need to add these fonts to the appropriate location according to your theme. Usually they are found in the sub folder “fonts” or “js”. You need to find the font you wish to replace with your new extended version. Then give your new font the same name. Rename the existing font, for example add -original to the end and put your new font into the folder
Museo Latin Basic and Latin Extended. The coverage seems pretty good. Extended includes Pound and Yen currency symbols by default, I also added Euro.
Museo Latin Basic, Latin Extended, WordPress punctuation, Latin A & B Includes all of the above plus coverage of Latin A is pretty complete, B only has about 5 characters. Museo can also include a couple of Greek characters, some Math operators and more. You can see what it contains here, although this is not the actual weight used.
Droid Serif Latin Basic and Latin Extended. The coverage seems pretty good. Extended includes Pound and Yen currency symbols by default, I also added Euro.
Droid serif Latin Basic, Latin Extended, WordPress punctuation and Latin A & B Includes all of the above plus coverage of Latin A is pretty complete, B only has about 10 characters. Droid serif can also include a 75 Greek characters, some Math operators and more. You can see what it contains here, although this is not the actual weight used.