Adding Cufon Fonts in YJSG Templates
 

One of the many great things of YJSG powered websites is the possibility to use cufon fonts. Those can really spice up a website in my opinion.

Out of the box YJSG comes with 10 cufon fonts. But what if one of those doesn't meet your needs. Here's a little how-to about adding the cufon font of your liking to a YJSG powered website.

First find a font of your liking. There are many great sites with plenty of free fonts. A simple search will give you all the fonts you could ever want or use.

Then visit cuf�n - fonts for the people and upload your font. The site will transform the font to a cufon font file. Please read the instructions on the site carefully. Not all font files can be transformed and you certainly don't need to have all options checked. Basic latin will do in most cases.

After the font is generated you can save a file called MYFAVFONT.font.js. Save this file in myYJSGtemplate/scr/cufon.

Next open up myYJSGtemplate/yjsgcore/cufonfonts.php. After case10, around line 56 insert case11. It will look like this:
MYFAVFONT of course being the exact name of your generated font:)

Next open up myYJSGtemplate/templatedetails.xml. Around line 200 you will find the cufon fonts being used. Make a mention of the new font by inserting the following line:
One more little thing to finish off. Again in templatedetails.xml around line 680 find the cufon fonts again. Insert option value 11, it will look like this:
Save all the modifications, login to the backend, open up your template manager, select cufon in Element tag override type, and select your new cufon font in Cufon Font-Family.

Read more about cufon fonts pro and contra on Home - cufon - GitHub

How has this changed for 1.7?
 

There is no <filename> in the XML for cufon fonts in 1.7. I made the other changes, but the font did not display. Would you mind updating this post for the current version of Joomla?

Many Thanks, George

Adding Cufon to J 1.5
 

Hi,

There is no <filename> in the XML for cufon fonts in 1.5 either.

Please help. I don�t want to use sIFR.

Hello atrfede.

This is an old tutorial. Some of these steps have been thrown out since the xml file is different now. So that is why you can't find that. We will make an update for this turorial and post it. Please be patient. Thank you.

Oh!. ok. I�ll be patient and we�ll be using siFR meanwhile althought it doesn�t make any happy (hate Flash).

Thanks.

You can try installing a squirrel font.

http://www.youjoomla.com/joomla_supp...1-5-1-6-a.html

Here is a tutorial for that.

Thank you. I'll try that.

I asked about adding a new Cufon font back in September 2011. Has the tutorial been updated. I don't see anything. I would like to change add a Cufon font. I am using Joomla 2.5.9.

Thanks, George

Adding a Cufon Font
 

I figured out how to add a Cufon font. The steps are inserted below.

George

1. Go to: cufon.shoqolate.com/generate/

Create and download a Cufon font JavaScript file. The file will be named similar to this:

futura_700.font.js

Follow the directions on the page, it works.

Note that a font file may not (in some cases) be uploaded directly from the Windows Font folder. Copy the file out of the Windows Font folder and you will be OK to upload.

2. Upload the JavaScript file to the Template folder. I am using YouGrids.

templates / yougrids / src / cufon

You will see other Cufon Font JavaScript files in the folder.

3. In the base template directory, find the templateDetails.xml file. (In this example, the file is found in the yougrids folder.) Open the file for editing. Add the font name to the Cufon Font Family selection list. Use item 11. There are 10 Cufon fonts by default. See below. I added Futura Md. Save the file.

<field name="cufon_font_family" type="yjsglist" default="1" label="CU_FONT_FAM_LABEL" description="CU_FONT_FAM_DESC">
<option value="1">Museo</option>
<option value="2">Andika</option>
<option value="3">CABND</option>
<option value="4">Junction</option>
<option value="5">League Gothic</option>
<option value="6">Tallys</option>
<option value="7">Chunk</option>
<option value="8">Fertigo</option>
<option value="9">Delicious</option>
<option value="10">Molengo</option>
<option value="11">Futura Md</option>
</field>

4. In template yjsgcore folder, find the yjsg_cufonfonts.php file, and open it for editing. Add the font to the list in the same format. Case 10 is a default, I added case 11. Save the file.

case 10:
$cufon_get_file = "Diavlo_500.font.js";
$cufon_get_family="Diavlo";
break;
case 11:
$cufon_get_file = "futura_700.font.js";
$cufon_get_family="Futura Md";
break;

Note that the �get_file� file name must exactly match the name of the uploaded JavaScript file. Additionally, the �get_family� name must exactly match the font family. The font family name is found inside the JavaScript file. Open the Javascript file with NotePad to see the font family name. It is near the top. You are not editing the Javascript, just open, get the font family name, and exit without saving. Here�s a sample:

Cufon.registerFont({"w":196,"face":{"font-family":"Futura Md","font-weight":500,"font-stretch":"normal","units-per-em":"360", ��

5. Go to the Joomla Template Manager, select Cufon Font and then select the newly added font. Go to the site and you should see it.