Cómo Generar Acentos Y Otros Caracteres Con Cufon

Cómo generar acentos y otros caracteres con Cufon

VeraSoul Software
3 Min.

Cómo Generar Acentos Y Otros Caracteres Con CufonLa mayoría de las plantillas (temas) WordPress actuales vienen con Cufón integrado. Cufón permite cambiar el estilo de las fuentes, pudiendo dar un nuevo estilo a nuestra plantilla con cualquier tipo de fuente por muy rara que parezca.

Aunque no siempre todo es relativamente así de simple y muchos suelen tener problemas a la hora de poder visualizar algunos caracteres, entre ellos nos podemos encontrar con la letra “ñ” o aquellos caracteres que han de ir acentuados.

Para solventar dicho problema debemos seguir una serie de pasos que podrás ver a continuación, pero para ello previamente debemos disponer del fichero de la fuente que vayamos a necesitar en su formato correspondiente, que puede ser: otf, pbf o bien el más empleado y conocido ttf.

  1. Subimos el tipo de fuente al generador Cufón .
  2. Indicar el nombre de la fuente y aceptamos la licencia.
  3. Donde dice “Include the following glyphs” seleccionamos las opciones “Basic Latin” y “WordPress punctuation”, esta última no es necesaria para los acentos pero es útil si lo usamos con Wp. Al final de las opciones dice “..and also these single characters”, este es el lugar donde debemos incluir los caracteres que deseamos que aparezcan y puedan ser visibles: áÁéÉíÍóÓúÚñÑ
    En este paso podemos incluir todos aquellos caracteres que queramos, por ejemplo, “¿”, “×”, “÷”, “%” “$”, etc…
  4. En “Permormance & file size” se recomienda dejarlo tal y como está, a menos que sea necesario cambiarlo.
  5. Finalmente debemos aceptar los términos y pulsar el botón “Let´s do this!”. Cufon creará un fichero .js que podemos descargar y alojar donde se encuentran las fuentes de nuestra plantilla.
    No podemos olvidar mencionar un plugin para WordPress que permita llevar a cabo la utilización de estas fuentes, así que si lo necesitan, dejo aquí algunas explicaciones:

Cufón para WordPress es una maravilla de plugin y además es fácil de instalar y de asociar rápidamente con las distintas etiquetas de nuestro estilo. Simplemente debemos descargarlo e instalarlo como es habitual.

Las fuentes que vayamos a emplear deben ser convertidas, como dije anteriormente a formato .js y subirlas a la carpeta fonts de dicho plugin.

Código en nuestro estilo…

Editamos nuestro fichero style.css y llevamos a cabo los siguientes cambios para re-emplazar las etiquetas deseadas.

Cufon.replace('h1', { fontFamily: 'Fuente' });

“Fuente” es el nombre de del fichero .js sin olvidarnos de la extensión.

Siempre podemos aplicar más efectos, para ello empleamos CSS2 y le damos un toque de degradado.

Cufon.replace('h1', {
color: '-linear-gradient(red, #fff, #23d559, rgb(0, 0, 0))'
});

Si quieres saber más sobre los estilos que puedes aplicar, debes echar un vistazo a esta Wiki.

Compartir
12 Comentarios