New Landing How can we help? Themeforest Theme Support Flexform Text block title icon color

Viewing 8 posts - 1 through 8 (of 8 total)
  • Posted in: Flexform
  • #81283
    aaustin69
    Member
    Post count: 115

    Hi, I am using font awesome icons by inserting them into the Title icon field of some of my text block elements. 2 questions:

    1. Is there a way to change the color of these icons?

    2. Is there a way to change the color of the widget title as well, but only when I am using the widget title in combination with the title icon (not in the situation where it’s just the widget title with an underline and no icon)?

    I have included a link to my home webpage is below. I am referring to the 3 text blocks below the revolution slider where I wanted to change the color of the icon and widget title.

    Home

    Thanks in advance, Alan

    #81292
    Rui Guerreiro – SUPPORT
    Keymaster
    Post count: 25779

    Hi,

    Font awesome icons are text like any other letter or symbol, so we can change the color without any problem.

    I suggest that you edit those text blocks in the Swift Page Builder and in the last field “Extra class name” fill the same value in the 3 text block. For instance you put the value home-text-icons

    After that in the custom css option add the code bellow.

    .home-text-icons{ 
    color:#536FDF;
    }

    Let us know if you did it, or if you still need our help.

    Best Regards,
    Rui

    #81309
    aaustin69
    Member
    Post count: 115

    Thanks Rui,

    I was able to change the icon colors by using the code in the custom css.

    Regarding my second question – is there a way to change the color of the widget title as well, just for the text blocks where I am using the icons? So for example, the home page is the only place I am using icons within the text blocks, so I was hoping I could change the color of the widget title text as well.

    Alan

    #81323
    Mohammad – SUPPORT
    Moderator
    Post count: 27441

    HI,
    Please try this custom css code:
    div.wpb_wrapper div.heading-wrap h3.wpb_heading{color:#ff000 !important}
    Thanks ๐Ÿ™‚
    With Best Regards
    Swift Ideas

    #81324
    aaustin69
    Member
    Post count: 115

    Hi Mohammad, that worked but I noticed that it also changes the widget title of the text blocks that do not use an icon. Is there a way to separate so it only changes the color on the ones with an icon, or is it all or none?

    Thanks, Alan

    #81331
    Mohammad – SUPPORT
    Moderator
    Post count: 27441

    Hi,
    Please put a extra class named iconheading to each column . So the code will be use like :
    .iconheading div.wpb_wrapper div.heading-wrap h3.wpb_heading{color:#ff000 !important}

    Hope that will help you sure .
    Thanks.

    #81554
    aaustin69
    Member
    Post count: 115

    Thanks Mohammad.

    #81565
    Mohammad – SUPPORT
    Moderator
    Post count: 27441

    Hi,
    You most welcome . I’m glad that issue resolved .
    Thanks ๐Ÿ™‚
    With Best Regards
    Swift Ideas

Viewing 8 posts - 1 through 8 (of 8 total)

You must be logged in and have valid license to reply to this topic.

License required for the following item
Login and Registration Log in · Register