Divi Plugin Highlight: WP and Divi Icons Pro

by | Nov 20, 2022 | Etcetera | 0 comments

WP and Divi Icons Pro is a third-party plugin that provides over 3900 icons with 11 other types to the Divi Builder. Icons come with Font Superior, Subject material Design, and customized icons. You’ll additionally add your individual and use them with all of the others. On this publish, we’ll take an in depth have a look at WP and Divi Icons Professional to lend a hand making a decision if it’s the correct Divi plugin to your icon wishes.

Let’s get to it!

About WP and Divi Icons Professional

WP and Divi Icons Professional come with over 3400 single-color icons and 500 multicolor icons. It really works with the vintage editor, Gutenberg, and it integrates into Divi modules so it’s all the time to be had without reference to the editor you’re the use of. The multicolor icons come with an editor so you’ll specify the colours. This makes them paintings smartly together with your branding.

For Divi, it’s to be had inside any Divi Module that comes with icons or a content material editor such because the Icon Module, Blurb Module, Accordion Module, Button Module, Toggle Module, Textual content Module, Name to Motion Module, and so forth. We’ll see each choices on this publish.

WP and Divi Icons Professional Divi Module Settings

The entire Divi modules that show icons have a brand new possibility to select the icon kind, extra icons to make a choice from, and extra choices within the clear out. It additionally features a hyperlink to the WP and Divi Icons Professional plugin settings web page (extra in this later). An instance of a Divi module that incorporates an icon is the Blurb Module. Once you put in and turn on the WP and Divi Icons Professional plugin, a whole new vary of icons will seem within the icons space.

See also  100 macOS Ventura Keyboard Shortcuts

WP and Divi Icons Pro Tutorial

Icon Kind

The Icon Kind permits you to make a selection between Unmarried Colour Icons and Multicolor Icons. With Unmarried Colour Icon decided on, you’ll see the usual icon picker with seek and a clear out (as noticed within the symbol above). With Multicolor Icon decided on, you’ll see a brand new variety window known as Icon Taste. This has 9 choices to make a choice from. Those choices divide the icons by way of design taste.

WP and Divi Icons Pro Tutorial

Deciding on a design taste displays best that form of icon within the icon variety window. This window nonetheless contains the quest and clear out choices. The clear out has already been carried out, so it best displays the choices that pertain to that design taste.

WP and Divi Icons Pro Tutorial

Colours are adjusted within the Design tab. Settings come with the principle, secondary, and tertiary icon colours. The icon I’ve decided on displays two colours.

WP and Divi Icons Pro Tutorial

If the icon has 3 colours, you’ll modify all 3. This situation makes use of 3 colours. Some icons, like the only on this instance, upload a fourth colour that’s a colour of the 1/3 colour.

WP and Divi Icons Pro Tutorial

Icon Filter out

The icon selector contains seek and clear out choices. The clear out contains Define, Hand Drawn, Cartoon, Crammed, Multicolor, and extra. The clear out possibility lets you temporarily to find the icon you wish to have within the taste you favor.

WP and Divi Icons Pro Tutorial

To go looking, simply input the key phrase of the kind of icon you’re searching for. For instance, input “software” to seek out all of the software icons. You’ll clear out those even additional if you wish to have.

WP and Divi Icons Pro Tutorial

Taste the WP and Divi Icons Professional Icons

The icons combine with Divi and paintings the similar as all Divi icons. Styling the WP and Divi Icons Professional icons is equal to styling any icon with Divi modules. Within the instance beneath, we’ve added a white background colour and a 1 pixel border.

WP and Divi Icons Pro Tutorial

WP and Divi Icons Professional Content material Editor

All Divi modules with a content material editor, comparable to the only discovered within the Textual content Module, Name to Motion Module, Accordion Module, Blurb Module, and so forth., come with an possibility within the toolbar so as to add an icon for your content material.

See also  Most sensible Guidelines For Divi AI Symbol Prompting

WP and Divi Icons Pro Tutorial

