utiliser Bibliothèque de modèles GenerateBlocksAprès avoir créé une page, de nombreux utilisateurs souhaitent apporter des ajustements uniformes aux styles des modules, tels que les polices, les couleurs, l'espacement et la largeur des conteneurs, ainsi qu'à d'autres contenus. Ce didacticiel montre la source des styles de page à l'aide d'exemples, ainsi que des méthodes spécifiques pour modifier les styles des boutons, les couleurs des titres, l'espacement des paragraphes et la largeur des conteneurs.

Vue d'ensemble de la structure du style du modèle

Les styles de la page proviennent de trois niveaux :

• Styles de thème : par exemple, famille de polices, formatage des titres H1-H2, espacement des paragraphes, etc.
• Style de bloc local : n'affecte que les paramètres d'un bloc particulier.
• Style global (Style mondial) : peut être réutilisé dans plusieurs zones de la station

Démonstration des paramètres de police

Les polices suivantes sont modifiées par le personnalisateur dans la page d'exemple :

• Police de texte : Rubik
• Polices des titres (H1 et H2) : Roboto Mono

Tous les modules qui utilisent H1 et H2 héritent automatiquement des polices et des graisses de police. Par exemple, ouvrez la bibliothèque de modèles et sélectionnez Héros H1 rendra les nouveaux paramètres de police.

Styles de boutons personnalisés

Les boutons de la page utilisent un bouton nommé gbp-button-primary du style global. Modifiez-le comme suit :

• Sélectionnez le bloc de boutons et cliquez sur le nom du style gbp-button-primary

• Allez dans les paramètres d'arrière-plan et modifiez la couleur du bouton, par exemple en choisissant une couleur plus foncée dans la palette.

• Tous les boutons de la page qui utilisent ce style sont mis à jour de manière synchrone, y compris les nouveaux modèles qui seront insérés à l'avenir.

Ajustement des couleurs de survol des boutons

• Cliquez sur le bloc de boutons pour passer à l'état de survol.

• Modifier la couleur du survol dans les paramètres de l'arrière-plan (par exemple, tons clairs)

• Après l'enregistrement, l'effet de survol prend effet immédiatement.

Réglage de la couleur de l'en-tête (exemple H1)

Pour unifier les couleurs de tous les titres H1, suivez les étapes ci-dessous :

• Localisez n'importe quel élément H1 et cliquez sur sa balise de style globale.
• Modifier la couleur de la police, par exemple en choisissant un brun rougeatre ou d'autres couleurs vives.

• Le module Hero est à nouveau inséré et la couleur du titre a changé !

Cette méthode s'applique à l'ensemble des paramètres de style de la page et ne nécessite pas de modifications manuelles répétées du style.

Contr?ler l'espacement entre le haut et le bas des blocs

La plupart des modules de modèles (à l'exception de Hero) utilisent un modèle nommé section gbp Le style global qui contr?le les marges intérieures supérieures et inférieures avec l'espacement à gauche et à droite, par exemple :

• Espacement en haut et en bas : 7rem
• Espacement gauche-droite : 40px

Les ajustements sont effectués comme suit :

• Modules ouverts tels que Caractéristiques, Galerie, Prix, etc.
• Cliquez sur l'onglet Style section gbp

• Modifier l'espacement en haut et en bas pour qu'il soit de 3rem

• Tous les modules qui font référence à ce style sont synchronisés et mis à jour pour une page plus compacte et plus claire.

Réglage de la largeur maximale du conteneur

Générer des blocs Prise en charge de la définition de la largeur maximale des conteneurs. Si le thème actuel est GeneratePressLa largeur par défaut (par exemple 1440px) peut être définie dans Mise en page → Conteneurs.

La procédure de configuration est la suivante :

• Sélectionner le conteneur dans le module
• Activer "Largeur maximale"

• Choisissez d'utiliser la largeur maximale du thème ou de GenerateBlocks.

Même si vous n'utilisez pas GeneratePress, vous pouvez définir la largeur appropriée dans le paramètre GenerateBlocks.

Ajouter des styles globaux personnalisés

Il est également possible d'ajouter vos propres styles globaux à la structure du modèle existant. Par exemple, dans le module équipe, ajoutez un style exclusifthermosensibleNom de la classe (par exemple .carte), définissez le style et vous pourrez ensuite le réutiliser dans plusieurs pages.

résumés

Cette section présente :

• Les styles de modèles se situent à trois niveaux : les thèmes, les blocs locaux et les styles globaux.
• Styles globaux pour standardiser les polices, les couleurs, les boutons, l'espacement et la largeur des blocs
• Régler une fois, l'ensemble du module de la station réagit de manière synchrone
• Les styles personnalisés peuvent être étendus en fonction des exigences de la page pour une gestion unifiée ultérieure.

La ma?trise de ces méthodes de stylisation permet de construire des mises en page bien structurées et cohérentes. N'hésitez pas à en apprendre davantage ! Générer des blocs Contenu du tutoriel.

Mises à jour récentes

Contactez nous
Vous n'arrivez pas à lire le tutoriel ? Contactez-nous pour une réponse gratuite ! Aide gratuite pour les sites personnels et les sites de petites entreprises !	Service clientèle WeChat
① Tel : 020-2206-9892
② QQ咨詢：1025174874
(iii) Courriel : info@361sale.com
④ Horaires de travail : du lundi au vendredi, de 9h30 à 18h30, jours fériés.