Comment modifier / désactiver un lien dans WordPress

Je ne compte plus le nombre de fois où quelqu’un m’a posé une de ces questions sur WordPress :
“Comment supprimer le bouton “Lire la suite” ?”
“Comment supprimer ce lien ?”
“Comment changer la couleur du lien ?”
“Comment rendre ce lien non cliquable tout en gardant le texte sur la page ?”
ou des questions comme celles-ci

Il existe en fait des astuces assez simples pour le faire avec WordPress.

Avant toute chose, il faut savoir 2 choses :

1. Comment connaître une classe d’articles. Une classe en CSS est le nom d’un élément, vous en avez besoin pour modifier cet élément.
   Vous pouvez simplement utiliser l’inspecteur de votre navigateur (souvent par clic droit et “inspecter”). Ensuite, il vous suffit de sélectionner l’élément que vous souhaitez modifier et rechercher la classe saisie comme class = “item-class”
   
2. Où mettre le CSS dans WordPress. 3 façons
   – Vous pouvez le mettre directement dans le champ par défaut en allant dans Apparence > Personnaliser > CSS supplémentaire
   – Si vous utilisez un constructeur comme Elementor, vous pouvez le mettre directement dans la page, au niveau de l’élément.
   Dans Elementor par exemple il faut aller dans Avancé > CSS personnalisé
   mais c’est différent dans chaque constructeur, assez facile à trouver
   – Vous pouvez le mettre dans un fichier sur votre serveur nommé « style.css », ce fichier existe déjà dans votre WordPress

Maintenant, je vais essayer de partager quelques codes CSS qui peuvent vous aider, vous pouvez les combiner et les utiliser ensemble.
CSS fonctionne d’une manière assez simple comme :

.item-class{
property : argument;
}

la propriété est essentiellement ce que vous voulez faire, vous pouvez trouver toutes les propriétés sur n’importe quel site Web CSS.
L’argument est assez simple mais doit respecter les valeurs CSS

Ce que vous devez savoir si vous souhaitez travailler avec des liens : il faut souvent mettre un « a » après votre classe pour que cela fonctionne.
Vous pouvez tester sans le « a » et sans le « a » pour voir si votre code fonctionne ou non.
Ajoutez simplement votre CSS, enregistrez et vérifiez votre interface. CSS n’est pas vraiment risqué, si vous faites une erreur, vous pouvez simplement supprimer votre code ou le modifier, cela ne cassera rien 🙂

Comment supprimer votre lien :

.item-class{
     display : none;
}

ou

.item-class a{
     display : none;
}

Comment désactiver un lien (le lien sera toujours visible mais il sera impossible de cliquer dessus).
Notez qu’il est toujours préférable de modifier le HTML pour ce faire mais le CSS pourrait être plus facile ou la seule solution possible pour vous alors voici le code :

.item-class{
     pointer-events: none;
}

Comment changer la couleur du lien :

.item-class{
     color : blue;
}

.item-class{
     color : #F7F7F7;
}

Si vous voulez combiner des choses, c’est en fait assez facile, disons que vous voulez désactiver le clic et remettre le lien en noir.
Vous pouvez utiliser ce code

.item-class{
     pointer-events : none;
     color : black;
}

Une dernière chose à propos de CSS :
Vous pourriez constater que votre code ne fonctionne pas même si vous avez tout fait correctement
Cela peut être dû au fait qu’il existe déjà un code CSS qui dit quelque chose de différent de votre code.
Si vous voulez remplacer cela, vous pouvez simplement ajouter !important comme ceci :

.item-class{
     pointer-events: none !important;
}