Divi Plugin Highlight: Divi Icon King

Last Updated on September 20, 2022 by 22 Comments

Divi Plugin Highlight: Divi Icon King
Blog / Divi Resources / Divi Plugin Highlight: Divi Icon King

Divi comes with around 380 icons built in that can be used within blurbs, overlays, buttons, etc. As many as that is, there’s always the need for more. Some of the best resources for free icons are Font Awesome and Google’s Material Icons. Fortunately, these icons can be added to Divi easily with a third-party plugin called Divi Icon King.

In this article we’ll take a look at Divi Icon King (I’m reviewing version 1.1.0) and see just how easy it is to add these icons to Divi and see a new feature that it adds to all of the Divi Builder’s modules that use icons.

Installing, Activating, and Setting Up Divi Icon King

Upload and activate the plugin as normal. Once the plugin is activated you’ll need to go into the settings and choose your icon libraries.

In the dashboard menu, go to Settings, Divi Icon King. Here you can enable Font Awesome and Material Icons. Click the boxes of what you want to enable and select Save Changes. This raises the number of icon sets available within the Divi Builder to almost 2000 (around 1987, but I didn’t count them).

Font Awesome Icons – adds 675 scalable vector icons.

Material Icons – adds 931 lightweight Google web icon fonts.

The added icons are not stored on your server. Instead, they’re stored on a CDN and brought in as you load them. It only loads what you check. In other words, it isn’t loading everything and only showing you what you’ve checked. If it isn’t checked, it doesn’t load.

The plugin’s code is added to Divi and works with any module that uses icons. This means there are no special modules that you have to use. You’ll now see all of the new icons within every Divi module that uses icons.

Regular Divi Icons

Divi comes with around 380 icons. The image above is a Blurb module before installing Divi Icon King. Within the Content tab, select Use Icon to see the icons that are available.

Divi Icon King Filters

Divi Icon King adds a filter to the icon selections. Click the button labeled Filter Icons to see the filters.

This opens a search box where you can enter what you’re looking for. You can also click on the text under the search box and see icons from Elegant Themes, Outline, Solid, All, or select Close the close the filter. At this point I haven’t enabled Font Awesome or Material Icons.

After enabling Font Awesome and Material Icons, they’re now an option within the filter. I now have almost 2000 icons, and the only effort it took was installing the plugin and enabling the two brands of icons I wanted to add.

Clicking FontAwesome shows only the icons from Font Awesome.

Clicking Material shows only the Material Icons from Google.

These are the icons with outlines.

These are the solid icons.

Searching for Icons

The results of the search depend entirely on how the icons are labeled. This means some searches may not work as well as others. You might find something by typing in pizza but nothing is you type in food.

It also finds portions of words (as you can see in the image above). It will also include icons that contain the portion of the word that you searched for. For example, I typed in car and it included icons for cars as well as cart, card, etc.

Here I’ve searched for cart and it only gives me shopping carts.

You can also use the search to figure out which icon set provided the icon. When scrolling I saw the Star Wars Rebellion icon. I searched for rebel and it gave me the icon on the first try. I wanted to know which icon set provided it, so I clicked FontAwesome and scrolled until I found the rebel icon highlighted.

I found the filter useful even without using FontAwesome and Material Icons because it helps sort and find Elegant Themes’ icons, which speeds up development time. Don’t hit the enter key when you search. This will close the module.

Divi Icon King Examples

Here are a few examples. Most are blurbs, buttons, and overlay icons that I’ve replaced the originals with those from Font Awesome or Material Icons.

Since I found the Rebellion icon I couldn’t resist using it. Here’s an example using the free DiviStar layout pack by Geno Quiroz. I added blurbs and the rebel icon from Font Awesome – each one with a different color. I made them as large as possible. The controls are the same as normal Elegant Themes icons.

This one uses Elegant Themes’ free Code School layout pack. I’ve replaced the first two icons (the blurbs for Web Development and Javascript, which actually use images rather than icons), changed their colors and size, and added a circle to match the other icons. The first is from Material Icons. The second is from Font Awesome.

