How to change or remove icon form the "Header custom HTML " box in Header

This topic has 12 replies, 3 voices, and was last updated 9 years, 7 months ago ago by Robert Hall

  • Avatar: cosmedia
    cosmedia
    Participant
    May 14, 2016 at 22:49

    How to change or remove icon form the “Header custom HTML ” box in Header?

    Kind regards,

    Johan

    11 Answers
    Avatar: Eva
    Eva Kemp
    Participant
    May 16, 2016 at 10:50

    Hello,

    What icon do you want to remove?
    Please show on a screenshot and provide your site name.

    Regards,
    Eva Kemp.

    Avatar: cosmedia
    cosmedia
    Participant
    May 16, 2016 at 12:50

    I want to know how to remove it AND how i could change it to another icon

    Here is a screenshot: http://s32.postimg.org/a21e64ql1/Schermafbeelding_2016_05_16_om_13_44_14.jpg

    Please, contact administrator
    for this information.
    Avatar: Eva
    Eva Kemp
    Participant
    May 16, 2016 at 14:05

    Hello,

    You can remove this icon using code in Global Custom CSS:

    .header-type-7 .header .tbs span::before {
       background: transparent;
    }

    To change it use this css code:

    .header-type-7 .header .tbs span::before {
       background-image: url(http://your_link_to_image);
    }

    Regards,
    Eva Kemp.

    Avatar: cosmedia
    cosmedia
    Participant
    May 17, 2016 at 00:34

    Thank you, but how can i change it to one of the icons that are included in the theme?

    Avatar: Robert Hall
    Robert Hall
    Participant
    May 17, 2016 at 07:21

    Hello,

    Please clarify what icon you want use there?

    Regards,
    Robert Hall

    Avatar: cosmedia
    cosmedia
    Participant
    May 17, 2016 at 14:50

    The information icon, the “i” icon.

    Avatar: Eva
    Eva Kemp
    Participant
    May 17, 2016 at 17:43

    Hello,

    You can use this code:

    .header-type-7 .header .tbs span::before {
        content: "\f0f3";
        font-family: FontAwesome;
    }

    Replace the code \f0f3 with the needed one of FA icons http://fontawesome.io/icons/ .

    Regards,
    Eva Kemp.

    Avatar: cosmedia
    cosmedia
    Participant
    May 18, 2016 at 02:38

    Now the icon overlaps the original yellow icon, i want the replace the original, but keep the yellow colour

    Avatar: Eva
    Eva Kemp
    Participant
    May 18, 2016 at 08:44

    Hello,

    Try the following variant:

    .header-type-7 .header .tbs span::before {
        content: "\f129";
        background: none;
        font-family: FontAwesome;
        color: #DBAA56;
    }

    Regards,
    Eva Kemp.

    Avatar: cosmedia
    cosmedia
    Participant
    May 18, 2016 at 15:27

    This worked thank you!

    Avatar: Robert Hall
    Robert Hall
    Participant
    May 18, 2016 at 15:30

    Hello,

    You’re welcome!

    Regards,
    Robert Hall

  • Viewing 12 results - 1 through 12 (of 12 total)

The issue related to '‘How to change or remove icon form the "Header custom HTML " box in Header’' has been successfully resolved, and the topic is now closed for further responses

We're using our own and third-party cookies to improve your experience and our website. Keep on browsing to accept our cookie policy.