Font Awesome Pro angle Double Down light in menu

Support
#1

Hi there,
On my site, https://dhbrownstaging.wpengine.com/stills/, which is in staging, I have recently updated the theme to 6.3.8 and that changed some of the icons, namely the ones in the menu. I have been waiting for the Font Awesome Pro integration which I saw happened in the Changelog but I can’t figure out how to get the icons in the menu to be the Angle Double Down Light - https://fontawesome.com/icons/angle-double-down?style=light - version of the icon. How could I achieve that?

Also, in the footer I am trying to get the envelope to be the Envelope Square Light version - https://fontawesome.com/icons/envelope-square?style=light. I am currently using a JS script to add the envelope in but it isn’t changing when I change the class.

jQuery('.x-social-global').append('<a href="mailto:dylan@dhbrownstaging.wpengine.com"><i class="x-icon x-icon-envelope-square" data-x-icon="" aria-hidden="true"></i></a>');

How can I change that footer icon as well?

Thanks for the help!

#2

Hi,

  1. To make the down arrow light, you can add the code below in Theme Options > CSS 
.x-navbar .desktop .x-nav li>a>span:after {
    font-family: "FontAwesomeLight" !important;
    font-weight: 300 !important;
}
  1. To change the envelope, you can add this code.
.x-colophon.bottom .x-social-global .x-icon x-icon-envelope-square {
      font-family: "FontAwesomeLight" !important;
    font-weight: 300 !important;
}

Then change your js code to this



jQuery('.x-social-global').append('<a href="mailto:dylan@dhbrownstaging.wpengine.com"><i class="x-icon x-icon-envelope-square" data-x-icon="&#xf199;" aria-hidden="true"></i></a>');

Hope that helps

#3

Hey Paul,
Thanks for the help on this.

The first solution you gave unfortunately didn’t work. Why might that be the case?

The second solution you gave did the trick! That works great.

Thanks for the help!

Marcus

#4

Hey There,

Thanks for your confirmation!
The CSS code should work fine. Can you please confirm if you have cleared the plugin cache or server cache after adding the code. Seems I can’t see the code in your site.

If that doesn’t help please send us your login details in a secure note so that we can have a look.

Thanks

#5

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.