Как добавить иконку заголовку виджета в Wordpress?

Question

[Warlynn]

На сайте присутствуют виджеты в правом сайдбаре.
Настроено так, что на разных страницах отображаются по одному разные виджеты
Например здесь виджет "продукты", а здесь виджет "наши преимущества", но иконка в заголовке одна и та же. Как можно сделать разные иконки для этих виджетов, при условии, что к ним обоим применяется один стиль?

#right-sidebar .widget h4:before {
    font-family: "FontAwesome";
    content: "\f072";
    padding: 0 10px 0 0;
}

Answer 1

[deadnice]

Поменять стили.
Вместо этого:

#right-sidebar .widget h4:before {
    font-family: "FontAwesome";
    content: "\f072";
    padding: 0 10px 0 0;
}

Это:

#text-2 h4:before {
    font-family: "FontAwesome";
    content: "\f083";
    padding: 0 10px 0 0;
}

#nav_menu-5 h4:before {
    font-family: "FontAwesome";
    content: "\f072";
    padding: 0 10px 0 0;
}

Comments

[Warlynn]

Супер, спасибо, сработало!

Answer 2

[Вова Дружаев]

#nav_menu-5
#text-2 - у виджетов разные id. зацепиться можно

и в body классы разные
https://www.youtube.com/watch?v=yntt4BpgJNw&t=404s
лучше осилить все 4-ре части видео

Comments

[Warlynn]

Спасибо, цеплялся, но оставлял зачем-то ".widget", теперь сработало! Спасибо за видео

Answer 3

[Денис Янчевский]

Можете взять класс из элемента body.
Главная

.page-id-9 #right-sidebar .widget h4:before {
    font-family: "FontAwesome";
    content: "\f072";
    padding: 0 10px 0 0;
}

Оставить запрос

.page-id-787 #right-sidebar .widget h4:before {
    font-family: "FontAwesome";
    content: "\f073";
    padding: 0 10px 0 0;
}