Voulez-vous apprendre à changer la couleur des liens dans WordPress ?
Changer la couleur de votre lien vous donne plus de contrôle sur la conception de votre site Web et peut faciliter la navigation de vos visiteurs.
Dans cet article, nous allons vous montrer comment changer la couleur du lien dans WordPress, étape par étape.
Pourquoi changer la couleur du lien dans WordPress ?
Lorsque vous ajoutez un lien dans WordPress, votre thème déterminera automatiquement la couleur du lien.
Parfois, les options de couleur par défaut de votre thème WordPress seront exactement ce que vous voulez, mais d’autres fois, vous voudrez plus de contrôle sur l’apparence des liens.
Par exemple, vous pouvez modifier la couleur de vos liens pour qu’ils correspondent à la marque ou au logo de votre entreprise. Vous pouvez également augmenter le contraste des couleurs pour améliorer l’accessibilité du Web pour les lecteurs malvoyants.
Certains thèmes vous permettent de modifier la couleur du lien directement à partir de votre panneau d’options de thème ou du personnalisateur de thème WordPress, alors assurez-vous de vérifier la documentation de votre thème avant de changer la couleur du lien avec CSS.
Cela étant dit, examinons quelques façons de modifier la couleur des liens sur votre site Web WordPress.
Méthode 1. Changer la couleur du lien dans WordPress en éditant CSS
Une façon de changer la couleur du lien dans WordPress consiste à ajouter du code CSS personnalisé.
La première chose que vous devez faire est de naviguer vers votre tableau de bord d’administration WordPress et d’aller à Apparence » Personnaliser puis cliquez sur l’option de menu « CSS supplémentaire ».
Cela vous amènera à un écran où vous pourrez ajouter votre code CSS personnalisé sur le côté gauche de la page.
Vous allez ajouter les extraits de code CSS des exemples ci-dessous à cette section de votre éditeur.
Tout d’abord, nous allons personnaliser la couleur globale du lien. C’est la couleur que vos visiteurs verront s’ils n’ont jamais cliqué sur le lien auparavant.
Vous pouvez utiliser le code CSS ci-dessous comme exemple.
a {
color: #FFA500;
}
Cela changera la couleur du lien par défaut en orange. Assurez-vous de changer le #FFA500 couleur à la couleur que vous souhaitez utiliser.
Changer la couleur de survol du lien dans WordPress
La prochaine chose que nous allons changer est la couleur de survol du lien. De cette façon, lorsqu’un utilisateur place son curseur sur un lien, celui-ci change de couleur pour attirer son attention.
Vous pouvez utiliser le code CSS ci-dessous comme exemple.
a:hover {
color: #FF0000;
text-decoration: underline;
}
Le code ci-dessus changera la couleur du lien en rouge et soulignera le texte lorsque les visiteurs le survoleront. Assurez-vous de changer le #FF0000 couleur à celle que vous préférez.
Nous utilisons l’effet de survol de soulignement de lien ici chez WPBeginner sur nos liens.
Changer la couleur du lien après la visite dans WordPress
Une autre chose que vous voudrez peut-être changer est la couleur du lien après qu’un utilisateur a cliqué sur un lien. Cela peut aider les visiteurs à naviguer facilement sur votre blog WordPress et à voir sur quels liens ils ont déjà cliqué.
Vous pouvez utiliser le code CSS ci-dessous pour changer la couleur du lien visité.
a:visited {
color: #0000FF;
}
Assurez-vous de changer le bleu #0000FF couleur à la couleur de votre choix.
Voici à quoi ressemblera tout le code CSS ci-dessus dans le personnalisateur WordPress.
Une fois que vous avez effectué vos modifications, cliquez sur le bouton « Publier » pour rendre vos modifications en direct.
Le code CSS ci-dessus changera la couleur de tous les liens sur votre site.
Si vous souhaitez uniquement personnaliser les liens qui se trouvent dans vos articles et pages, vous pouvez utiliser l’exemple de code ci-dessous.
.entry-content a {
color: #FFA500;
}
.entry-content a:hover {
color: #FF0000;
text-decoration: underline;
}
.entry-content a:visited {
color: #0000FF;
}
Ce code fait la même chose que les exemples de code ci-dessus, mais .entry-content ne cible que les liens au sein de votre contenu.
Changer la couleur de vos liens de navigation dans WordPress
Un dernier style de lien que vous pouvez également personnaliser est celui des liens de votre menu de navigation.
Pour plus de détails, consultez notre guide sur la façon de styliser les menus de navigation WordPress.
Si vous ne souhaitez pas ajouter de code directement à votre thème WordPress, vous pouvez utiliser un plugin CSS pour ajouter du code à votre site Web.
De cette façon, vos modifications CSS seront appliquées même si vous décidez de modifier votre thème WordPress.
La première chose à faire est d’installer et d’activer le plugin Simple Custom CSS et JS. Pour plus de détails, consultez notre guide étape par étape sur la façon d’installer un plugin WordPress.
Lors de l’activation, rendez-vous simplement sur CSS & JS personnalisés » Ajouter CSS personnalisé dans votre panneau d’administration WordPress.
Ici, vous pouvez ajouter le même code CSS que ci-dessus.
Une fois que vous avez terminé d’ajouter le code, assurez-vous de cliquer sur le bouton « Publier » ou « Mettre à jour ».
Méthode 2. Changer la couleur du lien sans modifier le CSS
Si vous n’êtes pas à l’aise pour éditer des fichiers CSS, cette méthode est faite pour vous.
Au lieu d’ajouter du code CSS directement à votre site Web, vous pouvez utiliser un plugin de style CSS pour modifier visuellement votre site sans écrire de code.
Nous vous recommandons d’utiliser le plugin CSS Hero. Il est très convivial pour les débutants et vous permet de personnaliser visuellement votre site Web de la même manière qu’un générateur de page par glisser-déposer.
Une fois le plugin installé, vous devez cliquer sur le bouton ‘Procéder à l’activation du produit’ au-dessus de la liste des plugins pour l’activer et connecter votre compte.
Cela vous amènera à un écran où vous pourrez entrer votre nom d’utilisateur et votre mot de passe.
Tout ce que vous avez à faire est de suivre les instructions à l’écran et vous serez redirigé vers votre site Web une fois votre compte vérifié.
Ensuite, cliquez sur le bouton « Personnaliser avec CSS Hero » en haut de votre barre d’outils d’administration WordPress.
Cela ouvrira votre site Web avec CSS Hero s’exécutant dessus. CSS Hero utilise ce qu’on appelle un éditeur What You See is What You Get (WYSIWYG).
Cliquez simplement sur n’importe quel élément de la page et une barre d’outils vous permettra d’effectuer des personnalisations.
Ensuite, cliquez sur l’un des liens de votre site Web. Nous allons commencer par l’un des liens vers les articles de blog.
Après cela, sélectionnez l’élément de menu ‘Typographie’ et vous pouvez choisir une nouvelle couleur pour votre lien.
Vous pouvez choisir une nouvelle couleur dans la liste ou ajouter votre propre code couleur.
Changer la couleur de votre menu de navigation WordPress
Ensuite, vous pouvez changer la couleur de vos liens de menu de navigation WordPress.
Survolez simplement votre menu de navigation et cliquez sur l’un des éléments de menu.
Ensuite, sélectionnez l’option « Typographie » et vous pouvez personnaliser la couleur directement ci-dessous.
Vous remarquerez que lorsque vous modifiez la couleur du lien du menu, les modifications apparaissent immédiatement dans l’aperçu.
Une fois que vous avez terminé de modifier les couleurs des liens, vous devez cliquer sur le bouton « Enregistrer et publier » pour rendre vos modifications en direct.
Nous espérons que cet article vous a aidé à apprendre comment changer la couleur des liens dans WordPress. Vous pouvez également consulter notre guide sur la façon de choisir le meilleur logiciel de conception de sites Web, ou notre liste de plugins WordPress indispensables.
Si vous avez aimé cet article, veuillez vous abonner à notre chaîne YouTube pour des didacticiels vidéo WordPress. Vous pouvez également nous retrouver sur Twitter et Facebook.
L’article Comment changer la couleur du lien dans WordPress (Guide du débutant) est apparu en premier sur WPBeginner.
Articles similaires:
