<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Mike Afford Media Blog &#187; fonts</title>
	<atom:link href="http://www.mikeafford.com/blog/category/fonts/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.mikeafford.com/blog</link>
	<description>Mike Afford is a Graphic Designer for TV and Web based in Leitrim, Ireland.</description>
	<lastBuildDate>Thu, 02 Feb 2012 23:52:24 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.8.4</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>Cufón text replacement in Wordpress</title>
		<link>http://www.mikeafford.com/blog/2009/09/cufon-text-replacement-in-wordpress/</link>
		<comments>http://www.mikeafford.com/blog/2009/09/cufon-text-replacement-in-wordpress/#comments</comments>
		<pubDate>Fri, 25 Sep 2009 11:05:21 +0000</pubDate>
		<dc:creator>Mike</dc:creator>
				<category><![CDATA[fonts]]></category>
		<category><![CDATA[technical]]></category>
		<category><![CDATA[websites]]></category>
		<category><![CDATA[blogging]]></category>
		<category><![CDATA[customising]]></category>
		<category><![CDATA[template]]></category>
		<category><![CDATA[themes]]></category>
		<category><![CDATA[typography]]></category>
		<category><![CDATA[web design]]></category>
		<category><![CDATA[wordpress]]></category>

		<guid isPermaLink="false">http://www.mikeafford.com/blog/?p=345</guid>
		<description><![CDATA[Recent experiments with Cufón text replacement, and the wp-cufon Wordpress plugin.]]></description>
			<content:encoded><![CDATA[<div class="wp-caption alignleft" style="width: 225px"><a href="http://www.mikeafford.com/images/store/tolkien-font-cufon-example.png"><img alt="Tolkien Fonts - cufon text replacement example" src="http://www.mikeafford.com/images/store/tolkien-font-cufon-example-small.png" title="Tolkien Fonts - cufon text replacement example" width="215" height="157" /></a><p class="wp-caption-text">Tolkien Fonts - cufon text replacement example</p></div>I&#8217;ve recently been experimenting with <strong>Cufón</strong> text replacement, and decided to put it to use on <a href="http://www.themoment.co.uk/tolkien/category/books-by-tolkien/" target="_blank">a site I&#8217;ve been messing about with</a>. I&#8217;d also been converting the whole thing to a Wordpress-powered site (more on that later), so it seemed to make sense to look for a plug-in to do the job.</p>
<p>So, the plugin is called <strong>WP-Cufon</strong> and you can get it at <a href="http://wordpress.org/extend/plugins/wp-cufon/" target="_blank">wordpress.org/extend/plugins/wp-cufon/</a></p>
<p>It&#8217;s quick to install, has good documentation, and it&#8217;s easy enough to specify some rules to control the text replacement on your site.</p>
<p>So for example I&#8217;ve used :</p>
<p><code>Cufon.replace('h1', { hover:true });<br />
Cufon.replace('h2', { hover:true });<br />
Cufon.replace('h5');<br />
Cufon.replace('#navbar a');</code></p>
<p>which replaces the font for h1, h2, h5 headings and any link text within the &#8216;navbar&#8217; div with a special font of my own making. All of the subsequent styling is covered by CSS. It really is very simple to set up.</p>
<p>You need to convert your font first into a format that Cufon can handle &#8211; there&#8217;s a <a href="http://cufon.shoqolate.com/generate/" target="_blank">Cufon generator</a> that does the whole thing very neatly. It also, importantly, allows you to limit usage to certain domains to protect the font from use elsewhere.</p>
<p><span id="more-345"></span>I&#8217;d previously looked at <a href="http://www.mikeindustries.com/blog/archive/2004/08/sifr" target="_blank">Scalable Inman Flash Replacement (sIFR)</a> but I have to say I think Cufón may have the edge if only for ease of set-up &#8211; although, granted a lot of the hard work has already been done by the plug-in. Oh, and Cufon doesn&#8217;t use Flash.</p>
<p>I don&#8217;t claim to understand exactly <em>how</em> Cufon works, but if you&#8217;re interested in that kind of thing have a look at <a href="http://wiki.github.com/sorccu/cufon/about" target="_blank">http://wiki.github.com/sorccu/cufon/about</a> which goes into all the nitty-gritty.</p>
<p>And here&#8217;s a link to <a href="http://www.tobias-battenberg.de/wp-cufon/" target="_blank">the creator of the wp-cufon plugin, Tobias Battenberg</a></p>
<h3>OK, Tolkien fans</h3>
<p>So this next bit is only really of interest to fans of <strong>The Lord of the Rings</strong>&#8230; (look away now if hobbits and dragons aren&#8217;t your thing!). No really.</p>
<p>The site I&#8217;ve used Cufon on is a <a href="http://www.themoment.co.uk/tolkien/category/books-by-tolkien/" target="_blank" title="Tolkien books">Tolkien book collecting site</a> &#8211; and I created a special font that brings to mind the calligraphy of the author J.R.R.Tolkien &#8211; I was pretty pleased with the end result, so if anyone&#8217;s interested they can buy a copy of <a href="http://www.mikeafford.com/buy/tolkien-font.html" target="_blank" title="Tolkien font"><strong>Tolkienesque Regular</strong> (in Truetype font format) from my store</a>.</p>
<p>I also ended up tackling another Wordress theme design from scratch &#8211; so the entire site has a kind of &#8216;Tolkienesque&#8217; feel to it. That&#8217;s the name I gave to the theme too.</p>
<p><div class="wp-caption alignleft" style="width: 545px"><a href="http://www.themoment.co.uk/tolkien/books-by-tolkien/middle-earth-related/history-of-middle-earth/the-peoples-of-middle-earth-1st-edition/" target="_blank"><img alt="Tolkien Wordpress theme" src="http://www.mikeafford.com/images/store/tolkien-font-example-website.png" title="Tolkien Wordpress theme" width="535" height="706" /></a><p class="wp-caption-text">Tolkien Wordpress theme</p></div>
<p>The Wordpress theme makes heavy use of categories to organise the 400-odd entries, and has a neat &#8216;Random Item&#8217; widget that I made to pull a text link and the first thumbnail image from a random post. Anyway, I was quite pleased with the end result. It&#8217;s been a labour of love built in spare minutes snatched here and there over the last few months.</p>
<p>But I&#8217;m most pleased by the fact that I can now use any old font I like in Wordpress, subject of course to  EULAs and other <a href="http://www.fontembedding.com/fonts-and-the-law/" target="_blank">legal niceties</a>, or at least until the legal quagmire surrounding <strong>@font-face</strong>, font embedding and linking gets sorted out. </p>
]]></content:encoded>
			<wfw:commentRss>http://www.mikeafford.com/blog/2009/09/cufon-text-replacement-in-wordpress/feed/</wfw:commentRss>
		<slash:comments>8</slash:comments>
		</item>
	</channel>
</rss>

