ATTENTION, PLEASE READ: New topic creation is disabled, as we have moved to a new support system. Your existing topics will remain, but for all new requests you will need to use the new system. Click here to go to the new support request form.

• Back to forum

  Posted in: Atelier
• November 23, 2015 at 2:22 pm #230618
  pgf21

  Member

  Post count: 7

  Hi

  I’m trying to change the colour of the social icons to the official social media hex codes. I’ve managed to do this but when you rollover them the white icon has now disappeared as it’s in the same colour as the rollover boxes. Is there a way to have a white icon on rollover or remove the box?

  I’ve attached 2 screenshots.

  Thanks

  Adam

  Attachments:

  You must be logged in to view attached files.
  November 23, 2015 at 2:58 pm #230634
  Kyle – SUPPORT

  Moderator

  Post count: 35880

  change:

  i.fa-twitter {
      color: #1dadea;
  }
  
  .fa-facebook-f:before, .fa-facebook:before {
      color: #3B5998;
  }
  
  i.fa-pinterest {
      color: #C92228;
  }
  
  i.fa-instagram {
      color: #517fa4;
  }

  to

  ul.social-icons li a:not(:hover) i.fa-twitter {
      color: #1dadea;
  }
  
  ul.social-icons li a:not(:hover) .fa-facebook-f:before, ul.social-icons li a:not(:hover) .fa-facebook:before {
      color: #3B5998;
  }
  
  ul.social-icons li a:not(:hover) i.fa-pinterest {
      color: #C92228;
  }
  
  ul.social-icons li a:not(:hover) i.fa-instagram {
      color: #517fa4;
  }
  

  – Kyle

  November 23, 2015 at 3:15 pm #230640
  elizabethanneflynn

  Member

  Post count: 23

  Hi Guys, Double checking on this- can I just add this code to custom css field in theme options?

  November 23, 2015 at 3:20 pm #230648
  elizabethanneflynn

  Member

  Post count: 23

  I’m getting ccs errors when I try it.

  Attachments:

  You must be logged in to view attached files.
  November 23, 2015 at 3:21 pm #230652
  Kyle – SUPPORT

  Moderator

  Post count: 35880

  They’re not errors, just hints, ignore them

  – Kyle

  November 23, 2015 at 3:24 pm #230656
  pgf21

  Member

  Post count: 7

  Thanks a lot!

  Adam

  November 23, 2015 at 3:25 pm #230658
  pgf21

  Member

  Post count: 7

  Btw I’ve tried to change to resolved but it doesn’t seem to work.

  November 23, 2015 at 3:25 pm #230659
  elizabethanneflynn

  Member

  Post count: 23

  Kyle would you mind throwing up the css for color change just on hover?

  November 23, 2015 at 3:30 pm #230662
  Kyle – SUPPORT

  Moderator

  Post count: 35880

  @elizabethanneflynn what is it you’re trying to do?

  November 23, 2015 at 3:31 pm #230663
  elizabethanneflynn

  Member

  Post count: 23

  Hi Kyle I’m trying to change the social icon colors on hover.

  November 23, 2015 at 3:32 pm #230666
  elizabethanneflynn

  Member

  Post count: 23

  Sorry I’m a noob and I have to deliver this site today.

  November 23, 2015 at 3:33 pm #230667
  Kyle – SUPPORT

  Moderator

  Post count: 35880

  Here:

  ul.social-icons li a:hover i.fa-twitter {
      color: #1dadea;
  }
   
  ul.social-icons li a:hover .fa-facebook {
      color: #3B5998;
  }
   
  ul.social-icons li a:hover i.fa-pinterest {
      color: #C92228;
  }
   
  ul.social-icons li a:hover i.fa-instagram {
      color: #517fa4;
  }

  – Kyle

  November 23, 2015 at 3:34 pm #230668
  elizabethanneflynn

  Member

  Post count: 23

  Thank you that’s so awesome! I have a few other topics I’m having issues with, would it be better to create a private ticket?

  November 23, 2015 at 3:38 pm #230670
  Kyle – SUPPORT

  Moderator

  Post count: 35880

  No problem

  Yes please create a new topic

  – Kyle

  November 23, 2015 at 3:46 pm #230672
  elizabethanneflynn

  Member

  Post count: 23

  Hi Kyle this didn’t work for me I am getting an invalid security credential?

  Attachments:

  You must be logged in to view attached files.
• Back to forum

  Posted in: Atelier