Expresando Estilo: Incorporando Tipografías en Proyectos de Rails

Por Andrés Howard | June 23

Si queremos usar una tipografía custom en nuestra aplicación de Rails tenemos que seguir los siguientes pasos:

1. Crear la carpeta app/assets/fonts y dejar ahí adentro el archivo de la tipografía.
2. Agregar la siguiente línea al archivo app/assets/config/manifest.js

//= link_tree ../fonts

3. Definir el font-face para la tipografía nueva en un nuevo archivo app/assets/stylesheets/custom.scss

@font-face {
  font-family: 'Nombre tipografía';
  src: font-url('nombre-archivo-tipografia')
}

4. En el archivo app/assets/stylesheets/application.scss al final agregar la línea

@import "custom";

5. Usar la tipografía en la aplicación, por ejemplo agregando en app/assets/stylesheets/custom.scss algo así

body {
  font-family: 'Nombre tipografía';
}

Con esto podemos usar cualquier tipografía que queramos en nuestra aplicación.