Modifier les paramètres de thème

Un thème est un ensemble de styles et de modèles que vous pouvez appliquer à vos pages et articles de blog dans HubSpot. Pour garantir la cohérence de votre site web, les paramètres de style pour l'ensemble des pages et articles utilisant le même thème sont gérés dans vos paramètres de thème.

Avant de commencer

Avant de commencer à utiliser cette fonctionnalité, assurez-vous de bien comprendre les étapes à suivre à l'avance, ainsi que les limites de la fonctionnalité et les conséquences potentielles de son utilisation.

Compréhension des limites et des considérations

• Les options de style disponibles dans les paramètres du thème dépendent des options de champ de thème incluses par le développeur web qui a créé le thème.
• Les bases de connaissances utilisent une version modifiée des thèmes. Découvrez-en davantage sur la modification des paramètres de thème de la base de connaissances. 
• Certains éléments du contenu web sont gérés dans d'autres parties des paramètres du compte, notamment :
  • Logo de l'entreprise : mettez à jour le logo de votre entreprise dans le kit de marque.
  • Menu de navigation : les couleurs de menu sont définies dans les paramètres de thème, mais le contenu et les liens de votre menu de navigation sont gérés dans vos paramètres Navigation. Découvrez comment créer un menu de navigation que vous pouvez ajouter au contenu d'en-tête ou de pied de page global dans l'éditeur de pages.

Modifier les paramètres de thème

Vous pouvez modifier les paramètres d'un thème à partir de l'éditeur de thème complet pour toute page ou tout article utilisant ce thème. Vous pouvez également modifier les paramètres de thème pour les pages de site web et les pages de destination dans l'éditeur de contenu si un super administrateur a inscrit le compte à l'éditeur de thème universel (BÊTA). 

1. Accédez à votre contenu :

   • Pages de site web : Dans votre compte HubSpot, accédez à Contenu web > Pages de site web.
   • Pages de destination : Dans votre compte HubSpot, accédez à Contenu > Pages de destination.
   • Blog : Dans votre compte HubSpot, accédez à Contenu > Blog.
2. Cliquez sur le nom de votre contenu. 
3. Pour utiliser l'éditeur de thème complet pour les pages et les articles :
   • Dans l'éditeur de contenu, cliquez sur le menu Modifier et sélectionnez Thème dans la barre d'outils de l'éditeur. Par exemple, si vous utilisez le thème Elevate, cliquez sur le menu Modifier et sélectionnez Thème : Elevate.

• • Dans l'éditeur de thème, cliquez pour développer les sections pertinentes (par exemple, Couleurs ou Boutons) afin de modifier les paramètres du thème. 
  • Lorsque vous avez terminé, cliquez sur Publier le thème. Vous serez redirigé vers l'éditeur de contenu. 
    

4. Pour utiliser l'éditeur de thème universel (BÊTA) pour les pages :
   • Dans l'éditeur de contenu des pages, cliquez sur l'icône Styles de thème global dans la barre latérale gauche. 
   • Dans la barre latérale de gauche, cliquez pour développer les sections pertinentes (par exemple, Couleurs ou Boutons) pour modifier les paramètres du thème. Les modifications s'appliqueront à toutes les pages et à tous les modèles qui utilisent le thème.

Comprendre les styles de thème

Dans les paramètres de votre thème, vous pouvez avoir des options de style pour les polices, les couleurs, les boutons et les liens. Vous pouvez également profiter de paramètres supplémentaires pour des styles plus spécifiques sur votre page. Les options de style dans votre thème sont basées sur les champs de thème inclus dans le modèle codé de votre thème. Si vous ne trouvez pas le paramètre que vous recherchez, contactez votre concepteur de modèle pour connaître les options incluses dans votre modèle.

Les exemples ci-dessous constituent un guide général concernant les types d'options de style pouvant être inclus dans votre thème. Pour connaître tous les champs de thème qui peuvent être inclus dans vos modèles, consultez la documentation des concepteurs.

Remarque : vous pouvez personnaliser les polices, les couleurs et les styles dans un module de texte enrichi sur votre page, ou en remplaçant les styles par défaut de votre thème dans l'éditeur de pages. Modifiez uniquement ces styles si vous souhaitez les appliquer à toutes les pages utilisant ce thème.

Couleurs

Les paramètres de couleur de votre thème appliquent une couleur principale, une couleur secondaire et une couleur d'arrière-plan à tous les éléments inclus dans vos modèles de thème. Ces styles seront appliqués à tous les éléments de votre site web. 

Polices

Choisissez une police principale et une police secondaire à appliquer aux titres, formulaires, boutons et corps de texte de votre site web. Toutes les polices Google sont prises en charge. Cliquez sur le cercle coloré pour personnaliser les couleurs de la police principale ou secondaire. Vous pouvez choisir une valeur de couleur simple ou cliquer sur l'onglet Avancé et choisir une valeur hexadécimale spécifique avec le sélecteur de couleurs. 

Espacement 

Vos paramètres de thème pour l'espacement permettent d'ajuster la largeur maximale du contenu de votre page ou article et l'espacement vertical entre différents éléments.

Typographie

Dans vos paramètres de typographie, vous pouvez définir les polices applicables à certains éléments de vos modèles. Toutes les polices Google sont prises en charge. Vous pouvez également sélectionner des couleurs personnalisées pour des en-têtes, des polices ou des liens spécifiques dans votre thème.

