Tutoriels sur Joomla et la création de site

Gantry 5 prend en charge la librairie de polices d’icônes Font Awesome’s intégrée directement à sa base. Cela signifie que toute personne utilisant un modèle propulsé par gantry aura la possibilité d'utiliser l'une de ces polices vectorielles incroyables partout sur sa page.

Celles-ci servent comme des alternatives légères à des fichiers d'image, peuvent ajouter un élément visuel à une option de menu ou donner un accent accrocheur à un bloc de texte. Vous pouvez les ajouter à particules, ainsi qu’à des champs dans le panneau d'administration de votre thème Styles pour ajouter un élément configuré facilement à votre site.

Utilisation du sélecteur d’icône

1. Search : Fonction de recherche
2. Fixed width : donne une largeur fixe à l’icône
3. Spinning : fait tourner certaines icônes en permanence (icônes d’attentes par exemple)
4. Size : régle la taille de l’icône (large, 2x, 3x, 4x, 5x)
5. Rotation : oriente l’icône : (vertical flip, horizontal flip, rotate 90°, rotate 180°, rotate 270° )
6. Select : vous permets d’affecter licône choisi au champ de votre outline)

Ajouter le sélecteur d’icône à votre Site

Le sélecteur d’icones est un input (saisie) Gantry 5. Si vous souhaitez l’ajouter à votre template ou particule, vous le ferez en assignant la saisie en tant que input.icon dans le fichier YAML associé.

Voici un exemple du code YAML nécessaire pour ajouter un champ sélecteur icône aux paramètres d’une particule qui pourrait ensuite être mis à votre disposition dans la particule.

icon:
  type: input.icon
  label: Icon
  description: Select the icon you would like to use.
  default: fa fa-rocket

Un parfait exemple de ce champ en action est dans la particule to top, qui fait partie de l’ensemble de particules de base de gantry 5.

Vous pouvez trouver les fichiers totop.html.twig et totop.yaml dans ROOT/media/gantry5/engines/nucleus/particles/.

Ici, vous pouvez voir exactement comment le champ input.icon est ajouté et utilisé dans la particule.

Vous pouvez trouver plus d'informations sur la façon d'utiliser les fichiers YAML dans Gantry 5 dans notre guide.