Comment afficher des images gravatar rondes dans WordPress

Récemment, nous vous avons montré comment styliser la mise en page de vos commentaires et comment styler votre formulaire de commentaire. Un de nos utilisateurs nous a envoyé un courrier électronique et nous a demandé: «Comment avez-vous rendu vos images gravatar? Stockez-vous localement des images gravatar pour les rendre rondes? »Dans cet article, nous allons vous montrer comment afficher des images gravatar rondes dans WordPress. Nous allons utiliser la propriété border-radius de CSS3 pour créer des images gravatar circulaires.

La première chose à faire est de modifier le fichier style.css de votre thème. Vous pouvez le faire en utilisant un programme FTP ou en allant à Apparence »Editeur dans votre admin WordPress. Ensuite, vous voulez ajouter le code suivant dans votre fichier CSS:

 .avatar border-radius: 50%; -moz-border-radius: 50%; -webkit-border-radius: 50%;  

Cela devrait fonctionner sur la plupart des thèmes WordPress. Cependant, si cela ne fonctionne pas sur votre thème, il y a probablement un plugin ou votre fonction de thème qui dérange avec les classes par défaut utilisées pour gravatar dans WordPress. Pour savoir quelles images gravatar de classe css utilisent dans votre thème, vous devez ouvrir un article de blog contenant des commentaires. Faites défiler jusqu'à la section des commentaires et cliquez avec le bouton droit de la souris sur l'image du gravatar pour sélectionner Inspecter l'élément. Il vous montrera le code source de votre gravatar, comme ceci:

Si l’image gravatar a autre chose que avatar puis utilisez cela au lieu de .avatar dans le code css ci-dessus.

Nous espérons que cet article vous a aidé à afficher des images rondes de gravatar sur votre blog WordPress. Faites-nous savoir si vous avez des questions ou des commentaires en laissant un commentaire ci-dessous.