• En-tête : vous pouvez personnaliser la police, la couleur, la taille et le style précis pour tous les en-têtes inclus dans votre thème.
• Corps de texte : personnalisez la police, la couleur ou la taille du corps de texte de votre page uniquement. 
• Liens : personnalisez la couleur par défaut des liens sur votre site web. Vous pouvez également personnaliser la couleur et le comportement des liens lorsqu'un visiteur passe le curseur de la souris ou clique dessus.

Boutons

Vous pouvez définir des couleurs, des polices et des styles personnalisés pour les boutons de vos pages et de votre blog. Dans l'éditeur de pages pour une page spécifique, vous pouvez également changer la taille ou le type des boutons, en fonction de la création de votre thème par votre développeur de site web.

• Taille : précisez les dimensions des boutons de petite, moyenne et grande taille sur votre page. 
• Principal : un bouton principal est utilisé pour l'action la plus importante d'un visiteur sur votre page. Cette couleur doit se démarquer et attirer votre visiteur.
• Secondaire : un bouton secondaire est utilisé pour les actions relativement moins importantes lorsqu'il existe déjà un bouton principal sur votre page. Les boutons secondaires sont généralement appliqués aux pages pour des actions moins prioritaires. 
• Simple : il s'agit des polices et styles par défaut appliqués aux modules de bouton simples sur votre page.

Formulaires

Personnalisez les couleurs, polices, styles de texte et styles de bouton par défaut pour vos formulaires.

• Titre : ces styles sont appliqués au champ de texte qui apparaît au-dessus de votre formulaire. Cela inclut généralement un message de bienvenue ainsi que des instructions pour le remplissage du formulaire. Ces styles sur votre formulaire ne peuvent être gérés que dans les paramètres de votre thème.
• Libellé : styles appliqués aux libellés qui apparaissent au-dessus d'un champ de formulaire.
• Champs : styles appliqués aux noms des champs de formulaire eux-mêmes.
• Texte d'aide : il s'agit de l'exemple de contenu qui apparaît dans chaque champ de formulaire, indiquant le type d'informations que votre visiteur doit renseigner.
• Soumission : choisissez le style et la taille du bouton à appliquer à vos formulaires.
• Couleur d'arrière-plan : couleur d'arrière-plan appliquée à votre formulaire.
• Bordure : couleur de bordure appliquée autour des champs du formulaire.
• Remplissage : espacement autour du formulaire sur votre page.

Tableaux

Définissez les couleurs, polices, espacements et bordures par défaut pour les tableaux ajoutés à votre page. Découvrez comment insérer un tableau dans un module de texte enrichi sur votre page.

• En-tête de tableau : couleurs appliquées aux polices dans l'en-tête de votre tableau et couleur d'arrière-plan par défaut de la première ligne de votre tableau. Vous pouvez également définir une bordure inférieure avec une couleur d'accentuation pour la ligne inférieure de l'en-tête de votre tableau.
• Couleur de police : couleur par défaut pour les polices de votre tableau.
• Couleur d'arrière-plan : couleur d'arrière-plan par défaut pour l'arrière-plan des cellules de votre tableau.
• Bordure : couleur, largeur et style de bordure par défaut de votre tableau.
• Remplissage : espacement au-dessus et en dessous du tableau sur votre page. 

En-tête de site web

Ces paramètres permettent d'ajuster les couleurs et les polices qui apparaissent dans l'en-tête de votre page, y compris votre menu de navigation. Découvrez comment configurer votre menu de navigation dans les paramètres de votre compte. Pour définir le logo de votre entreprise sur vos modèles de thème, ajoutez l'image du logo aux valeurs par défaut de votre compte dans la section Branding.

• Menu : sélectionnez la couleur et le style de la police pour votre menu de navigation lorsque les visiteurs consultent un élément de menu, passent le curseur de la souris ou cliquent dessus. Ces styles ne peuvent être gérés que dans les paramètres de votre thème.
• Couleur d'arrière-plan : couleur d'arrière-plan pour l'en-tête de votre site web.
• Bordure inférieure : si vous le souhaitez, vous pouvez ajouter une ligne horizontale comme bordure sous l'en-tête de votre site web. Sélectionnez un style pour activer la bordure inférieure, puis sélectionnez une couleur et une largeur pour la bordure.

Pied de page

Ces paramètres permettent d'ajuster les couleurs et les polices qui apparaissent dans le pied de page de votre page, y compris votre menu de navigation. Découvrez comment configurer votre menu de navigation dans les paramètres de votre compte. 

• Menu : sélectionnez la couleur et le style de la police pour votre menu de navigation dans le pied de page de votre thème. Vous pouvez personnaliser les couleurs lorsque les visiteurs consultent un élément de menu, passent le curseur de la souris ou cliquent dessus. Ces styles ne peuvent être gérés que dans les paramètres de votre thème.
• Couleur d'arrière-plan : couleur d'arrière-plan pour le pied de page de votre site web.
• Bordure inférieure : si vous le souhaitez, vous pouvez ajouter une ligne horizontale comme bordure sous le pied de page de votre site web. Sélectionnez un style pour activer la bordure inférieure, puis sélectionnez une couleur et une largeur pour la bordure.

Blog

Ces paramètres permettent d'ajuster le style de votre modèle de page de listing ou d'article de blog.

• Bannière : téléchargez des images à utiliser en arrière-plan de votre en-tête de modèle de blog. Vous pouvez choisir une image pour la page d'accueil de votre blog et une image à appliquer à tous vos articles de blog. 
• Balises : définissez les couleurs, polices et styles par défaut pour les balises de blog, qui apparaissent en haut de vos articles de blog.