Styles globaux

Comment personnaliser les styles globaux ?

Couleur

Les styles globaux prennent en charge 15 couleurs mondiales divisé en 5 catégories :

• Couleur du bouton
• Couleur du texte
• Couleur de fond
• ligne de couleur
• Couleur accentuée 

Ces couleurs seront générées à partir de votre thème publié. Pour remplacer la couleur existante, cliquez dessus et choisissez-en une autre dans la palette.

Ce que chaque option de couleur affecte :

• Couleur du bouton: S'applique à tous les boutons créés avec l'élément Button (par exemple, Ajouter au panier, boutons d'appel à l'action). Il contrôle la couleur de remplissage principale et l'état de survol, si défini.
• Couleur du texte: Définit la couleur de police par défaut pour les titres, les paragraphes et autres éléments textuels.
• Couleur de fond: Définit la couleur d'arrière-plan des sections, des lignes et des conteneurs.
• Couleur de la ligne: Affecte la couleur des lignes de séparation, des bordures et des séparateurs sur votre mise en page.
• Couleur accentuée: Utilisé pour les points forts ou les éléments interactifs tels que les liens, les icônes et les effets de survol.

Pour modifier une couleur, cliquez sur la case de couleur et sélectionnez une nouvelle nuance dans la palette. Toute modification sera automatiquement appliquée à tous les éléments liés à ces variables de couleur globales.

Gestionnaire de polices

Global Styles fournit deux types de styles de texte, à savoir Titre paragraphe. Vous pouvez sélectionner votre option préférée dans le menu déroulant, et la police utilisée est tirée de Google Fonts. 

Typographie

GemPages prend en charge 6 types de Rubriques et 3 types de Paragraphes. Dans les paramètres des éléments, tous les paramètres liés aux styles de texte seront sélectionnés à partir de ces paramètres de typographie globaux.

Lorsque vous installez GemPages, il synchronise la typographie globale avec les styles de texte de vos thèmes. Les informations typographiques synchronisées à partir de votre thème Shopify incluent Famille de polices, taille de police, hauteur de ligne, épaisseur de police, style de police et L'espacement des lettres.

espacement

GemPages vous permet de synchroniser l'espacement sur votre site Web en configurant des valeurs d'espacement globales. Il existe Types 10 d'espacements globaux disponibles, chacun pouvant être personnalisé avec des valeurs pour trois appareils : Bureau, Tablettes et Mobile.

L'unité par défaut de l'espacement global est le pixel (px). L'espacement global peut être utilisé pour configurer les marges, le remplissage, l'espacement des éléments ou les espaces entre les colonnes.

Largeur de ligne par défaut

À propos de la largeur de ligne par défaut

Une page se compose généralement de plusieurs sections, chacune nécessitant un style distinct. Par exemple, les sections telles que Hero Banner ont généralement des arrière-plans et vous préférerez peut-être les définir sur pleine largeur. Cependant, d'autres sections ont une largeur fixe pour conserver la mise en page et centrer le contenu sur l'écran. Ainsi, une valeur universelle est nécessaire pour ajuster automatiquement la largeur de ces sections.

Comment l'utiliser ?

• Largeur de ligne

GemPages définit la valeur de largeur par défaut sur 1200px pour ordinateur de bureau et 100 % pour tablette et mobile, qui convient à tous les modèles actuels. Vous n'avez pas besoin de faire de réglages car GemPages appliquera automatiquement cette valeur. 

Toutefois, si vous préférez une valeur de largeur différente, vous pouvez saisir un nombre dans la case. Par exemple, si vous saisissez 1000 1000 px, la largeur par défaut des sections/lignes qui ne sont pas en pleine largeur sera de XNUMX XNUMX px.

• Rembourrage de page

Saisissez un nombre pour le remplissage souhaité pour les sections/lignes. Veuillez noter que ce remplissage ne s'applique pas aux sections/lignes pleine largeur.

Corners

GemPages vous permet de synchroniser les angles utilisés sur votre site Web en configurant une valeur d'angle globale. Vous pouvez définir trois styles d'angle : Petite, Moyenne et Grande. Cliquez simplement sur le Un crayon icône pour saisir la valeur en pixels.  

Questions fréquentes

Est-il possible de désactiver les styles globaux dans GemPages ?

• Sélectionnez l'élément dans l'éditeur
• Définissez manuellement sa couleur, sa police, son espacement ou ses valeurs de bordure dans l'onglet Paramètres de l'élément.