HOW TO: PHPFusion & Cufon
Asked Modified Viewed 1,941 times
asked
In response to several messages connected with my last realisation (www.rapduma.pl) I've decided to write a few words about entering anti-aliasing on the page based on PHPFusion. Used in skin "miracle" is nothing else but, probably the most famous, cufon. It admits not only of font smoothing, what's no more a great achievement but also to attach to our website free-form font, just as we need. A similar effect can be obtained by using sIFR. There's a question - why cufon? There are two things that speak for him: the lightness and the fact that it's fully written in JavaScript. Contention created on the flash slows down the computer (e.g. when there's a large number of elements to smoothing) and needs to strain to human patience and constant loching up and calling to reinstall it. The best solution would be to check by yourself which technology is more atractive for us.
Now, let's go to the point.
1. We enter http://cufon.shoqolate.com/generate.
2. From menu at the top we select download and save the open file as cufon-yui.js.
3. Then we select the font file we’re interested in (I’ll use Arial as an example). We accept the rules and click „Let’s do this!”.
4. We download the file fontname_400.font.js - Arial_400.font.js in my case.
5. Then we throw the files cufon-yui.js and Arial_400.font.js to the includes dir.
6. Next we go to the themes/templates/header.php and in the head section we add:
7. And that’s all. All headers will be smoothed from now.
8. In case we want to use this technique to bigger number of elements we should change the code above into:
I hope it’ll be useful to graphic designers who work with this great system :)
Source: http://dev.slawomirpacyk.pl/2011/03/2...torial-en/
MyPortfolio: http://slawomirpacyk.pl
Now, let's go to the point.
1. We enter http://cufon.shoqolate.com/generate.
2. From menu at the top we select download and save the open file as cufon-yui.js.
3. Then we select the font file we’re interested in (I’ll use Arial as an example). We accept the rules and click „Let’s do this!”.
4. We download the file fontname_400.font.js - Arial_400.font.js in my case.
5. Then we throw the files cufon-yui.js and Arial_400.font.js to the includes dir.
6. Next we go to the themes/templates/header.php and in the head section we add:
Code Download source
<script src='".INCLUDES."cufon-yui.js' type='text/javascript'></script>
<script src='".INCLUDES."Arial_400.font.js' type='text/javascript'></script>
<script type='text/javascript'>
Cufon.replace('h1');
</script>7. And that’s all. All headers will be smoothed from now.
8. In case we want to use this technique to bigger number of elements we should change the code above into:
Code Download source
<script type='text/javascript'>
Cufon.replace(['h1','.smooth']);
</script>I hope it’ll be useful to graphic designers who work with this great system :)
Source: http://dev.slawomirpacyk.pl/2011/03/2...torial-en/
MyPortfolio: http://slawomirpacyk.pl
answered
http://www.php-fusion.co.uk/forum/vie...ost_150624
You also have Google fonts as Fangree_Craig pointed out.
Also the better way of adding the javascript is before functio render_page do this.
[syntaxhighlighter brush=php,first-line=1,highlight=0,collapse=false,html-script=false]if(function_exists('add_to_head'
){
add_to_head("<script type='text/javascript' src='".THEME."cufon-yui.js'></script>";
add_to_head("<script type='text/javascript' src='".THEME."cufon-replace.js'></script>";
add_to_head("<script type='text/javascript' src='".THEME."ITC_Busorama_500.font.js'></script>";
}[/syntaxhighlighter]
You also have Google fonts as Fangree_Craig pointed out.
Also the better way of adding the javascript is before functio render_page do this.
[syntaxhighlighter brush=php,first-line=1,highlight=0,collapse=false,html-script=false]if(function_exists('add_to_head'
){add_to_head("<script type='text/javascript' src='".THEME."cufon-yui.js'></script>"
;add_to_head("<script type='text/javascript' src='".THEME."cufon-replace.js'></script>"
;add_to_head("<script type='text/javascript' src='".THEME."ITC_Busorama_500.font.js'></script>"
;}[/syntaxhighlighter]
Edited by Mangee on 23-03-2011 00:17,
Category Forum
Themes SupportLabels
None yet
Statistics
- Views 0 views
- Posts 1 post
- Votes 0 votes
- Topic users 2 members
2 participants
sonar 10
[url=webmer.pl]www[/url] - my site
[url=extreme-fusion.pl]www[/url] - eXtreme-fusion
[url=demo.extreme-fusion.pl]www[/url] - demo extreme-pack
[url=extreme-fusion.pl]www[/url] - eXtreme-fusion
[url=demo.extreme-fusion.pl]www[/url] - demo extreme-pack
- Newbie, joined since
- Contributed 4 posts on the community forums.
- Started 3 threads in the forums
- Started this discussions
Notifications
Track thread
You are not receiving notifications from this thread.
Related Questions