Changer la Police

Créé: 06/02/2019
Dernière mise à jour: 26/04/2022
Nombre de vues pour le message: 6369

Avec le logiciel de facturation VosFactures, vous pouvez modifier le format d'impression (mise en page) de vos documents, en créant de cette manière des documents personnalisés à l'image de votre entreprise. Cela est possible grâce aux codes CSS que vous pouvez facilement insérer dans les paramètres de votre compte (en savoir plus). 

  1. Modifier la Police
  2. Modifier la police d'un Champ en particulier

Modifier la Police

Vous pouvez modifier la police de caractère de l'ensemble des éléments de vos factures et autres documents de facturation, quel que soit le format par défaut choisi.
Pour cela deux options :

  • Copiez le code CSS correspondant au type de police souhaité, puis collez-le dans le champ "Configuration de l'impression par CSS" disponible depuis vos Paramètres > Paramètres du compte > Paramètres d'impression > Configuration. N'oubliez pas de sauvegarder.
} @media all {
  .invoice_outline {
    font-family: family-name !important;
  }

où "family-name" doit être remplacé par le nom de la police de votre choix.

  • Copiez le code CSS redirigeant vers un lien URL :
@font-face {
    font-family: 'nom-de-la-police';
    src: url('lien.eot');
    src: url('lien.eot') format('embedded-opentype'),
         url('lien.woff') format('woff'),
         url('lien.ttf') format('truetype'),
         url('lien.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}

Il est possible de télécharger le lien directement depuis Google fonts : https://fonts.google.com/.
 


Remarques

Il est conseillé d'indiquer plusieurs types de police, les uns à la suite des autres séparés par une virgule. De cette manière, au cas où le système ne serait pas capable de mettre le texte dans la police indiquée en premier, le système essayera avec la police suivante.
En fonction de la police choisie, il est possible que vous ayez besoin d'ajouter "sans-serif" ou bien "serif".

Exemples

} @media all { 
  .invoice_outline {
    font-family: "Times New Roman", Times, serif !important;
  }

où la police des documents de facturation est changée en Times New Roman. 
 

} @media all { 
  .invoice_outline {
    font-family: Arial, Helvetica, sans-serif !important;
  }

où la police des documents de facturation est changée en Arial. 


Modifier la police sur un Format en particulier 

Comme vous le savez vous pouvez choisir parmi plusieurs formats (mise en page) différents. Si vous utilisez plus d'un de ces formats, et que vous souhaitez modifier le type de police sur un format en particulier, il vous faut alors spécifier le nom du format qui doit être visé par la modification, afin de ne pas affecter les autres formats: 

} @media all {
  .invoice_outline.encadre {
    font-family: "Times New Roman", Times, serif !important;
  } 

où ".encadre" correspond au format Encadré. Voici la liste des classes CSS pour changer la police d'un format:

  • .classic pour le format Classique
  • .encadre pour le format Encadré
  • .gray pour les formats Gris et Bleu
  • .black pour le format Noir simple
  • .vf  pour tous les formats Vosfactures

Vous l'aurez remarqué, il n'est pas possible de changer la police sur les formats Standard.

Exemple

Facture au format Classique, avec police par défaut :


Facture au format Classique, avec changement de police (Calibri) :


Modifier la police d'un Champ en particulier

Si besoin, vous pouvez changer la police d'un champ en particulier en ajoutant la classe ou l'id du champ en question. 
Exemple : modifier la police du champ "Objet": 

} @media all { 
  #title {
    font-family: "Times New Roman", Times, serif !important;
  }


N'hésitez pas à nous contacter si besoin. 


Pour aller plus loin

Vous pouvez également changer la taille de la police



Retour


Commentaires

Avatar sugester medium
Sandra
Bonjour,

Quelles sont les font autorisées ?
Comment appliquer SF Pro par exemple : https://developer.apple.com/fonts/
Est-ce qu'on peut l'importer au niveau du css ?

Merci d'avance !

20 janvier 2020 01:56:27


identifiant
identifiant
Bonjour,
Il semblerait que les fonts du lien que vous nous avez envoyé ne sont pas pris en compte. Nous attendons le retour de notre Développeur et reviendrons vers vous dès que possible.

20 janvier 2020 09:03:35


Avatar sugester medium
Sandra
Bonjour,
Merci pour votre réponse rapide :)
Est-il possible d'avoir un détail des fonts possibles ?

Bien à vous

20 janvier 2020 12:51:51


identifiant
identifiant
Bonjour,
En principe ce sont les polices de Google fonts qui sont prises en compte par notre système : https://fonts.google.com/.
Vous pouvez ajouter la police à l'aide d'un lien si vous préférez, comme vu sur le tutoriel.

23 janvier 2020 17:22:06


Ajouter un commentaire