Par défaut, les points de navigation inactifs de l'élément Carousel de GemPages apparaissent en gris et sans bordure. Pour un style plus épuré ou moderne, vous pouvez les rendre transparents avec une bordure blanche grâce à du CSS personnalisé.
Ce guide vous accompagnera pas à pas tout au long du processus. Après avoir suivi ce guide, les points de navigation inactifs de votre carrousel :
- Avoir un fond transparent
- Afficher une bordure blanche
- Adoptez un design plus épuré et minimaliste
Étape 1 : Ajouter du CSS personnalisé à l’élément Carousel
- Ouvrez votre page dans le Éditeur GemPages
- Cliquez sur le Élément de carrousel
- Faites un clic droit et sélectionnez Code personnalisé
- Dans le panneau Code personnalisé, collez le code CSS suivant :
ElementClass .gp-carousel-dot-container bouton { bordure : 1px solide #fff; }
- remplacer ElementClass avec la classe réelle de votre élément Carrousel
Étape 2 : Rendre transparents les points de navigation inactifs
Au lieu d'utiliser CSS, vous pouvez modifier directement ce paramètre dans l'éditeur :
- Cliquez sur le Élément de carrousel
- Rendez-vous dans la section Cercles panneau des paramètres
- Découvrez Inactif couleur option
- Définissez la couleur sur Politique de retour
Cela supprime le fond gris par défaut des points inactifs.
Merci pour vos commentaires