Cómo introducir tus propios tipos de fuente en una plantilla

Creado: 17/05/2019
Última actualización: 09/11/2023

nº de visitas de la entrada: 1417

Si estás creando tu propia plantilla de factura y deseas usar fuentes personalizadas en ella, puedes agregarlas de dos formas:

Instalar fuentes en el archivo CSS según se describe a continuación:

@font-face {
    font-family: 'NOMBRE-DE-FUENTE';
    src: url('SCIEZKA-DO-PLIKU-CZCIONKI.eot');
    src: url('SCIEZKA-DO-PLIKU-CZCIONKI.eot') format('embedded-opentype'),
         url('SCIEZKA-DO-PLIKU-CZCIONKI.woff') format('woff'),
         url('SCIEZKA-DO-PLIKU-CZCIONKI.ttf') format('truetype'),
         url('SCIEZKA-DO-PLIKU-CZCIONKI.svg') format('svg');
    font-weight: normal;
    font-style: normal;

}


o descargar fuentes de google fonts como se muestra a continuación:
 

<link href="//fonts.googleapis.com/css?family=NAZWA-CZCIONKI​:400,700" rel="stylesheet" type="text/css" />


La fuente descargada puede verse asi:

@import url('https://fonts.googleapis.com/css?family=Lato'); 

Tenemos que crear una plantilla nueva yendo a Ajustes > Ajustes de cuenta > Plantillas, elegir la plantilla básica y en la parte superior de CSS añadir lineas con importación y:


*{ 
font-family:'nombre de fuente'; 

¡Ojo! 
Al añadir fuentes desde tu propio servidor debes configurarlo adecuadamente. Este método se llama CORS (Cross-origin resource sharing). En esta página puedes encontrar cómo hay que configurar en tu servidor.

http://enable-cors.org/server.html

Descripción general de CORS:

http://en.wikipedia.org/wiki/Cross-origin_resource_sharing

 

Ejemplo de CORS para AWS S3:

 

<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
    <CORSRule>
        <AllowedOrigin>*</AllowedOrigin>
        <AllowedMethod>GET</AllowedMethod>
        <MaxAgeSeconds>3000</MaxAgeSeconds>
        <AllowedHeader>*</AllowedHeader>
    </CORSRule>
</CORSConfiguration>

 



Atrás