This opens an icon insertion window that permits you to upload an icon in-line with the content material the place you’ve positioned your cursor. Deciding on this opens the icon selector modal the place you’ll make a selection unmarried or multicolor icons, select the icon kind, seek, select a colour, alternate the icon dimension, see the icon identify, and upload a CSS magnificence. After all, it additionally features a window with the icons you’ll make a selection. You’ll upload as many icons as you wish to have for your content material.

WP and Divi Icons Pro Tutorial

Multicolor icons upload extra colour choices to the editor. It’ll upload both two or 3 colour pickers relying at the icon you select.

WP and Divi Icons Pro Tutorial

You’ll double-click the icon within the content material to open the window once more to select a distinct icon or make changes.

WP and Divi Icons Pro Tutorial

WP and Divi Icons Professional Plugin Settings

WP and Divi Icons Professional features a settings display with a number of tabs the place you’ll make changes, add icons, select the icons you wish to have to make use of, and spot directions on the use of the plugin.

Efficiency Tab

The Efficiency tab permits you to disable the icons you don’t need to use. Uncheck them and so they received’t seem within the icon selectors. This is helping beef up Divi’s efficiency since you’re no longer loading unused icons. On this instance, I’ve unchecked the Font Superior and Subject material Design icons.

Multicolor Icons Tab

Multicolor Icons can help you specify colour schemes to your icons. The colours you specify right here seem on the finish of the icon lists. To start with, the multicolor icons didn’t seem within the Divi icon selector till I outlined a colour scheme within the WP and Divi Icons Professional plugin settings. Thankfully, that is simple to do.

WP and Divi Icons Pro Plugin Settings

Cross to Divi > WP and Divi Icons within the dashboard menu. Make a selection the Multicolor Icons tab. Click on Upload Colour Scheme and make a selection the colours to specify your individual or click on Save to make use of the default colours. You’ll modify 3 other colours. You’ll upload a couple of colour schemes and you’ll additionally take away any colour scheme you don’t need to stay.

WP and Divi Icons Pro Plugin Settings

Customized Icons Tab

The Customized Icons tab lets you add customized SVG icon units. When they’re added, they’re to be had throughout the Divi modules identical to the others. To add them, click on Add New Icon Set, make a selection Make a choice Document within the modal that opens, and make a selection your icons. The zip report for the customized icon font will have to be generated with Fontello or Icomoon.

See also  How To Make Money From Web Design In 2025

WP and Divi Icons Pro Plugin Settings

It does take a few steps, however it’s easy and simple. Cross to Fontello or Icomoon and add your fonts to their platforms. Then, obtain the icons as a zipped report of their structure. Upon getting your zipped report, add it within the Customized Icons tab. Your icons combine with all of the different icons.

WP and Divi Icons Pro Plugin Settings

The place to Acquire WP and Divi Icons Professional

WP and Divi Icons Professional is to be had within the Divi Marketplace for $79. It contains limitless website online utilization, 1 12 months of give a boost to and updates, and a 30-day money-back ensure.

Where to Purchase WP and Divi Icons Pro

Finishing Ideas

That’s our have a look at WP and Divi Icons Professional. It integrates smartly into the Divi Builder and gives a number of tactics so as to add icons for your layouts and content material. The options and settings are intuitive. I just like the technique to disable any icons I’m no longer the use of to avoid wasting internet assets. I additionally like the facility to add my icons. They do must be in a definite structure, however thankfully, it isn’t tricky to create them in that structure. In the event you’re fascinated about including a whole lot of new icons for your website online, WP and Divi Icons Professional is price a glance.

We need to pay attention from you. Have you ever attempted WP and Divi Icons Professional? Tell us what you take into accounts it within the feedback.

The publish Divi Plugin Highlight: WP and Divi Icons Pro gave the impression first on Elegant Themes Blog.

WordPress Maintenance Plans | WordPress Hosting

read more

0 Comments

Submit a Comment

DON'T LET YOUR WEBSITE GET DESTROYED BY HACKERS!

Get your FREE copy of our Cyber Security for WordPress® whitepaper.

You'll also get exclusive access to discounts that are only found at the bottom of our WP CyberSec whitepaper.

You have Successfully Subscribed!