This one uses the free ET layout pack called Design Agency. It includes a button with an arrow that displays on hover. I’ve replaced the arrow with a pointing finger from Font Awesome.

This layout pack also uses hover overlay icons for the images. I replaced the icons with those from Material Icons.

Blurbs displayed small icons over a few lines of text. I removed the text and replaced the icons with icons from both Font Awesome and Material Icons. I kept the colors but made the icons full size at 120 pixels.

This one is from Elegant Themes’ free Restaurant layout pack. I’ve added an overlay with icon to the blog post images and placed a fork and spoon icon from Material Icons (as you can see in the center image).

Using Divi Icon King with Extra

Divi Icon King works great with Extra, and even works with the Category Builder. Here’s a look at the Design Agency layout pack with a YouTube icon within the button from Font Awesome.

This one uses a mailbox icon from Material Icons for the Send button.

Here’s a look at how it works with the Category Builder. This image shows the Post Module from the Category Builder with a coffee icon from Font Awesome as the icon in the image overlay.

I’m glad to see that it works with Extra and the Category Builder. Extra is usually left out by third-party developers, but I love Extra as a blogging and publishing platform, and my most popular website is built with Extra.

Using Divi Icon King with Third-Party Plugins

Divi Icon King works with third-party plugins that use icons. Here’s a look at Content Intense.

Content Intense displays the blog according to my selections (I selected Alps which allows for an overlay). I’ve added an icon from Material Icons in the blog overlay, which you can see in the center image.

Documentation and Support

Documentation is provided at the developer’s website. It includes a video demonstration, setup information, and a quick demo.

Support is provide at the developer’s website. The only problems I had were with my own test site (I needed to clear my cache for the icons to display properly in Extra’s Category Builder). I contacted support and the problem was solved within minutes.

  • The plugin is available for purchase in most of the Divi marketplaces.

Ending Thoughts

Divi Icon King is an easy way to add hundreds of free icons to Divi to be used in blurbs, overlays, buttons, or any other module that uses icons. It works with Extra and even works with third-party plugins as long as they follow ET’s coding standards. If you’re looking for an easy way to add free icons from Font Awesome and Material Icons to Divi, Divi Icon King is worth a look.

We want to hear from you. Have you tried Divi Icon King? Let us know what you think about it in the comments.

Featured Image via Irina Adamovich / shutterstock.com

Divi Marketplace

Are You A Divi User? Find Out How To Get More From Divi! 👇

Browse hundreds of modules and thousands of layouts.

Visit Marketplace
Divi Marketplace
Divi Cloud

Find Out How To Improve Your Divi Workflow 👇

Learn about the new way to manage your Divi assets.

Get Divi Cloud
Divi Cloud
Divi Hosting

Want To Speed Up Your Divi Website? Find Out How 👇

Get fast WordPress hosting optimized for Divi.

Speed Up Divi
Divi Hosting

Divi Supreme Pro

With 60+ Divi premium modules and extensions to choose from. Take ...

View Product

11192 Sales

Divi Plus

A versatile multipurpose plugin with lots of modules to design & ...

View Product

7694 Sales

Divi Contact Form Helper

Upgrade the default Divi Contact Form with tons of missing, premium, ...

View Product

3552 Sales

Divi Gallery Extended

Masonry gallery plugin for Divi with category filter, dynamic ...

View Product

3896 Sales

Divi Events Calendar

Easily display and style events from The Events Calendar with custom ...

View Product

8315 Sales

Table Maker

Divi-Modules – Table Maker brings beautiful responsive tables to the ...

View Product

7055 Sales

DiviMenus

A powerful menu builder that brings the coolest designs and popups ...

View Product

5928 Sales

Divi Carousel Module 2.0

Robust and extremely customizable carousel module for divi.

View Product

8390 Sales

Premade Layouts

Check Out These Related Posts

Get a Free Augmented Reality Layout Pack for Divi

Get a Free Augmented Reality Layout Pack for Divi

Posted on March 25, 2024 in Divi Resources

Hey Divi Nation! Thanks for joining us for the next installment of our weekly Divi Design Initiative; where each week, we give away a brand new Layout Pack for Divi. This time around, the design team has created a beautiful Augmented Reality Layout Pack that’ll help you get your next Augmented...

View Full Post
Download a Free Webinar Theme Builder Pack for Divi

Download a Free Webinar Theme Builder Pack for Divi

Posted on March 22, 2024 in Divi Resources

It’s time for another freebie! This time, we’re giving you a free Theme Builder Pack for Divi. Combining these with our beloved Divi Layout Packs is a great way to build the Divi website of your dreams with ease. This week, the design team has created a beautiful Webinar Theme Builder...

View Full Post
Get a Free Modeling Agency Layout Pack for Divi

Get a Free Modeling Agency Layout Pack for Divi

Updated on March 21, 2024 in Divi Resources

Hey Divi Nation! Thanks for joining us for the next installment of our weekly Divi Design Initiative; where each week, we give away a brand new Layout Pack for Divi. This time around, the design team has created a beautiful Modeling Agency Layout Pack that’ll help you get your next Modeling...

View Full Post

22 Comments

  1. i thought that if i purchase the elegant themes i could use the features for free. Like this awesome plugin.

  2. hi
    good idea
    thanks a lot

  3. May have to get this!

  4. It appears this plugin does not work when you are using the visual builder. I am the only one experiencing this? I just see blocks of the old icons repeated over and over again.

  5. I feel this should come default by theme rather then purchasing it as an addon. I have purchase multiple divi addons but I think ET should consider adding this icon set since it’s used by all.

  6. Filter/Search needs to be a default option for the Divi icons. I’m excited to give this a try!! I’ll be purchasing asap.

  7. This plugin will be awesome when the 2000 icons of Font Awesome 5 will be mentionned
    + available in the Visual Builder

  8. While I appreciate someone making a plugin for a feature ET should’ve built in from the start, I can’t see how one would use this particular plugin with paid/pro/licensed versions of icon sets (like FontAwesome 5) or a custom icon set — two use cases I’m facing at the moment. Here’s to hoping ET will come with a way to do this natively rather than having to rely on a plugin.

  9. Bring on the section dividers that we’re said to be in the works. Any timeframe as to when we might expect that Divi update?

    • I have no clue.

  10. Too bad it does not work with the Visual Builder… I was about to buy it

  11. Love this! Was wondering how to add more icons to the blurb module!! Thanks so much!

  12. This is hands-down the best plugin for Divi. Yes, it’s sad that third party plugins have to make up for the lack of Elegant Themes no-brainer features, but this works well!

  13. I have been getting to the point where the standard ET icons don’t always fit the bill (only some cases), so I’m definitely going to get Divi Icon King.

    Thanks for showcasing ??

  14. This is awesome. I checked out their website and apparently it curently does not work with Visual Builder. Any timeline on when we can expect that update to made available to us raving fans that use Divi exclusively?

  15. Randy, wow thanks so much for featuring my plugin, I’m humbled and grateful! It was a fun experience answering your questions as you wrote the article. Keep up the great work!

    • I got this plugin recently and am currently playing with it on a site. I love it, especially the search feature. Divi’s icons don’t usually have what I need, so having easy access to so many more icons is a huge bonus and timesaver. Thanks so much for this great plugin, Alex!

  16. Hi Randy,

    Do you know the license details for this plugin? I cannot find it on their site or on the marketplace where it is sold.

    • Hi James. You can use it on unlimited websites for you and your clients.

      • Thank you again! It is always best to know these things before making a purchase.

      • cool! is it a lifetime license or it needs to be renewed each year?

    • Hi James. I’ll ask. Sorry about that.

Leave A Reply

Comments are reviewed and must adhere to our comments policy.

Join To Download Today