А ось як він виглядає після використання деякого простого CSS.
Як це завжди буває перед змінами в темі, краще використовувати дочірню тему (або спеціальний блок CSS, організований для таких змін).
Всі ці рядки з 50% - для підтримки різних браузерів. Деякі вважають, що в наш час вам потрібно тільки border-radius: 50%; але якщо ви хочете бути впевненими на 100%, використовуйте весь цей код.
Збережіть файл. Повинно спрацювати.
Якщо не спрацювало ...
Якщо цей код не спрацював, то, швидше за все, у вашій темі не використовується клас "avatar". Якщо справа в цьому, є кілька способів, як з'ясувати назву цього класу у вашій темі.
Тепер ви можете вивчити CSS. Ось приклад, як це виглядає в Firefox. Для цього тесту я використовував стандартну тему Twenty Twelve і, як виявилося, у неї інше ім'я класу. Нижче ви можете бачити, що ім'я класу тут не просто "avatar", а "author-avatar":
Після того, як я це дізнався, я змінив ім'я класу в коді на "author-avatar".
Зверніть увагу. слово "avatar" може використовуватися в багатьох місцях. Продовжуйте шукати потрібний вам клас.
Я не експерт в CSS, так що може бути це просто у мене не вийшло знайти, але я вирішив не втрачати часу і перейшов до пошуку слова "avatar" в CSS файлі. Я швидко знайшов блок ".commentlist .avatar" у файлі. Підозрюючи, що це правильний стиль, я спробував - і спрацювало. Ось що я додав (зверніть увагу: тут не було тега "img")
Зображення не відображаються?
У декого може бути проблема серйозніша - зображення можуть взагалі не відображатися. Чому ж?
Якщо ви зареєстровані на gravatar.com, але не бачите зображень, причини можуть бути наступними:
Джерело: wpmu.org
Дякуємо! Чудово працює )
