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.
-
Avant mars 2023, le panneau Thème du site s'appelait Design global.
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 :
-
Dans le panneau de gauche, cliquez sur 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 la police, le poids, la taille (pour desktop/tablette et mobile, séparément), la couleur, le format de la police, la direction, la hauteur de ligne, l'espacement entre les lettres, et mettre en majuscules.
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 :
-
Dans le panneau latéral, cliquez sur Thème, puis 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 comptes disposent automatiquement d'autorisations de thème du site 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 de thème du site peuvent afficher et utiliser les couleurs du thème, mais pas les modifier.
Pour configurer les couleurs du thème :
-
Dans le panneau latéral, cliquez sur Thème, puis 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.
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 :
-
Dans le panneau latéral, cliquez sur Thème, puis 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 souhaitez 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 pour que vous puissiez 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 :
-
Dans le panneau latéral, cliquez sur Thème, puis sur Couleurs.
-
hover sur le nom de la couleur souhaitée et cliquez sur l'icône du 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 :
-
Dans le panneau latéral, cliquez sur Thème.
-
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.
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 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 :
-
Dans le panneau de gauche, cliquez sur Thème, puis sur la flèche située à 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 :
-
Dans le panneau de gauche, cliquez sur Thème, puis sur la flèche située à 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).
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.
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.
-
Sur les écrans dont la largeur est inférieure à 1 090 pixels, le contenu de la barre latérale sera masqué, à l'exception de la première image, et une icône de menu extensible sera affichée à la place. Vous pouvez personnaliser la couleur du bouton de déclenchement qui s'affiche dans l'éditeur de design.
Pour passer à la mise en page avec barre latérale pour votre site :
-
Dans le panneau de gauche, cliquez sur Thème, puis sur la flèche située à côté de Mise en page 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.