Apprenez à ma?triser le système de polices dynamiques de GeneratePress et à personnaliser la typographie de votre site sans stress !

existent WordPress Lors de la création d'un site web, le style de police est souvent un facteur clé de l'expérience visuelle. Et GeneratePress Le système de polices dynamiques offre aux utilisateurs un moyen efficace et flexible de composer des textes sans avoir à écrire de texte. CSSSi vous souhaitez utiliser cette fonctionnalité, vous pourrez contr?ler avec précision le style de police de chaque partie de votre site web. Cet article vous aidera à comprendre comment utiliser cette fonctionnalité, ce qui vous permettra de créer facilement une typographie web plus professionnelle.

Image [1] - Comment personnaliser la typographie d'un site web en utilisant le système de polices dynamiques de GeneratePress

I. Entrer dans le panneau des paramètres typographiques

Tout d'abord, allez dans le backend de WordPress, cliquez sur "Personnaliser" dans le menu de gauche, puis allez dans la sectionTypographie(La zone de paramétrage "(Typographie)" vous permet de commencer à gérer les paramètres de police de votre site web.

Image [2] - Comment personnaliser la typographie d'un site web avec le système de polices dynamiques de GeneratePress

Deuxièmement, ajouter les polices les plus utilisées

Dans le panneau Police, vous pouvez ajouter les deux types de polices suivants :

  • police de caractères du système(par exemple Arial) : chargement rapide et grande compatibilité.
  • Polices de caractères Google(p. ex. Oswald, PT Sans Narrow) : riche en style et adapté aux affichages de marque.
Image [3] - Comment personnaliser la typographie d'un site web en utilisant le système de polices dynamiques de GeneratePress

Après avoir ajouté des polices, vous pouvez également choisir différentes méthodes d'affichage des polices pour Google Fonts, telles que échange peut-être replioptimisant ainsi l'expérience de chargement.

Image [4] - Comment personnaliser la typographie d'un site web avec le système de polices dynamiques de GeneratePress

Troisièmement, style de police personnalisé

Avec le Gestionnaire de typographie, vous pouvez définir des styles de police pour différents éléments du site. Voici deux exemples courants :

Titre du site

  • Changer la police en Oswald
  • Réduire la taille des caractères
  • Augmenter l'espacement des mots pour rendre les titres plus reconnaissables
Image [5] - Comment personnaliser la typographie d'un site web en utilisant le système de polices dynamiques de GeneratePress

Menu principal

  • Régler la police sur PT Sans Narrow
  • Augmenter la taille de la police pour améliorer la lisibilité de la navigation
  • Prise en charge de paramètres de police distincts pour les ordinateurs de bureau, les tablettes et les téléphones portables
Image [6] - Comment personnaliser la typographie d'un site web avec le système de polices dynamiques de GeneratePress

IV. définition de la police de caractères

La beauté de la mise en page influe directement sur l'expérience de lecture. Vous pouvez régler la police de l'ensemble du site sur Arial et activer l'option "Marge inférieure" pour laisser automatiquement un espace entre chaque paragraphe afin d'améliorer la clarté de la mise en page.

Image [7] - Comment personnaliser la typographie d'un site web en utilisant le système de polices dynamiques de GeneratePress

En outre, les titres (par exemple H2, H3) peuvent également être définis avec des marges indépendantes, ce qui facilite la répartition de la hiérarchie visuelle entre les différents blocs de contenu.

Image [8] - Comment personnaliser la typographie d'un site web avec le système de polices dynamiques de GeneratePress

V. Suppression des règles typographiques inutiles

Si vous n'avez plus besoin d'un paramètre de police, il vous suffit de sélectionner l'élément correspondant dans le panneau Typographie et de le supprimer - c'est un processus simple et intuitif.

Image [9] - Comment personnaliser la typographie d'un site web en utilisant le système de polices dynamiques de GeneratePress

VI. prise en charge des sélecteurs personnalisés

Il s'agit de la partie la plus flexible du système de polices dynamiques, qui s'applique aux zones ou aux modules personnalisés qui ne sont pas intégrés au thème.

Image [10] - Comment personnaliser la typographie d'un site web en utilisant le système de polices dynamiques de GeneratePress

Exemple 1 : Texte de la légende de l'image (Image Caption)

  • Sélectionnez Personnalisé CSS Sélecteur, ajouter .wp-caption-text
  • Vous pouvez ajuster la police, la taille, l'espacement des lignes et d'autres styles du texte de description.
Image [11] - Comment personnaliser la typographie d'un site web avec le système de polices dynamiques de GeneratePress

Exemple 2 : Blockquote

  • Ajouter un sélecteur guillemets
  • Utilisez les curseurs pour ajuster les paramètres des polices afin de rendre les citations plus hiérarchiques.
Image [12] - Comment personnaliser la typographie d'un site Web à l'aide du système de polices dynamiques de GeneratePress

résumés

GeneratePress Le système de polices dynamiques accro?t considérablement la liberté typographique, ne dépendant plus d'un système de polices encombrant. CSS Rédigé en quelques clics, il permet un contr?le précis des styles de police sur l'ensemble du site. Que ce soit pour la mise à jour quotidienne du contenu ou l'unification visuelle de la marque, il est possible de le faire efficacement.

Mises à jour récentes


Contactez nous
Vous n'arrivez pas à lire le tutoriel ? Contactez-nous pour une réponse gratuite ! Aide gratuite pour les sites personnels et les sites de petites entreprises !
Service clientèle WeChat
Service clientèle WeChat
Tel : 020-2206-9892
QQ咨詢:1025174874
(iii) Courriel : info@361sale.com
Horaires de travail : du lundi au vendredi, de 9h30 à 18h30, jours fériés.
? Déclaration de reproduction
Cet article a été écrit par : les voleurs seront des souris et des rats.
LA FIN
Si vous l'aimez, soutenez-le.
félicitations1023 partager (joies, avantages, privilèges, etc.) avec les autres
commentaires achat de canapé

Veuillez vous connecter pour poster un commentaire

    Pas de commentaires