Google Fonts

Vous pouvez intégrer à votre site toute police disponible dans la bibliothèque Google Fonts. Bien que ces polices ne puissent pas être ajoutées à la bibliothèque de polices et n'apparaissent pas dans l'éditeur de texte inline, elles peuvent être appliquées à divers éléments de votre site via CSS.

Intégration de police

  1. Ouvrez la police de votre choix sur Google Fonts et sélectionnez-la. Dans la fenêtre popup, copiez et enregistrez les lignes de code « @import url » et « font-family » :

    Important : sous « Code d'intégration », ne copiez pas l'intégralité du code (notamment les tags « <style></style> »). Copiez simplement la ligne « @import url ».

  2. Dans Mode développeur, ouvrez Site HTML/CSS > site.css, puis collez le code « @import url » :

Appliquer la police via CSS

Pour définir la police que vous avez intégrée comme police principale de votre site, ajoutez la ligne CSS suivante à site.css. Pour en savoir plus sur l'ajout de CSS personnalisé, consultez l'article Mode développeur.

"*#dm div.dmContent *, *#dm div.dmFooter *, *#dm div.dm-title {YOUR_GOOGLE_INTEGRATION_CODE}}"

Remplacez YOUR_GOOGLE_INTEGRATION_CODE ci-dessus par le code CSS de la famille de polices que vous avez copié dans Google Fonts. Cliquez sur Enregistrer.

Appliquer la police à un widget spécifique

Pour appliquer une police à un widget individuel :

  1. Faites un clic droit sur le widget, puis cliquez sur Modifier HTML/CSS pour ouvrir la fenêtre d'édition HTML/CSS du widget.
  2. Sous CSS général ou CSS spécifique à l'appareil, entre crochets {}, ajoutez le code CSS de la famille de polices que vous avez enregistré précédemment, à l'étape 2.

La police est désormais appliquée aux éléments de texte du widget. Vous pouvez utiliser l'éditeur inline pour changer les couleurs et modifier le texte normalement.

Appliquer une police personnalisée à des polices principales

Pour appliquer vos polices personnalisées à l'ensemble de votre site, vous devez remplacer des éléments CSS précis par le nom de vos polices. Pour ce faire :

  1. Cliquez sur le bouton Mode développeur dans la barre de navigation.
  2. Cliquez sur Site HTML/CSS, puis sur site-theme.css.
  3. Recherchez l'en-tête et la famille de police que vous souhaitez modifier (par exemple, H1, H2, etc.), puis remplacez la famille de police actuelle par le nom de votre police personnalisée.
  4. Cliquez sur Enregistrer.
  5. Pour quitter le mode développeur, cliquez sur Fermer.