Elegant Themes, creators of the Divi theme, have a nice resource for icon fonts: https://www.elegantthemes.com/blog/resources/elegant-icon-font
They also have a good resource for the customization options available with Icon fonts:
It just isn’t entirely obvious how you can use icon fonts anywhere you’d like on your page.
This page included some code that highlighted the solution:
https://elegantmarketplace.com/forums/topic/how-to-use-divi-icons-for-un-ordered-lists/
I created a code snippet on the page that controlled the CSS:
<style type=”text/css”> .emailicon:before { font-family: “ETmodules”; content: “\e010” !important; } .<br /> </style>
And then where I wanted the icon font, I used a span
<a href=”mailto:mark.lang@stonybrook.edu“><span class=”emailicon“> </span><br /> | |
</a> |
I used these tips to create an envelope for email address links on my staff directory page: