Fix: Error de Fuente en Facturas PDF de WooCommerce


Uno de los problemas que podemos encontrar en las migraciones es que, al cambiar de hosting, surjan fallos. Recientemente tuve que realizar una migración de una tienda con la plataforma WooCommerce. Mientras verificaba que todo funcionara correctamente, me encontré con un fallo al generar una factura en PDF. Estaba utilizando el navegador Chrome y lo veía tal que así:

Una de las prácticas que también suelo realizar al verificar el funcionamiento es probar en otros navegadores para ver si también funciona correctamente. Si lo abría con otro navegador, como Firefox, podía ver cómo la fuente cambiaba. Se veía mejor, pero todavía tenía algunos fallos de acentos.


Aquí es donde me doy cuenta de que el problema es de la fuente. Cuando sucede esto, que en un navegador se ve de una forma y en otro de otra manera, es porque, al no coger la fuente asignada en la plantilla, el navegador, en vez de lanzar un error, elige la que tiene por defecto. Esto ya me ha ocurrido también en otros programas: al no tener su fuente instalada, cogen una que tengan instalada y se ve de esa forma.

Localizar el archivo

El plugin que la web utiliza para generar las facturas es el PDF Invoices & Packing Slips for WooCommerce. Este plugin tiene las plantillas en la siguiente ruta:

wp-content/plugins/woocommerce-pdf-invoices-packing-slips/templates

Si además cuentas con el plugin de plantillas premium instalado, encontrarás las plantillas en la siguiente ruta:

wp-content/plugins/woocommerce-pdf-ips-templates/templates

Dentro de cada una de las carpetas, encontrarás todas las plantillas instaladas. Cada carpeta representa una plantilla y contiene archivos específicos. Accedemos al panel de control de WordPress para identificar la plantilla que estamos utilizando para generar la factura.

En nuestro caso, empleamos una plantilla premium. Por lo tanto, la ruta específica para mi caso sería la siguiente. Ten en cuenta que para tu situación, probablemente sea diferente:

wp-content\plugins\woocommerce-pdf-ips-templates\templates\Simple Premium

Cambiar la fuente en style.css

Dentro de la carpeta, debemos buscar y abrir el archivo style.css. En este archivo, localizamos el estilo para el cuerpo (body) y dentro de él, encontramos el campo «font-family«.

Una vez localizada esta línea, simplemente cambiamos la fuente a una que tengamos instalada, en nuestro caso, Arial, Helvetica, sans-serif.

Solo queda guardar los cambios y sustituir el archivo modificado en nuestro servidor. Si ahora generamos una nueva factura podemos ver que ha cogido la nueva fuente y se ha corregido el error.

Scroll al inicio