Download wpCentral Plugin

Subscribe to get latest article or newsletter of our products

By entering your email, you agree to our Terms of Service and Privacy Policy

Note: If a wpCentral account does not exist it will be created

Download
Login
Best ways to add icon fonts to your WordPress theme

Icons offer a distinct look to your blog that instantly attracts the eye. As most of you already know, icons refer to the lightweight, small retina-friendly images that can easily and seamlessly be inserted into the content. If you wish to use icons in your WordPress WebPages or blog posts then you need to follow a specific process. There are different ways to install icons in your site but in this guide, we will concentrate on the easiest way to insert your desired icons without any coding or complexity. So let’s start.

Better Font Awesome Plug-in

First of all, you would need a plugin that enables you to insert icons on your site. Among many options, one plugin stands out due to its popularity, capability, and ease of use- Better Font Awesome Plug-in. So, here is the step by step instructions on how to install and use it:

·         Go to Plugins -> New and type Better Font awesome in the search box. Hit enter.

·         Click install and then activate it

Upon successful installation, you would see the link Better Font Awesome under your dashboard’s settings menu

Settings

·         Select Better Font Awesome from you settings menu

·         You will be taken to the plug-in settings page and here are the actions you can perform on that page

-- Version: For selecting the desired version of the plug-in 

-- Use minified CSS: for using the minified version of the CSS

-- Remove existing Font Awesome: For the removal of Font Awesome CSS/shortcodes that other plugins/theme might have added to your site

-- Hide admin notices: For hiding default admin warnings for API and CDN errors

The usage section displays a quick brief info on how to use the plug-in

Inserting Icons in your posts or pages

Once you have successfully downloaded, activated and configured the plug-in, you need to add the icons.

Two easy, zero code methods to insert icons in your posts and pages are via a shortcode, and through TinyMCE.

Shortcodes

·         Visit Font Awesome website and search the icon that you wish to use with the help of keyword

·         It will open a page containing the icons as well as the code

·         Copy the block of code and go back to your WP dashboard.

·         Paste it in the Text editor

·         Open preview to see the icon. If it seems fine then publish it

TinyMCE

·         Click Insert Icon in the visual editor and it will open the entire visual set of different icons In the search box

·         Type the icon that you want to use

·         Just click on the desired variant of the icon to get it added to your post/page

·         That’s all. Keep in mind that here the relevant info is automatically added by shortcode generator that relieves your from extra efforts

Conclusion

The wise use of icons in your content can offer an attractive look to your pages and posts. There are different ways to insert icons but the beginners are advised to use the plugins and easier non-coding methods to save themselves from complexity and eliminate the chances of mistake.

Newsletter Subscription
Subscribing you to the mailing list