This plugin allows you to easily display grids of icons and/or their descriptions using shortcodes, widgets and Gutenberg blocks.

You can use the grids for many things, one example would be as a visually exciting way to present a list of features:

  • Responsive
  • Icon Fonts
  • Built For WordPress
  • All Browsers
  • Shortcode
  • Customiser Widget
  • Gutenberg Block
  • Free Download

Features

  • Responsive design;
  • Up to 15 icons per grid;
  • Unlimited grids per page;
  • Max columns per grid row can be set between 1 and 6;
  • Grid can be aligned left, right or center;
  • Icon color can be set per grid;
  • Can be displayed using shortcodes, widgets or Gutenberg blocks;
  • By default uses font-awesome/5.13.0 to provide the icons;
  • Can be linked to any other online font including font-awesome kits.

Requirements

Minimum tested requirements are WordPress 5.0 and PHP 5.6.

The plugin may work on earlier versions of PHP after 5.2 but hasn’t been tested. It may also work on earlier versions of WordPress with the Gutenberg plugin installed but again hasn’t been tested.

If anyone has success with running it on earlier versions, please drop a comment in the section below with the versions you used. Thanks!

Installation

You can find the plugin in the official WordPress Plugin Repository.

Automatic installation

Automatic installation is the easiest way to install this plugin.

To do this, simply login to your WordPress dashboard, navigate to the Plugins menu and click on Add New.

Type ‘Easy Icon Grid’ in the search field that is displayed at the top right. WordPress will automatically start to search.

Once you’ve found the plugin you can click on Install Now to install it.

Finally, once installed, the Install Now button will change to Activate. Click on it again to activate the Easy Icon Grid plugin.

Manual installation

You can also manually install the plugin by downloading it as a zip file from the WordPress Plugin Repository.

The WordPress codex contains full instructions on how to do this.

More On Github

You can access the latest development source code on Github.

How To Use

To use the Easy Icon Grid plugin just follow the instructions below:

Global Settings

The global settings for the Easy Icon Grid plugin can be accessed from the WordPress dashboad by navigating to Settings >> Easy Icon Grid in the menu.

In here you can set the icon font, class prefixes and how the plugin behaves on deactivation and/or deletion although in most cases the defaults shouldn’t need to be changed.

Creating Grids

You can display grids using shortcodes, widgets and Gutenberg blocks.

The shortcode below would create a grid as shown in the example section above. Exactly the same options are available when using the plugin as a widget or block.

[ easy_icon_grid title="" title_align="left" icon_color="red" icon_size="large" max_cols="4" icon1="th" text1="Responsive" icon2="font" text2="Icon Fonts" icon3="file-word" text3="Built For WordPress" icon4="globe" text4="All Browsers" icon5="code" text5="Shortcode" icon6="wrench" text6="Customiser Widget" icon7="square" text7="Gutenberg Block" icon8="download" text8="Free Download" ]

Available options are:

  • title:
    The grid title; leave blank for no title.
  • title_align:
    The alignment of the title. Can be center, left or right.
  • title_tag:
    default: use the default theme font size with no header tags;
    h1, h2, h3, h4: the header tag used to wrap the title.
  • icon_color:
    Any valid css color code eg: #FF0000, red, rgb(255, 0, 0).
  • icon_size:
    default: use the default theme font size;
    small, medium, large, xlarge: scaled relative to default font size.
  • max_cols:
    The maximum number of grid columns (1 – 6).
  • icon1 .. 15:
    The icon font class name, eg ‘wrench’. Leave blank for no icon.
    Important: the icon class name you enter here will be prefixed with the Icon Class Prefix you set in the global settings. The default (for font-awesone) is ‘fas fa-‘ which will result in ‘fas fa-wrench’.
  • text1 .. 15:
    The icon description text; leave blank for no description.

Available Icons

You can find a full list of icons on the Font Awesome website.

Contributors

Steve Perkins

Licence

This plugin is licensed under the GNU GPL 2.0 or higher licence.

Copyright (c) 2019 Steve Perkins, Websites Built For You


Need A Custom Plugin?

If you need a custom WordPress plugin, theme or just a new website then Let’s Talk!


Found This Useful?

Please help to spread the word and share with your friends and contacts. Thanks!

Easy Icon Grid Plugin For WordPress

2 thoughts on “Easy Icon Grid Plugin For WordPress

  • 16th December 2019 at 9:12 am
    Permalink

    This is pretty cool actually. Would it be possible to make each individual icon a different color?

    Reply
    • 16th December 2019 at 11:42 am
      Permalink

      Thanks. Not at the moment, it wouldn’t be hard but I’m not sure how many people would find it of use. Maybe if/in the pro version. I’ll put it on the list!

      Reply

Leave a Reply

Your email address will not be published. Required fields are marked *