Modifier les paramètres du thème

Un thème est un ensemble de styles et de modèles que vous pouvez appliquer à vos pages de site web et à vos blogs dans HubSpot. Pour garantir la cohérence de votre site web, les paramètres de style pour toutes les pages utilisant le même thème sont gérés dans vos paramètres de thème. Vous pouvez facilement personnaliser les paramètres de votre thème en cliquant sur l'onglet Conception du panneau de gauche dans l'éditeur de pages. Les paramètres de thème peuvent être modifiés avec des commandes intuitives telles que des boutons, des commutateurs et des sélecteur de couleurs.

Avant de commencer

Les paramètres de thème permettent de déterminer les couleurs principales, les polices et les styles de bouton pour les pages utilisant vos modèles de thème.

Remarque : les options de style disponibles dans votre paramètre de thème dépendent des options de champ de thème incluses par le développeur Web qui a créé votre thème.

Certains des contenus de votre site web sont gérés dans d'autres parties de vos paramètres de compte :

• Logo de votre entreprise : mettez à jour le logo de votre entreprise dans Paramètres par défaut du compte, sous l'onglet Branding.
• 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.
• Votre domaine de publication : le nombre de sous-domaines, de domaines de marque et de domaines de premier niveau que vous pouvez connecter dépend de votre abonnement. Découvrez-en davantage sur les limites d'abonnement pour les domaines et sur la connexion d'un domaine à HubSpot. 

Modifier les paramètres de thème

Pour modifier vos paramètres de thème, vous devez d'abord créer une page avec un modèle de thème. Les paramètres de thème peuvent être consultés dans l'éditeur de contenu en cliquant sur l'onglet Thème sur la gauche. Cliquez ensuite sur Modifier les paramètres de thème.

La personnalisation des couleurs, des polices et de l'espacement définira les styles par défaut pour tous les éléments de votre page. Si vous souhaitez modifier des détails spécifiques tels que les couleurs par défaut des liens, boutons et formulaires, cliquez sur Modifier à côté de Plus de paramètres pour afficher des paramètres de thème supplémentaires disponibles pour vos modèles.

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. Pour personnaliser des paramètres plus spécifiques pour les titres, les polices et les liens, cliquez sur Modifier à côté de

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 et l'espacement vertical entre différents éléments de votre page.

Plus de paramètres

Dans vos paramètres de thème, vous pouvez 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.

L'exemple ci-dessous constitue un guide général concernant les types de paramètres supplémentaires 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.

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 associées à 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.

• 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. 

Découvrez comment insérer un tableau dans un module de texte enrichi 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.