Gantry 5 comprend un nouveau Sélecteur de polices qui vous donne la possibilité de sélectionner des polices pour une variété de situations, y compris les templates, les particules et plus encore.
Le sélecteur de police facilite le choix rapide des polices dans les particules.Le sélecteur apparaît lorsque vous cliquez sur un champ spécial dans le backend qui vous donne la possibilité de définir une police pour une particule, ou même pour le thème lui-même.
Basé sur Google Fonts, le sélecteur de polices vous donne un accès immédiat à plus de 600 polices libres.
Vous pouvez trouver plus d’informations sur l’ajout d’une police dans le sélecteur de polices (ainsi qu’à votre thème en général) dans notre guide des polices.
Parcourir les polices de caractères
-
champ de texte de test: Entrez le texte que vous souhaitez voir dans différentes polices ici.
-
recherche: Utilisez ce champ pour rechercher une police par son nom. Le numéro dans le coin en haut à droite du champ indique combien de résultats correspondent à votre chaîne en cours.
-
Navigateur de polices: Les polices disponibles sont répertoriées dans cette zone du sélecteur de police. Vous pouvez faire défiler vers le bas pour voir toutes les différentes options, chacune affichant votre texte de test dans la police associée. Pour sélectionner une police, cliquez sur la case à cocher située à gauche de la police que vous souhaitez utiliser.
-
Catégories: Ce paramètre permet de filtrer les polices par catégorie. Il s’agit d’un outil utile pour affiner votre recherche par type de police, plutôt que de faire défiler l’intégralité de votre bibliothèque.
-
Subsets (sous-ensembles): Ce paramètre vous donne la possibilité de filtrer les résultats par sous-ensemble. Par exemple, vous pourriez rechercher une police précise en caractères latins.
-
Select: Utilisez le bouton de sélection vert pour valider votre choix de police (énumérés dans le texte directement à gauche). Pour choisir une police, il suffit de sélectionner la case à cocher dans la liste des polices dans le navigateur de la police.
Lorsque vous cliquez sur l’icône polices à droite du champ sélecteur de polices, une fenêtre apparaît qui vous permet de taper une phrase et de la voir présentée dans plus de 670 différentes polices de caractères de la librairie Google Font.
Pour vous faciliter la vie, vous pouvez filtrer ces résultats par catégorie et sous-ensemble, ainsi que rechercher une police spécifique à l’aide de l’outil de recherche dans le coin supérieur droit du popup.
Il s’agit d’une manière très simple et rapide d’obtenir non seulement un aperçu de ce à quoi ressemblerait un bloc de texte avec une police différente, mais aussi d’appliquer cette police sur votre page la choisissant en simplement et en appuyant sur Select.
Sélection des graisses de police et ensemble de caractères
Vous avez la possibilité de sélectionner rapidement et facilement des graisses (weight) de police et des jeux de caractères dans le Sélecteur de police. La sélection de ceux-ici va les rendre disponibles dans votre thème.
La graisse de police (thin, light, normal, etc.) détermine la façon dont la police apparaît en frontend. Cela peut être un excellent moyen de différencier les titres et les sous-titres de votre contenu, d'améliorer la typographie générale de votre site, et plus encore.
Les jeux de caractères sont particulièrement utiles pour les sites multi-langues parce qu’ils vous permettent d'utiliser le latin, grec, cyrillique, etc. caractères. Vous pouvez sélectionner un ou
plusieurs jeux de caractères, mais toutes les polices ne prennent pas en charge les jeux de caractères supplémentaires.
Voici les étapes à suivre pour accéder à ces contrôles:
-
Ouvrez le sélecteur de police dans le backend de Gantry.
-
Recherchez une police spécifique que vous souhaitez utiliser dans le champ de recherche. (Par exemple:
Roboto
) -
Activez la case à cocher en regard de la graisse (s) de police que vous souhaitez utiliser.
-
Sélectionnez le nombre d’ensembles de caractères sélectionnés en haut de la liste des polices.
-
Sélectionnez l’ensemble de caractère, que vous souhaitez utiliser.
Utilisation de la Graisse de police dans votre site
Maintenant que les graisses de police sont disponibles dans le thème, elles peuvent être ajoutées au CSS du site.
Exemple
La police sélectionnée dans cet exemple est Exo:800
.your-element{
font-weight:800;
}
Remplacez .your-element
parl’id(#) ou la classe(.) de l'élément Remplacez 800
avec la variation choisie.
Les polices Roboto et Ubuntu sont deux des ensembles de polices les plus complètes dans la librairie Google Font.
Toutes les polices dans la Google Font Library n’ont pas obligatoirement des variations.
Ajouter le sélecteur de polices dans votre Site
Le sélecteur de polices 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.fonts
dans le fichier YAML de la particule .
Voici un exemple de la façon dont cela se présente dans le fichier YAML.
target: type: input.fonts label: Font description: Select the font you would like to have used for content in the Particle. default: family=Inconsolata:700,400&subset=latin,latin-ext
Vous pouvez trouver plus d'informations sur la façon d'utiliser les fichiers YAML dans Gantry 5 dans notre guide.