Descargar este script + « Regresar
<![CDATA[
* Obviamente primero necesitamos una fuente con caracteres latinos y que permita la distribución embebida en web.
* Luego la transformamos y nos guardamos el archivo, al igual que el cufon-yui.js comprimido.
* Cargamos y configuramos en el header (Sí o sí en UTF-8!!! y primero cargamos la hoja de Estilos):
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script src="cufon-yui.js" type="text/javascript"></script>
<script src="Vegur_300.font.js" type="text/javascript"></script>
<script type="text/javascript">
Cufon.replace('h2');
Cufon.replace('h3');
</script>
</head>
<body>
* Luego en el footer agregamos esto para que en IE no haga "flickr deffect" --> jajaja ^_^ (justo antes del analytics o /body):
<script type="text/javascript"> Cufon.now(); </script>
* Si queremos ser más exquisitos, podemos integrarlo con jQuery con sólo llamarla primero. Cufón la va a autodetectar y nos permitirá usar selectores más precisos, ej:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script src="jQuery-minified-132.js" type="text/javascript"></script>
<script src="cufon-yui.js" type="text/javascript"></script>
<script src="Vegur_300.font.js" type="text/javascript"></script>
<script type="text/javascript">
Cufon.replace('#content > h1:first-child');
Cufon.replace('#nav a');
</script>
</head>
<body>
* Si queremos usar múltiples fuentes, sólo las cargamos y pasamos como parámetro un json pedorro con el atributo "fontFamily" y el valor del nombre, así:
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script src="cufon-yui.js" type="text/javascript"></script>
<script src="Vegur_300.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: 'Vegur' });
Cufon.replace('h2', { fontFamily: 'Myriad Pro' });
</script>
</head>
<body>
<h1>Esto se va a mostrar en Vegur.</h1>
<h2>Y esto en Myriad Pro.</h2>
</body>
MORTAAAL ^_^ KOMBAAAT !!!
Cualquier cosa, RTFM!!! --> http://wiki.github.com/sorccu/cufon/usage
Nota sobre el CSS:
Ya dijimos que la hoja de estilos se carga primero.
Reglas aceptadas:
font-size, font-style, font-weight, line-height, word-spacing y gradientes.
También el :hover en los "a".
Para más info ver: http://wiki.github.com/sorccu/cufon/styling
]]>