Le panneau Thème du site vous permet d'apporter des modifications qui affectent l'ensemble de votre site. Vous pouvez personnaliser le texte, les boutons, les images, l'arrière-plan et la navigation de votre site widget à partir du 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 le style de votre site cohérent d'une page à l'autre.
Pour ouvrir le panneau Thème du site, dans le panneau latéral, cliquez sur Thème. Lorsque le panneau Thème du site est ouvert, le canevas est automatiquement réduit à 50 % afin que l'ensemble du canevas soit visible lors de l'ajustement des paramètres du thème du site. Si vous souhaitez revenir à l'affichage 100 % de la toile, cliquez sur le menu déroulant dans la barre supérieure et sélectionnez 100 %. La possibilité d'effectuer un zoom avant ou arrière est également disponible en mode prévisualisation.
Remarque
-
Les modifications que vous apportez à des pages ou à des sites widget spécifiques remplacent les thèmes définis dans le panneau Thème du site. Nous vous recommandons de choisir d'abord un thème pour votre site, puis de personnaliser les parties de votre site que vous souhaitez mettre en valeur ou qui vous semblent différentes des autres.
-
Pour en savoir plus
Cette section vous permet de contrôler le texte de votre site, pour les paragraphes comme pour les titres de toute taille (H1 à H6). Modifiez le style et l'apparence du texte sur l'ensemble de votre site. Vous pouvez modifier le type et la taille de police, et également choisir les paramètres du texte classique, des liens et des titres.
La modification de la taille, du style et de la couleur de la police, ainsi que d'autres modifications, aura une incidence sur les futurs paragraphes et autres types de texte, ainsi que sur les pages widget actuellement connectées au texte du site et qui n'ont pas été modifiées manuellement.
Pour configurer le texte du thème :
-
Cliquez sur la flèche située à côté de Texte.
-
Cliquez sur le type de texte souhaité. Vous avez le choix entre :
-
DFLT. Le thème sera défini pour tout le texte de widget qui n'est pas assigné à un titre ou à un style de paragraphe, comme la navigation widget. La couleur du texte du lien et le soulignement peuvent également être définis ici. En outre, vous avez la possibilité de personnaliser l'apparence des liens pour différents états, y compris l'état du lien par défaut, le lien surhover et le lien cliqué.
-
PAR. Cela permet de définir le thème du widget de texte.
-
Titres et sous-titres H1-H6.
-
-
Vous pouvez modifier les éléments suivants pour chaque type de texte :
-
Police
-
Taille de la police. Il s'agit d'un ensemble pour desktop/tablette et mobile, séparément.
-
Texte de l'échelle. (Éditeur 2.0 uniquement) Lorsque cette option est activée, le texte est redimensionné en fonction de la largeur du conteneur parent. Cela peut s'avérer utile si vous ne voulez pas de retour à la ligne dans un titre. widget dont le texte est lié au thème hériteront de ce paramètre, qui peut toutefois être modifié à l'adresse widget.
-
Couleur de la police
-
Format de la police
-
Orientation du texte
-
Epaisseur de la police
-
Hauteur de ligne
-
Espacement des lettres
-
Tout en majuscules
-
Ombre du texte
-
Lorsque vous apportez des modifications dans la zone de texte Thème, l'ensemble du texte sur le site qui ne fait pas l'objet de modifications de style individuelles et personnalisées est changé. Les modifications apportées manuellement à certains éléments sont prioritaires sur le thème du site. Aucune modification apportée au thème du site n'aura plus d'incidence sur le style de ces éléments. Cela concerne les paramètres de style individuels d’un certain élément du site, par exemple, si vous avez uniquement modifié la couleur du texte dans un widget H1 particulier de la zone de travail :
-
Si vous changez la taille de la police du H1 dans le thème du site, la taille de la police du H1 changera toujours dans le widget H1.
-
Si vous changez la couleur du 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 du texte en cliquant sur Thème, puis en sélectionnant Texte. Vous pouvez également cliquer sur un texte widget pour ouvrir le menu contextuel, cliquer sur le menu déroulant de sélection des titres et sélectionner Mettre à jour le thème. Cela ouvre les paramètres du texte du thème où vous pouvez faire des mises à jour.
L'éditeur propose une variété de polices de caractères à utiliser. 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 afficher les polices disponibles et voir à quoi elles ressemblent :
-
Cliquez sur Texte.
-
Sélectionnez une police dans le menu déroulant Police .
Les couleurs vous permettent de définir une palette de couleurs et de lier les couleurs individuelles à un ou à tous les sites widget avec des 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. Vous pouvez ainsi modifier rapidement les couleurs, ce qui permet de réduire le temps de conception et d'assurer la cohérence du style de votre site d'une page à l'autre.
Les propriétaires de compte disposent automatiquement des droits d'éditeur et peuvent modifier, afficher et utiliser les couleurs du thème. Team les membres et les clients qui n'ont pas les droits d'éditeur peuvent voir 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é de Couleurs.
-
Cliquez sur l'icône Plus en regard de Primaire, ou de tout autre paramètre à définir.
-
Tapez la valeur HEX ou RVB de la couleur souhaitée ou utilisez la pipette pour sélectionner une couleur.
-
(Facultatif) tu peut générer des couleurs à partir de ton logo. Cliquez sur pour ouvrir la couleur primaire, puis ouvrez l'onglet Marque et cliquez sur + Ajouter un logo (si vous avez ajouté un logo à vos informations commerciales 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 souhaitez supprimer ou remplacer le logo, cliquez sur l'icône à trois points située à côté du logo et sélectionnez Supprimer ou Remplacer l'image. Notez que vous avez besoin de l'autorisation de Content Library & Business Info 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 relier les couleurs à widget sur votre site.
Si le site ou le modèle n'a pas de couleurs déjà connectées, cela peut se faire automatiquement. Le générateur automatique de couleurs de thème analyse votre site et détecte les couleurs les plus fréquemment utilisées. Il génère une liste de couleurs à sélectionner, et une fois sélectionnées, ces couleurs deviennent les couleurs de votre thème et sont connectées à votre site widget.
Pour configurer automatiquement les couleurs du thème :
-
Sélectionnez la flèche à côté de Couleurs.
-
Cliquez sur Définir les couleurs du thème.
-
Cliquez sur Connecter pour moi ou je le ferai moi-même.
-
(Facultatif) Si vous avez sélectionné Je vais le connecter moi-même, cliquez sur l'icône Plus à côté de chaque couleur dans le panneau de conception et sélectionnez les couleurs individuellement.
-
Parmi les couleurs générées, sélectionnez celles que vous souhaitez utiliser.
-
Cliquez sur Enregistrer & Connect Colors.
Les couleurs s'afficheront dans la section Couleurs du panneau Thème du site.
Pour relier un widget à une couleur de thème :
-
Cliquez sur un widget pour ouvrir son menu de configuration.
-
Ouvrez les paramètres de couleur et sélectionnez l'une des couleurs du thème répertoriées en haut.
-
Répétez l'opération autant que nécessaire pour d'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 de couleurs du thème s'ouvriront pour vous permettre de modifier la couleur souhaitée.
Une fois qu'un widget est connecté aux couleurs du thème, il sera automatiquement mis à jour lorsque la couleur du thème lié sera mise à jour.
Pour renommer les couleurs du thème :
-
Cliquez sur Couleurs.
-
Survolez le nom de couleur souhaité et cliquez sur l'icône en forme de crayon.
-
Saisissez un nouveau nom.
Le nouveau nom est automatiquement enregistré et apparaîtra lorsque vous survolerez la couleur dans le sélecteur de couleurs.
Vous pouvez déconnecter tout widget connecté à des couleurs de thème individuelles.
Pour déconnecter un widget :
-
Cliquez sur Couleurs.
-
Cliquez sur l'icône des trois points horizontaux (
) à côté du texte Couleurs et sélectionnez Supprimer les couleurs du thème.
-
Sélectionnez les couleurs à supprimer, puis cliquez sur Supprimer les couleurs sélectionnées.
Cette section vous permet de définir le style des boutons primaires et secondaires de votre site widget. Sélectionnez l'une de nos mises en page de boutons et définissez le texte, la couleur d'arrière-plan, la bordure, l'état hover, les coins et les styles d'ombre.
Pour masquer le bouton Retour en haut de page sur les téléphones portables, activez la case à cocher dans la section Mise en page du site.
Note
Ces informations sont spécifiques à l'éditeur classique et ne concernent pas l'éditeur 2.0 (anciennement connu sous le nom d'éditeur All-Flex). Pour identifier la version actuelle de l'éditeur, voir Comment identifier la version de l'éditeur utilisée par votre site.
Cette section vous permet de définir le thème des lignes et des colonnes en termes de couleur d'arrière-plan et d'espacement par défaut. Les modifications 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 une couleur ou une image à utiliser en arrière-plan. Choisissez une image dans la galerie photo ou importez vos propres images pour réaliser un site Web au design unique. Ces modifications sont également prises en compte sur ordinateur et sur tablette.
Remarque
Pour plus d'informations sur les arrière-plans des éléments du site, voir Arrière-plans des éléments.
Pour personnaliser le fond de votre site :
-
Cliquez sur la flèche à côté de Arrière-plans.
-
Cliquez sur Arrière-plan par défaut.
-
Cliquez sur l'onglet Couleur ou Image , sélectionnez une couleur pour l'arrière-plan du site ou téléchargez une image.
-
(Facultatif) Cliquez sur l'option Ne pas optimiser cette image pour empêcher l'optimisation (ce paramètre apparaît après la sélection d'une image).
Pour personnaliser le fond de chaque page :
-
Cliquez sur la flèche à côté de Arrière-plans.
-
Cliquez sur Arrière-plan par page.
-
Sélectionnez une page dans le menu déroulant, puis choisissez une image ou une couleur pour cette page.
-
(Facultatif) Cliquez sur l'option Ne pas optimiser cette image pour empêcher l'optimisation (ce paramètre apparaît après la sélection d'une image).
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 l'éditeur, voir Comment identifier la version de l'éditeur utilisée par votre site.
Dans le panneau Thème, vous pouvez ajuster la mise en page de votre site, notamment en définissant la largeur de la 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 sur Largeur & Espacement.
-
Cliquez sur la section souhaitée pour la développer.
Vous pouvez définir la largeur de page par défaut pour les sections qui ne sont pas réglées sur pleine largeur (anciennement appelées "à fond perdu") sur desktop. L'ajustement de la largeur de page par défaut peut contribuer à assurer la meilleure lisibilité et la meilleure conception du site en fonction de la manière dont il sera affiché. Par exemple, certains sites web sont affichés sur un écran de télévision ou sur des écrans plus grands que l'ordinateur moyen desktop.
Pour définir la largeur de page par défaut :
-
Cliquez sur Largeur & Espacement.
-
Cliquez sur pour développer la section Largeur de la page.
-
Sélectionnez 1200 px, 1440 px 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 960px et 1920px, ou entre 50 vw et 100 vw.
Activez la case à cocher " pleine largeur" si vous souhaitez que toutes les nouvelles sections aient une pleine largeur par défaut.
Vous pouvez définir le remplissage par défaut des nouvelles sections vierges 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 section.
Considérations importantes :
-
Les sections ajoutées à l'en-tête conservent l'espacement par défaut de l'en-tête, indépendamment des paramètres définis dans l'espacement des sections du thème.
-
Veuillez noter que les sections créées avant la sortie de cette fonctionnalité (5 août 2025) n'héritent pas automatiquement du remplissage de l'espacement des sections. Cependant, elles peuvent être reconnectées en ouvrant le panneau de conception de la section et en cliquant sur Réinitialiser l'espacement du thème dans le tiroir Espacement des sections.
Pour définir l'espacement entre les sections :
-
Cliquez sur Largeur & Espacement.
-
Veuillez cliquer pour développer la section Espacement des sections.
-
Cliquez sur 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. Vous pouvez les dissocier en cliquant sur l'icône de lien. Veuillez noter que l'espacement entre les sections est défini par point de rupture.
Si nécessaire, veuillez cliquer sur Réinitialiser le remplissage 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 de la section du thème en ouvrant le panneau de conception de la section et en cliquant sur « Réinitialiser l'espacement du thème » dans le menu « Espacement de la section ».
Vous pouvez définir le remplissage par défaut des nouvelles colonnes vierges 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 sur Largeur & Espacement.
-
Cliquez sur pour développer la section Espacement des colonnes.
-
Cliquez sur 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. Vous pouvez les dissocier en cliquant sur l'icône du lien.
Vous pouvez définir le remplissage par défaut des 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 des colonnes intérieures :
-
Cliquez sur Largeur & Espacement.
-
Cliquez sur pour développer la section Espacement des colonnes intérieures.
-
Cliquez sur 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. Vous pouvez les dissocier en cliquant sur l'icône du lien.
Note
Ces informations sont spécifiques à l'éditeur classique et ne concernent pas l'éditeur 2.0 (anciennement connu sous le nom d'éditeur All-Flex). Pour identifier la version actuelle de l'éditeur, voir Comment identifier la version de l'éditeur utilisée par votre site.
Contrôlez la navigation liée à la disposition du site sur ordinateur, tablette et mobile. Pour la version ordinateur, vous pouvez choisir parmi deux largeurs : 960 px ou 1200 px.
La modification de la disposition de la navigation affecte souvent le comportement de votre en-tête et parfois le reste de votre site. Si votre en-tête semble soudainement incorrect après que vous ayez modifié la disposition, essayez une autre disposition.
Note
Ces informations sont spécifiques à l'éditeur classique et ne concernent pas l'éditeur 2.0 (anciennement connu sous le nom d'éditeur All-Flex). Pour identifier la version actuelle de l'éditeur, voir Comment identifier la version de l'éditeur utilisée par votre site.
Vous pouvez changer la présentation de votre site desktop en une présentation à barres latérales. La barre latérale affiche l'en-tête sur le côté du site (à gauche ou à droite) et constitue un excellent moyen de donner un aspect unique à votre site ( tool ). L'en-tête de la barre latérale fait également office d'en-tête collant, de sorte qu'il sera toujours affiché à l'écran. Vous pouvez également ajouter widget dans la barre latérale, comme n'importe quelle autre ligne.
Remarque
-
Lorsque vous passez d'une présentation traditionnelle du site à une présentation avec barres latérales, l'en-tête conserve le logo, mais toutes les pages widget que vous aviez sont supprimées (comme lorsque vous passez de la présentation de l'en-tête à la présentation de l'en-tête supérieur). La couleur d'arrière-plan sera modifiée en fonction de la mise en page sélectionnée.
-
L'en-tête réduit n'est pas disponible pour la navigation de barre latérale. La barre latérale est toujours affichée sur le site, quel que soit le défilement de ce dernier.
-
On screens smaller than 1090 pixels width, the content of the sidebar except the first image will be hidden and an expand menu icon will display. You can customize the color of the trigger button that appears in the design editor.
To change your site layout to a sidebar layout:
-
Cliquez sur la flèche à côté de Structure du site.
-
Sélectionnez la disposition de la barre latérale, vous pouvez ajouter des rangées, faire glisser et déposer widget dans l'en-tête de la barre latérale et la personnaliser.
Pour modifier la conception de l'en-tête de la barre latérale, hover se trouve au-dessus de la barre latérale, puis cliquez sur Barre latérale dans le coin supérieur droit. Vous pouvez choisir l'une des multiples dispositions d'en-tête de barre latérale à appliquer à votre site, l'afficher à gauche ou à droite de l'écran, définir sa largeur, et bien plus encore.