Intégration de WebFonts

Ce module permet l'intégration de WebFonts dans JPlatform.

Les bénéfices

Ce module permet d'ajouter de nouvelles librairies de WebFonts dans JPlatform (en l'état uniquement la webfont "FontAwesome") afin de les utiliser dans les différentes interfaces utilisant le sélecteur d'icône JPlatform.

Le sélecteur d'icône JPlatform est par exemple utilisé dans les services du tableau de bord des espaces collaboratifs, mais il peut être appelé au travers de formulaire imbriquant ce type de champ (disponible depuis la version 10SP7 de JPlatform).

Le module propose également une interface permettant de

  • déposer une nouvelle webfont 
  • visualiser l'ensemble des icônes des WebFonts déposés avec leur code d'appel
  • choisir les icônes à activer dans le sélecteur d'icône JPlatform et générer les propriétés à déclarer dans le fichier custom.prop ou fichier .prop d'un module

Les fonctionnalités

  • intégrer de nouvelle webfonts dans JPlatform (Jalios intègre par défaut les webfont Icomoon et JIcons)
  • personnaliser le jeu d'icône souhaité et à proposer dans le sélecteur d'icône de la plateforme
  • générer automatiquement les propriétés à déclarer dans les fichiers .prop

Captures d'écran

Les clients aiment

la facilité d'intégration de nouvelle Webfont
la personnalisation simplifié du jeu d'icônes à proposer dans le sélecteur de la plateforme

Informations détaillées

Installation et configuration du module

Ajouter ce module via le gestionnaire de modules depuis l’administration technique et redémarrer JPlatform.

Une fois le module installé, assurez-vous que les propriétés du module sont correctement paramétrées pour votre plateforme.

 

Dépôt d'une nouvelle Webfont

Les WebFonts sont facilement ajoutables depuis l'interface du module. Il vous suffit de déposer le fichier Zip de votre WebFont, le module fait le reste.

Il se décline en plusieurs versions selon la version de la librairie de votre Webfont et du type de licence (les versions de la librairie sont dans la description plugin.xml du module). Selon la version, il y a des différences importantes, notamment sur la gestion des icônes (icône Font ou icônes SVG).

Il intègre en back-office, les informations de chaque Webfont (caractère et code associé).

 

Ce module intègre par défaut les librairies de Webfont suivantes :

  • fontawesome-free-6.4.0-web

 

Depuis les propriétés du module, un bouton permet de choisir les icônes à déclarer dans votre plateforme et qui seront affichés dans le sélecteur d'icône.

Lorsque vous avez sélectionné les icônes souhaitées, le module générera automatiquement les propriétés à déclarer dans les fichiers de propriété (custom.prop ou fichier .prop de vos modules).

Vous pouvez déclarer ces propriétés directement en éditant chacun des fichiers de propriétés

 

Problématique CSS vs JS

Pour l'usage de la librairie FontAwesome PRO, il faut activer soit le CSS, soit le JS mais jamais les deux.
Nous préconisons d'activer uniquement le CSS (et donc de désactiver le JS).
De plus, pour la compatibilité avec les anciennes versions de FontAwesome, il est plus pratique de conserver les tags dans les balises <i> que les tags transformés en <svg>.

Sur le même thème...