Email icon in social header & footer?

[Olson]

Hello,
Could you please tell me how to put an email icon in social header & footer? I have put one in the header using an image and an html tag, but can’t figure out how to do the same with footer. Instead I added a widget for the footer - but email icon shows up as a link versus an envelope and want an envelope and also prefer the icon be in the footer rather than the widget area. See site: longevitycolorado.com

Thank you!

Best
Katrin

[christopher]

Hi Katrin,

Please go to X > Theme Options > JS and add the Javascript code below there:

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

Please replace YOUREMAIL with your actual email in the code.

Thank you.

[Olson]

It worked!!! Thanks so much.

[nabeel]

Hi again,

Glad it worked, In addition to that If you would like to learn jQuery , I am sharing few resources that you take a look to get started with jQyery and an interesting tool that you can use to speed up the development process.

I recommend you to watch following video that will help you to get started with jQuery.

https://www.youtube.com/watch?v=hMxGhHNOkCU

Sometimes it can get a bit difficult to find out the right selector to be able to write the required snippets. A handy tool that can help you in this is Google Chrome dev tools. I am sharing the resource that you can refer to get started with dev tools.

https://developers.google.com/web/tools/chrome-devtools/css/

https://developers.google.com/web/tools/chrome-devtools/

https://www.youtube.com/watch?v=tP_kXBJWPhQ&t=200s

Cheers!