Contents:
And of the many font icon collections out there, Font Awesome is one of the absolute best. That means you can do cool things like:. Basically, all you need to do is add the Font Awesome stylesheet to your WordPress theme.
While you can get this directly from the Font Awesome website, my preferred method is to use the version hosted on Bootstrap CDN. But it will change as Font Awesome releases new versions. Because following WordPress code best practices is a good thing, I definitely recommend you use both a child theme and the enqueue function.
All you need to do is place that code in the Text tab of the WordPress Editor to add an icon to your site. Feel free to skip ahead if you went with the manual method over the plugin method.
To add Font Awesome, all you need to do is install and activate the plugin. To use those modifiers, you just add it after the name of the icon but inside the quotes for the code, and inside the class quotations for the shortcode.
Here are the modifiers for rotation. You can use any of these exactly the same as the size modifiers above:. You can also add some basic animations to your icons. Font Awesome gives you two different modifiers to add rotations:.
These animations are best paired with circular icons. If you use other oddly shaped icons, the effect might look a bit weird. Unfortunately, there are no built-in modifiers for this. Font Awesome icons might take you a couple of minutes to set up. From then on, all you need to do to insert and style individual Font Awesome icons is follow the steps above.
Colin Newcomer is a freelance writer for hire with a background in SEO and affiliate marketing. IN used 1. IN are based on first landing page and within top 1M websites only. Click the font icon to see all websites using it. IN includes "http: IN Inline Icons fa-fire. Icon classes are echoed via CSS: If your icons are getting chopped off on top and bottom, make sure you have sufficient line-height.
Font Awesome icon can be used to easily replace lists. In addition, you can choose what those screen sizes are! Resize the page to see the elements appear or disappear based on what we set. Complete Set of Options. Every option and description included with the font awesome shortcode is listed below.
This is the sliding section that can be enabled or disabled on any demo. You can insert anywhere from columns along with any widget that comes with Avada, WordPress or additional 3rd party plugins.
Font Awesome Icons. Already on GitHub? Thanks, Boss!! Use it carefully Notify me of follow-up comments by email. Options are good too. Especially useful in things like nav lists.
It's perfect for placing additional information on your site. Fusion Builder Elements. Building Professional Sites With Ease.
New in Font Awesome 5 the re-designed solid style icon tags. Font Awesome, the iconic font and CSS framework.
Buy Avada Now! Font Awesome Icons admin T Size Control With Avada you can choose any icon size in pixels, no matter how small or large.
Mobile Visibility Settings Our mobile visibility system gives you full control over what displays based on 3 customizable screen sizes. Only Show on Desktop. Only Show on Tablet. Only Show on Mobile.