Le panneau Thème du site vous permet d'apporter des modifications qui concernent l'ensemble de votre site. Vous pouvez personnaliser le texte, les boutons, les images, l'arrière-plan et les widgets de navigation de votre site depuis le panneau de conception. Cela vous permet d'apporter rapidement et efficacement des modifications visuelles radicales, de réduire le temps de conception et de maintenir la cohérence du style de votre site sur toutes les pages.
Pour ouvrir le panneau Thème du site, dans le panneau latéral, cliquez surThème. Lorsque le panneau Thème du site est ouvert, le canevas est automatiquement réduit à 50 % d'affichage afin que l'intégralité du canevas soit visible lors du réglage des paramètres du thème du site. Si vous souhaitez revenir à l'affichage 100 % du canevas, cliquez sur le menu déroulant dans la barre supérieure et sélectionnez 100 %. La possibilité de zoomer ou de dézoomer est également disponible en mode aperçu.
Note
-
Les modifications que vous apportez à des widgets ou à des pages spécifiques remplaceront les thèmes définis dans le panneau Thème du site. Nous vous recommandons de choisir d'abord le thème de votre site, puis de personnaliser les parties de votre site que vous souhaitez mettre en valeur ou dont l'apparence diffère des autres
Cette section vous permet de contrôler le texte de votre site, tant pour le texte que pour les titres de toutes tailles (H1 à H6). Modifiez le style et l'apparence du texte sur l'ensemble de votre site. Vous pouvez modifier le type de police, la taille et également choisir les paramètres du texte normal, des liens et des titres.
La modification de la taille de police, du style, de la couleur et d'autres modifications affectera les prochains paragraphes et les autres types de texte, ainsi que les widgets actuels connectés au texte du site qui n'ont pas été modifiés manuellement.
Pour configurer le texte du thème :
-
Cliquez sur la flèche à côté de Texte.
-
Cliquez sur le type de texte souhaité. Les options sont les suivantes :
-
DFLT. Cela définira le thème de tout le texte des widgets qui ne sont pas affectés à un titre ou à un style de paragraphe, tel que le widget de navigation. La couleur et le soulignement du texte du lien peuvent également être définis ici. En outre, vous avez la possibilité de personnaliser l'apparence des liens pour différents états, notamment l'état du lien par défaut, le lien survol et le lien cliqué
-
PAR. Cela définira le thème du widget de texte.
-
Titre et sous-titres H1-H6.
-
-
Vous pouvez modifier les éléments suivants par type de texte :
-
Fonte
-
Taille de police Ce paramètre est configuré séparément pour les ordinateurs de bureau/les tablettes et les appareils mobiles
-
Mettre à l'échelle le texte. (Éditeur 2.0 uniquement) Lorsque cette option est activée, le texte est mis à l'échelle en fonction de la largeur du conteneur parent. Cela peut être utile si vous ne voulez pas de saut de ligne dans un titre. Les widgets dont le texte est connecté au thème hériteront de ce paramètre, mais celui-ci peut être modifié par widget.
-
Couleur de police
-
Format de police
-
Direction du texte
-
Poids de la police
-
Hauteur de la ligne
-
Espacement des lettres
-
Toutes les majuscules
-
Ombre de texte
-
Les modifications apportées à la zone de texte du thème modifient tout le texte du site qui n'est pas remplacé par des modifications de style individuelles et personnalisées. Lorsque des modifications manuelles sont apportées à des éléments individuels, cela remplace le thème du site et toute modification apportée au thème du site n'affectera plus le style de ces éléments. Cela concerne les paramètres de style individuels d'un élément de site donné, par exemple, si vous avez uniquement modifié la couleur du texte d'un widget H1 particulier sur le canevas
-
Et puis a changé letaille de policede H1 dans le thème du site, la taille de police du H1 changera toujours dans le widget H1.
-
Et puis a changé lecouleurde H1 dans le thème du site, le H1 qui avait été modifié ne sera pas mis à jour avec le changement de couleur.
Vous pouvez mettre à jour le texte du thème dans les paramètres de texte en cliquantThème, puis en sélectionnantTexte. Vous pouvez également cliquer sur un widget de texte pour ouvrir le menu contextuel, cliquer sur le menu déroulant de sélection des titres, puis sélectionnerMettre à jour le thème. Cela ouvre les paramètres de texte du thème dans lesquels vous pouvez effectuer des mises à jour.
L'éditeur propose une variété de polices pour votre utilisation. Définissez une police de texte thématique ou choisissez de différencier votre texte en utilisant plusieurs polices différentes sur votre site.Pour ajouter des polices personnalisées à votre site, consultez Polices personnalisées.
Pour consulter les polices disponibles et voir à quoi elles ressemblent :
-
Cliquez Texte.
-
Sélectionnez une police dansFontemenu déroulant.
Vous pouvez ajouter des polices personnalisées à partir de la bibliothèque de polices Google ou en téléchargeant des fichiers de polices personnalisés (TTF, OTF, EOT, WOFF2 ou WOFF). Pour de meilleures performances, il est recommandé d'utiliser des fichiers WOFF ou WOFF2 lors de l'ajout
Note
-
Si vous ne disposez que d'un fichier .otf ou .ttf, nous vous recommandons d'utiliser un outil externe tel que Écureuil de police pour le convertir au format requis.
-
Pour garantir la conformité au RGPD, les polices personnalisées sont chargées depuis notre CDN sans qu'il soit nécessaire d'appeler l'API Google Fonts.
-
Si vous enregistrez un site en tant que modèle, il inclura toutes les polices personnalisées qui ont été ajoutées.
-
Si vous réinitialisez un site, les polices personnalisées sont supprimées.
Pour ajouter une police personnalisée :
-
Vous pouvez ajouter des polices personnalisées à partir de l'un des emplacements suivants :
-
Dans le panneau latéral, cliquez surThème, puis cliquez surTexte. Développez la section de texte souhaitée. À côté de la liste des polices, cliquez surAjouter et gérer des polices(
) icône.
-
Depuis l'éditeur de design d'un widget, pour n'importe quel élément de texte, cliquez surAjouter et gérer des polices(
-
-
Sélectionnez l'une des options suivantes :
-
Fontes Google. Sélectionnez une police dans la liste des polices Google. La police apparaît dans la liste des polices Google ajoutées ci-dessous. Pour supprimer une police, cliquez sur X à côté de la police dans la liste. Veuillez noter que la liste affiche peut-être déjà les polices ajoutées au modèle. Il est recommandé de ne pas supprimer les polices du modèle.
-
Polices personnalisées. Cliquez sur Charger les polices pour télécharger un fichier de police personnalisé. Plusieurs polices peuvent être sélectionnées en même temps. Pour supprimer une police, cliquez sur le X à côté de la police dans la liste.
-
-
Cliquez Terminé.
La police est ajoutée à la liste des polices du site.
Note
polices Adobe n'apparaissent pas dans la liste des polices. Vous devez ajouter la famille de polices au code.
Si vous supprimez une police actuellement utilisée sur le site, la police par défaut sera rétablie pour le texte. Vous ne pouvez supprimer aucune des polices par défaut.
Pour supprimer des polices personnalisées d'un site, procédez comme suit :
-
CliquezTexte. Développez la section de texte qui utilise la police personnalisée. À côté de la liste des polices, cliquez surAjouter et gérer des polices(
-
Cliquez surXà côté de la police dans la liste pour supprimer la police du site.
Si vous supprimez une police Google, vous devez republier le site pour que la modification soit prise en compte. Toutefois, si vous supprimez une police téléchargée, il n'est pas nécessaire de la republier pour que la modification soit prise en compte.
Les couleurs vous permettent de définir une palette de couleurs et de lier les couleurs individuelles à tout ou partie des widgets dotés de paramètres de couleur. La couleur de tout élément lié aux couleurs du thème sera automatiquement mise à jour lorsque la couleur liée sera modifiée dans les paramètres des couleurs du thème. Cela vous permet de modifier rapidement les couleurs, ce qui contribue à réduire le temps de conception et garantit la cohérence du style de votre site sur toutes les pages.
Les titulaires de compte disposent automatiquement des autorisations d'éditeur et peuvent modifier, afficher et utiliser les couleurs du thème. Les membres de l'équipe et les clients qui ne disposent pas des autorisations d'éditeur peuvent afficher et utiliser les couleurs du thème, mais ils ne peuvent pas les modifier.
Vous pouvez configurer jusqu'à 30 couleurs de thème.
Pour configurer les couleurs du thème :
-
Sélectionnez la flèche à côté deCouleurs.
-
Cliquez surPlusicône à côté dePrimaire, ou tout autre paramètre que vous devez définir.
-
Tapez la valeur HEX ou RGB de la couleur souhaitée, ou utilisez l'outil compte-gouttes pour sélectionner une couleur.
-
(Facultatif) Vous pouvez générer des couleurs à partir de votre logo. Cliquez pour ouvrir la couleur principale, puis ouvrez le Marque onglet et cliquez + Ajouter un logo (si vous avez ajouté un logo à vos informations professionnelles dans la bibliothèque de contenu, il apparaîtra ici). Après avoir ajouté votre logo, un ensemble de couleurs est généré.
Si vous devez supprimer ou remplacer le logo, cliquez sur l'icône à trois points à côté de votre logo et sélectionnez l'une des options suivantes : Supprimer ou Remplacer l'image. Notez que vous avez besoin de l'autorisation de la bibliothèque de contenu et des informations commerciales pour télécharger, supprimer ou remplacer le logo.
Répétez ces étapes si nécessaire pour chaque couleur de thème. Ensuite, vous devez connecter les couleurs aux widgets sur votre site.
Si les couleurs du site ou du modèle ne sont pas déjà connectées, cela peut être fait automatiquement. Le générateur automatique de couleurs thématiques scanne votre site et détecte les couleurs les plus fréquemment utilisées. Il génère une liste de couleurs parmi lesquelles sélectionner, et une fois sélectionnées, ces couleurs deviennent les couleurs de votre thème et sont connectées aux widgets de votre site.
Pour configurer automatiquement les couleurs du thème :
-
Sélectionnez la flèche à côté de Couleurs.
-
CliquezDéfinissez les couleurs du thème.
-
CliquezConnecte-le pour moiouJe vais le connecter moi-même.
-
(Facultatif) Si vous avez sélectionné Je vais le connecter moi-même, cliquez surPlusicône à côté de chaque couleur dans le panneau de conception et sélectionnez les couleurs individuellement.
-
Sélectionnez les couleurs générées que vous souhaitez utiliser.
-
CliquezEnregistrer et connecter les couleurs.
Les couleurs seront affichées dans la section Couleurs du panneau Thème du site.
Pour connecter un widget à une couleur de thème :
-
Cliquez sur un widget pour ouvrir son menu de paramètres.
-
Ouvrez les paramètres de couleur et sélectionnez l'une des couleurs du thème répertoriées en haut de la page.
-
Répétez l'opération si nécessaire pour les autres éléments.
-
(Facultatif) Si vous devez modifier l'une des couleurs du thème, cliquez sur l'icône en forme de crayon et les paramètres des couleurs du thème s'ouvriront et vous pourrez modifier la couleur souhaitée.
Une fois qu'un widget est connecté aux couleurs du thème, il est automatiquement mis à jour lorsque la couleur du thème lié est mise à jour.
Il est important de noter que seuls les titulaires de comptes et les membres du personnel disposant des autorisations d'éditeur peuvent renommer les couleurs du thème du site. Les clients ne peuvent pas renommer les couleurs du thème du site, même s'ils disposent des autorisations d'éditeur
Pour renommer les couleurs du thème :
-
Cliquez Couleurs.
-
Passez la souris sur le nom de la couleur souhaitée et cliquez sur l'icône en forme de crayon.
-
Entrez un nouveau nom.
Le nouveau nom est automatiquement enregistré et apparaît lorsque vous passez la souris sur la couleur dans le sélecteur de couleurs.
Vous pouvez déconnecter tous les widgets connectés à des couleurs de thème individuelles.
Pour déconnecter un widget :
-
CliquezCouleurs.
-
Cliquez sur l'icône à trois points horizontaux (
) à côté du Couleurs texte et sélectionnezSupprimer les couleurs du thème.
-
Sélectionnez les couleurs à supprimer, puis cliquez surSupprimer les couleurs sélectionnées.
Cette section vous permet de définir le style des widgets des boutons principaux et secondaires de votre site. Sélectionnez l'une de nos dispositions de boutons et définissez le texte, la couleur d'arrière-plan, la bordure, l'état de survol, les coins et les styles d'ombre
Pour masquer leRetour en haut de pagebouton sur mobile, activez la bascule dans la section Mise en page du site.
Note
Ces informations sont spécifiques à l'éditeur classique et ne concernent pas Editor 2.0 (anciennement connu sous le nom d'éditeur All-Flex). Pour identifier la version actuelle de votre éditeur, voirComment identifier la version de l'éditeur utilisée par votre site .
Cette section vous permet de définir le thème pour la conception des lignes et des colonnes en termes de couleur d'arrière-plan et d'espacement par défaut. Les modifications qui seront apportées à des lignes ou à des colonnes individuelles remplaceront les paramètres des lignes et des colonnes du thème
Cette section vous permet de contrôler le style d'arrière-plan de votre site. Choisissez d'utiliser une couleur ou une image comme arrière-plan. Choisissez une image d'arrière-plan personnalisée dans la galerie de photos ou téléchargez vos propres images pour ajouter un design de site unique. Les modifications concernent également l'ordinateur de bureau et la tablette.
Note
Pour plus d'informations sur les arrière-plans des éléments du site, voir Contexte des éléments.
Pour personnaliser l'arrière-plan de votre site :
-
Cliquez sur la flèche à côté deContexte.
-
CliquezContexte par défaut.
-
Cliquez soit surcouleurouImageonglet ou sélectionnez une couleur pour l'arrière-plan du site ou téléchargez une image.
-
(Facultatif) Cliquez surN'optimisez pas cette imagebasculez pour empêcher l'optimisation (ce paramètre apparaît une fois qu'une image a été sélectionnée).
Pour personnaliser l'arrière-plan par page :
-
Cliquez sur la flèche à côté deContexte.
-
CliquezContexte par page.
-
Sélectionnez une page dans le menu déroulant, puis sélectionnez l'image ou la couleur de la page en question.
-
(Facultatif) Cliquez surN'optimisez pas cette imagebasculez pour empêcher l'optimisation (ce paramètre apparaît une fois qu'une image a été sélectionnée).
Note
Ces informations sont spécifiques à l'éditeur 2.0, anciennement connu sous le nom d'éditeur All-Flex. Pour identifier la version actuelle de votre éditeur, voirComment identifier la version de l'éditeur utilisée par votre site .
À partir du Thème panneau, vous pouvez ajuster la mise en page de votre site, notamment en définissant la largeur de page et l'espacement par défaut entre les sections, les colonnes et les colonnes intérieures.
Pour accéder aux paramètres de mise en page du site :
-
Cliquez Largeur et espacement.
-
Cliquez sur la section souhaitée pour l'agrandir.
Vous pouvez définir la largeur de page par défaut pour les sections qui ne sont pas réglées en pleine largeur (précédemment appelées « fond perdu ») sur le bureau. L'ajustement de la largeur de page par défaut peut contribuer à garantir la meilleure lisibilité et la meilleure conception du site pour son affichage. Par exemple, certains sites Web sont affichés sur un écran de télévision ou des écrans plus grands que la moyenne des ordinateurs de bureau.
Pour définir la largeur de page par défaut :
-
Cliquez Largeur et espacement.
-
Cliquez pour agrandir le Largeur de page section.
-
Sélectionnez soit 1200 pixels, 1440 pixels, ou Personnalisé. Si vous sélectionnez Personnalisé, utilisez le curseur pour sélectionner la largeur en pixels ou entrez une valeur dans le champ. La valeur personnalisée peut être comprise entre 960 px et 1920 px, ou entre 50 et 100 vw
Activez le Pleine largeur basculez si vous souhaitez que toutes les nouvelles sections soient en pleine largeur par défaut.
Vous pouvez définir le remplissage par défaut pour les nouvelles sections vides ajoutées à votre site. Si vous le souhaitez, vous pouvez modifier l'espacement des sections thématiques dans le panneau de conception de la section
Considérations importantes :
-
Les sections ajoutées à l'en-tête conservent l'espacement d'en-tête par défaut, quel que soit ce qui est défini dans l'espacement des sections du thème.
-
Notez que les sections créées avant cette version de fonctionnalité (5 août 2025) n'héritent pas automatiquement du remplissage de l'espacement des sections, mais elles peuvent être reconnectées en ouvrant le panneau de conception de la section et en cliquant sur Réinitialiser l'espacement des thèmes dans le tiroir Espacement des sections.
Pour définir l'espacement des sections :
-
Cliquez Largeur et espacement.
-
Cliquez pour agrandir le Espacement des sections section.
-
Cliquez dans les cases correspondantes pour modifier les valeurs de remplissage. Les valeurs de remplissage horizontal sont liées. Si vous modifiez l'un, l'autre sera automatiquement mis à jour. Ils peuvent être dissociés en cliquant sur l'icône du lien. Notez que l'espacement des sections est défini par point d'arrêt
Si nécessaire, cliquez sur Réinitialiser le rembourrage pour remettre toutes les valeurs à zéro.
Si vous modifiez le remplissage d'une section individuelle, cela remplace les paramètres du thème. Vous pouvez rétablir les paramètres d'espacement des sections du thème en ouvrant le panneau de conception de la section et en cliquant Réinitialiser l'espacement des thèmes dans le tiroir Espacement des sections.
Vous pouvez définir le remplissage par défaut pour les nouvelles colonnes vides ajoutées à votre site. Si vous le souhaitez, vous pouvez modifier l'espacement des sections du thème dans le panneau de conception de la colonne
Pour définir l'espacement par défaut des colonnes :
-
Cliquez Largeur et espacement.
-
Cliquez pour agrandir le Espacement des colonnes section.
-
Cliquez dans les cases correspondantes pour modifier les valeurs de remplissage. Les valeurs de remplissage vertical sont liées. Si vous modifiez l'un, l'autre sera automatiquement mis à jour. Ils peuvent être dissociés en cliquant sur l'icône du lien
Vous pouvez définir le remplissage par défaut pour les nouvelles colonnes intérieures ajoutées à votre site. Si vous le souhaitez, vous pouvez modifier l'espacement des sections du thème dans le panneau de conception de la colonne intérieure
Pour définir l'espacement par défaut pour les colonnes intérieures :
-
Cliquez Largeur et espacement.
-
Cliquez pour agrandir le Espacement des colonnes intérieures section.
-
Cliquez dans les cases correspondantes pour modifier les valeurs de remplissage. Les valeurs de remplissage vertical sont liées. Si vous modifiez l'un, l'autre sera automatiquement mis à jour. Ils peuvent être dissociés en cliquant sur l'icône du lien
Note
Ces informations sont spécifiques à l'éditeur classique et ne concernent pas Editor 2.0 (anciennement connu sous le nom d'éditeur All-Flex). Pour identifier la version actuelle de votre éditeur, voirComment identifier la version de l'éditeur utilisée par votre site .
Contrôlez la navigation dans la mise en page du site sur ordinateur, tablette et mobile. Pour la version de bureau, vous pouvez choisir entre deux largeurs : 960 pixels ou 1 200 pixels
modification de la mise en page de votre navigation affecte souvent le comportement de votre en-tête et parfois du reste de votre site. Si votre en-tête semble soudainement incorrect après avoir modifié la mise en page, essayez une autre mise en page.
Note
Ces informations sont spécifiques à l'éditeur classique et ne concernent pas Editor 2.0 (anciennement connu sous le nom d'éditeur All-Flex). Pour identifier la version actuelle de votre éditeur, voirComment identifier la version de l'éditeur utilisée par votre site .
Vous pouvez modifier la mise en page de votre site pour ordinateur en une mise en page de barre latérale. La mise en page de la barre latérale affiche l'en-tête sur le côté du site (gauche ou droite) et constitue un excellent outil de conception pour donner un aspect unique à votre site. L'en-tête de la barre latérale agit également comme un en-tête collant, il sera donc toujours affiché à l'écran et vous pouvez également ajouter des widgets dans la barre latérale comme n'importe quelle autre ligne
Note
-
Lorsque vous passez d'une mise en page de site traditionnelle à une mise en page de barre latérale, l'en-tête conserve le logo et tous les widgets que vous aviez seront supprimés (comme si vous passiez de la mise en page d'en-tête à la disposition d'en-tête supérieure). La couleur de fond sera modifiée en fonction de la mise en page que vous avez sélectionnée.
-
L'en-tête rétréci n'est pas disponible pour la navigation dans la barre latérale. La barre latérale est toujours affichée sur le site, quel que soit le défilement du site
-
Sur les écrans dont la largeur est inférieure à 1 090 pixels, le contenu de la barre latérale, à l'exception de la première image, sera masqué et une icône de menu déroulant s'affichera. Vous pouvez personnaliser la couleur du bouton de déclenchement qui apparaît dans l'éditeur de design.
Pour modifier la mise en page de votre site en une mise en page de barre latérale :
-
Cliquez sur la flèche à côté deDisposition du site.
-
Sélectionnez la disposition de la barre latérale, vous pouvez ajouter des lignes, glisser-déposer des widgets dans l'en-tête de la barre latérale et le personnaliser.
Pour modifier le design de l'en-tête de la barre latérale, passez la souris sur la barre latérale et cliquez surBarre latéraledans le coin supérieur droit. Vous pouvez choisir l'une des multiples mises en page d'en-tête de la barre latérale à appliquer à votre site, l'afficher sur le côté gauche ou droit de l'écran, définir sa largeur, etc.