Changing an icon by custom css

  • Resolved willem0

    (@willem0)


    1 year, 3 months ago

    Hello. Our website uses on the right side: widgets with nice titles and widget-title-icons. For some (not all) pages I would like to use a different icon.
    I can change ALL icons by custom-css:
    .widget-title-tab:before {content: “\f200”;}
    This works, so the icon before the text “SAMEN ACTIEF” will change.
    For just the homepage (post-32) I’ve tried:
    .post-32 .widget-title-tab:before {content: “\f200”;}
    Alas, this doesn’t work.
    What can I do to change an icon on a specific page?
    Thanks.

    The page I need help with: [log in to see the link]

Viewing 2 replies - 1 through 2 (of 2 total)
  • Ѧwesomə Pøssum ❤️

    (@awesomesaucepossum)

    1 year, 3 months ago

    Hi @willem0!

    The code you used doesn’t work, because the button is not within the .post-32 class, but it is elsewhere. You could use the class of the body element to specify your page, and that should work out well:

    .page-id-32 .widget-title-tab:before {
        content: "\f200";
    }
    Thread Starter willem0

    (@willem0)

    1 year, 3 months ago

    Aha, I didn’t realise the widgets are defined elsewhere.
    Thanks a lot for your quick reply 🙂
    I’ve just temperally changed the icon on our homepage!
    Now I know how to continue.

Viewing 2 replies - 1 through 2 (of 2 total)

The topic ‘Changing an icon by custom css’ is closed to new replies.