-
AuthorPosts
-
spain777 Friend
spain777
- Join date:
- January 2007
- Posts:
- 13
- Downloads:
- 0
- Uploads:
- 0
- Thanks:
- 2
- Thanked:
- 1 times in 1 posts
May 28, 2009 at 7:38 am #141493Can we add more fonts in JaPariiti ?
I tried installing JsIFR3 and it would not work with JaPariiti. đŽ
Is there a way to install a font replacement module such as Cufon
thanking anyone in advance for your replies !
Best Regards,
Spain777wooohanetworks Friendwooohanetworks
- Join date:
- September 2008
- Posts:
- 1239
- Downloads:
- 0
- Uploads:
- 2
- Thanks:
- 148
- Thanked:
- 138 times in 41 posts
May 30, 2009 at 1:06 pm #306206http://wiki.github.com/sorccu/cufon/usage
<blockquote>Usage
CufĂłn has been designed with developers in mind. Therefore the API is simple and configuration is usually not needed at all, as most of the needed information is provided by CSS style sheets.See API for more detailed, JavaScript-specific documentation. For experienced users only!
Prefer video? Try the helpful screencast by Jeffrey Way
Step 1 â Get cufĂłn!
It is highly recommended that you always use the YUI-compressed version of cufĂłn, available from the cufĂłn website.Updating to a newer version? Just replace your old cufon-yui.js with the new one and youâre good to go. Fonts need not be converted again.
Should you experience problems or if you just want to poke around a little, you may also use the uncompressed version, available from GitHub.
Step 2 â Generate a font
You may use the font generator at our website or run a copy of your own. If you plan on going for the latter option youâre probably clever enough to figure out how to get it running â the source is available from GitHub.The name of the resulting file will include the name of the font and the weight of the font (as a number â 400 is equivalent to ânormalâ and 600 means âboldâ). So, for example, the bold version of Bitstream Vera Sans would result in a file called Bitstream_Vera_Sans_600.font.js. The name of the file doesnât actually matter at all, but it makes it easier for you to identify your fonts.
Using the generator should be pretty straightforward, but ideas that enhance usability are always welcome. Please use our Google Group for that.
Step 3 â Replacing text
<!DOCTYPE html PUBLIC “-//W3C//DTD HTML 4.01//EN”
“http://www.w3.org/TR/html4/strict.dtd”>
<html>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″>
<script src=”cufon-yui.js” type=”text/javascript”></script>
<script src=”Frutiger_LT_Std_400.font.js” type=”text/javascript”></script>
<script type=”text/javascript”>
Cufon.replace(‘h1’);
</script>
</head>
<body>
<h1>This text will be shown in Frutiger LT Std.</h1>
</body>
</html>
For the purposes of this example you may ignore everything that is not contained by <head>.So what exactly happens here?
First, we include the YUI compressed version of cufĂłn that you should always use.
Then we include the font that we converted in Step 2. Nothing special here, you include it just like you would any other JavaScript file. So far so good.
Then we get to the magic part. We want to replace all <h1> elements in the document. And thatâs exactly what the tell cufĂłn to do, with Cufon.replace(‘h1’). Nothing else is needed, cufĂłn will use the CSS rules associated with the elements and determine what to do. You should not place Cufon.replace inside $(document).ready or similar functionality because it will make Step 4 ineffective.
In order to avoid unnecessary duplication cufĂłn does not come bundled with a selector engine, which means that by default youâll only be able to use tag names (such as h1) as selectors. However, cufĂłn detects quite a few popular JavaScript frameworks (such as jQuery, MooTools, Dojo and Prototype) automatically, so if youâre using one youâll only need to include it before cufĂłn and things like Cufon.replace(‘#content > h1:first-child’) and Cufon.replace(‘#nav a’) will work just fine.
Step 4 â Making Internet Explorer behave
Unfortunately one problem remains with Internet Explorer. In most cases, there is a short but visible delay before the text is replaced. You can avoid this issue by inserting the following snippet right before the closing </body> tag (or before any external scripts such as Google Analytics):<script type=”text/javascript”> Cufon.now(); </script>
And the delay is gone.Note: This step will hopefully become obsolete in the future.
Using multiple fonts
To use multiple fonts you only need to specify which font you want to use and youâre set:<!DOCTYPE html PUBLIC “-//W3C//DTD HTML 4.01//EN”
“http://www.w3.org/TR/html4/strict.dtd”>
<html>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″>
<script src=”cufon-yui.js” type=”text/javascript”></script>
<script src=”Frutiger_LT_Std_400.font.js” type=”text/javascript”></script>
<script src=”Myriad_Pro_400.font.js” type=”text/javascript”></script>
<script type=”text/javascript”>
Cufon.replace(‘h1’, { fontFamily: ‘Frutiger LT Std’ });
Cufon.replace(‘h2’, { fontFamily: ‘Myriad Pro’ });
</script>
</head>
<body>
<h1>This text will be shown in Frutiger LT Std.</h1>
<h2>This text will be shown in Myriad Pro.</h2>
</body>
</html>
If not specified, cufĂłn will use the font that was loaded last (in this case it would be Myriad Pro), which is why there was no need to specify the font in the first example.Notes
For simplicity, all examples use the HTML4 strict doctype instead of an XHTML doctype. You may use any doctype you want but a strict (X)HTML doctype will always yield best results. Quirks mode isnât supported but might also work in some cases.All cufĂłn-enabled pages must be UTF-8 encoded. Compatible encodings, such as US-ASCII, are also fine.</blockquote>
-
AuthorPosts
This topic contains 2 replies, has 2 voices, and was last updated by wooohanetworks 15 years, 5 months ago.
We moved to new unified forum. Please post all new support queries in our New Forum