Styliser un bloc : espacement, arrière-plan, bordure, ombre, animation
Cliquez sur un bloc, ouvrez l'icône crayon (Modifier) et choisissez l'onglet Styles: il regroupe Typographie, Dimensions, Espacement, Arrière-plan, Bordure, Ombre, Affichage, Position et Animation. L'appareil sélectionné dans la barre supérieure détermine si votre modification s'applique à l'ordinateur, à la tablette ou au mobile.
Étapes
- Ouvrez Boutique en ligne → Paramètres du thème (ou une landing page) et cliquez sur le bloc. Pour styliser tout un conteneur plutôt que le texte à l'intérieur, choisissez la Section ou la Box dans Couches de conception.
- Cliquez sur l'icône crayon dans la barre de gauche, puis sur l'onglet Styles.
- Parcourez les sections dont vous avez besoin:
- Typographie: famille de police, taille, graisse, couleur, hauteur de ligne, espacement des lettres, alignement, transformation.
- Espacement: Marge intérieure (à l'intérieur) et Marge extérieure (à l'extérieur).
- Arrière-plan: Solide, Dégradé ou Image.
- Bordure: largeur, style, couleur, rayon.
- Ombre: préréglages Aucune / Douce / Flottante / Marquée, ou décalages, flou, étendue, opacité et couleur.
- Position: Static, Relative, Absolute, Fixed ou Sticky, plus Position des calques (ordre d'empilement).
- Pour le mouvement, ouvrez Animation, choisissez un préréglage parmi Attire l'attention, Animations d'entrée, Animations de sortie ou Effets spéciaux, puis définissez Durée (ms), Délai (ms) et Boucle infinie.
- Lisez l'indication « Appliqué sur »: avec le cadre téléphone sélectionné, les styles s'appliquent au Mobile (jusqu'à 768px); avec le cadre tablette, à la Tablette (jusqu'à 991px); sinon à l'Ordinateur. Changez d'appareil et répétez si nécessaire.
- Cliquez sur Enregistrer et vérifiez que la page est Publié.
Problèmes courants
- J'ai stylisé un bloc sur ordinateur mais rien n'a changé sur mon téléphone → les styles sont enregistrés par taille d'écran; sélectionnez le cadre téléphone et définissez-les à nouveau.
- Je veux changer tous les boutons ou les couleurs de toute la boutique → l'onglet Styles est propre à chaque bloc. Utilisez Personnalisation du thème (icône nuancier) pour les couleurs, la police et le Rayon de toute la boutique.
- Mes styles ont disparu après avoir changé le design du bloc → changer de variante réinitialise les styles; définissez-les à nouveau.
- Un texte a un aspect différent du reste de la boutique → vous avez défini une Famille de police propre au bloc dans Typographie; supprimez-la pour hériter de la police de la boutique.
Voir aussi
- Changer les couleurs, la police et le rayon des angles de votre boutique
- Modifier séparément la mise en page mobile et tablette
- Changer le design (variante) d'un bloc