Comment changer la couleur des liens sur Shopify (2026)

L’essentiel

• De nombreux thèmes proposent une couleur « Accentuation » ou « Lien » dans Éditeur de thème > Paramètres du thème > Couleurs.
• Si votre thème n’a pas de paramètre dédié pour la couleur des liens, ciblez le sélecteur a dans le CSS.
• Vous pouvez styliser séparément les liens au survol en utilisant a:hover en CSS.
• Fudge peut modifier la couleur de vos liens à partir d’une simple description textuelle si vous préférez éviter d’écrire en CSS.

La couleur des liens est l’un de ces paramètres que certains thèmes affichent directement, tandis que d’autres la cachent profondément dans le code. Voici où la chercher et comment la modifier dans un cas comme dans l’autre.

Pourquoi nous faire confiance

Nous avons créé et personnalisé des centaines de boutiques Shopify. Nous avons également développé Fudge - un éditeur de boutique assisté par IA qui bénéficie d’une note de 5,0 sur le Shopify App Store.

Méthode 1 - Vérifiez d’abord Paramètres du thème > Couleurs

De nombreux thèmes Shopify modernes intègrent un paramètre de couleur exclusivement dédié aux liens.

Étape 1. Allez dans Boutique en ligne > Thèmes > Personnaliser.

Étape 2. Cliquez sur Paramètres du thème dans la barre latérale gauche.

Étape 3. Ouvrez la section Couleurs.

Étape 4. Cherchez une pastille nommée Lien, Accentuation ou Accentuation principale. Si elle existe, cliquez dessus pour modifier la couleur.

Étape 5. Cliquez sur Enregistrer.

Ce que contrôle généralement la couleur d‘“accentuation”

Dans les thèmes qui utilisent une couleur d’accentuation (accent) plutôt qu’une couleur de lien spécifique, cette couleur affecte généralement :

• Le texte des hyperliens
• L’arrière-plan des boutons (boutons principaux)
• La mise en valeur des icônes
• Les éléments actifs du menu de navigation

Changer la couleur d’accentuation modifiera tout cela en même temps. Si vous souhaitez uniquement modifier la couleur des liens - et non celle des boutons - vous devrez utiliser le CSS.

Méthode 2 - Modifier la couleur des liens en CSS

Si votre thème n’a pas de couleur de lien dédiée dans l’Éditeur de thème, ou si vous voulez que vos liens aient une couleur différente de celle de vos boutons, le CSS est la meilleure solution.

Étape 1. Dupliquez votre thème. Allez dans Boutique en ligne > Thèmes > Actions > Dupliquer.

Étape 2. Sur votre thème actif, allez dans Actions > Modifier le code.

Étape 3. Ouvrez le dossier Assets > base.css (ou la feuille de style principale de votre thème - cherchez le plus gros fichier .css dans le dossier Assets).

Étape 4. Ajoutez ces règles CSS tout en bas du fichier :

/* Couleur par défaut des liens */
a { color: #1a4b8c; }

/* Couleur des liens au survol (hover) */
a:hover { color: #0d2e5e; }

/* Liens uniquement à l'intérieur d'une zone spécifique */
.rte a { color: #1a4b8c; }

Étape 5. Cliquez sur Enregistrer.

La classe .rte

Dans de nombreux thèmes Shopify, le contenu de l’éditeur de Pages et des descriptions de produits est imbriqué dans une classe nommée .rte (rich text editor). L’utilisation de .rte a comme sélecteur permet de cibler uniquement les liens dans ces zones de contenu, sans impacter les liens de la navigation ou le texte des boutons.

Article lié : Mettre à jour les couleurs et les polices sur Shopify.

Styliser les liens soulignés

Par défaut, les liens dans la vaste majorité des thèmes sont soit toujours soulignés, soit jamais soulignés. Vous avez la possibilité de gérer ce comportement avec le CSS :

/* Supprime le soulignement de tous les liens */
a { text-decoration: none; }

/* Ajoute le soulignement uniquement au survol */
a:hover { text-decoration: underline; }

/* Souligne uniquement les liens présents dans le corps du texte */
.rte a { text-decoration: underline; }

Modifier la couleur des liens de navigation

Les liens de navigation et ceux du corps de page ont des styles distincts dans la plupart des thèmes.

Dans l’Éditeur de thème, rendez-vous dans la section Paramètres du thème > Couleurs et cherchez une option appelée Navigation ou En-tête.

Si vous ne trouvez rien, ciblez les liens de navigation (nav) en CSS. Faites un clic droit sur un de ces liens dans votre navigateur, choisissez Inspecter, et relevez les noms des classes CSS. Ajoutez ensuite une règle comme celle-ci :

.header__menu-item a { color: #333333; }

Le nom exact de la classe varie d’un thème à l’autre.

L’utilisation de Fudge pour modifier la couleur des liens

Si l’idée d’écrire en langage CSS ne vous enthousiasme pas, Fudge s’en occupe parfaitement pour vous. Vous n’avez qu’à décrire ce que vous souhaitez accomplir :

“Bascule la couleur de tous les hyperliens sur la valeur #1a4b8c. Au survol, obscurcis-les en #0d2e5e.”

“Fais que les liens dans les descriptions de produits soient bleus et soulignés.”

Fudge se chargera d’écrire le CSS et de l’appliquer en tant que brouillon. Il ne vous restera plus qu’à vérifier et le publier.

Article lié : Changer la couleur de la police sur Shopify.

Aide-mémoire

Comment modifier l’image qui s’affiche lorsqu’on partage un lien Shopify sur les réseaux sociaux ?

Il s’agit d’un paramètre bien différent de la couleur des liens — on parle de votre image Open Graph (OG). Pour changer l’image qui se dévoile lorsque l’URL de votre boutique est partagée sur Facebook, Twitter ou iMessage, naviguez vers Boutique en ligne → Préférences → Image de partage sur les réseaux sociaux et téléversez celle que vous avez choisie. Par défaut, les pages individuelles de produits ou de collections utiliseront leur propre première image. Pour personnaliser ces images OG page par page, modifiez directement la section SEO de chaque page. Cela n’a absolument rien à voir avec la couleur des liens de votre boutique.

Article lié : Ajouter un lien sur un texte sur Shopify.

Article lié : Mettre à jour les couleurs de la marque sur Shopify.