I’m excited to introduce the Icon Manager for Divi 5, a central position to import your personal icons, order them into collections, and make a choice which collections seem whilst you construct. 🎉
Usher in customized SVGs or an icon font, create a set in your consumer’s emblem, and use the ones icons immediately from Divi’s new icon picker. You’ll additionally prepare the incorporated icons into collections that suit your web site.
Let’s check out the way it works. 👇
Import Customized SVGs And Icon Fonts
The Icon Supervisor brings your personal art work into the similar variety workflow as Divi’s incorporated icons.
Click on Import Icons to open the Upload Icons window, then use Make a choice Icon Information to choose your information. Make a choice an current Assortment or input a Assortment Identify to create a brand new one, then click on Import.
Upload A Set Of SVG Icons
Drag as many SVG information as you wish to have into the icon uploader to add them into a brand new or current assortment.
Consider development a web site for a landscaping corporate with customized symbols for planting, irrigation, and lawn repairs. Import the ones SVGs right into a “Products and services” assortment and make a selection them as you construct the corporate’s carrier sections.
Convey In An Icon Font
You’ll additionally import WOFF2, WOFF, TTF, or OTF icon fonts. Divi reads its personality mappings and provides the to be had icons in your assortment.
An not obligatory Identify Mapping Record means that you can provide readable names and seek phrases via a JSON record. That makes a big customized font more uncomplicated to go looking when its integrated glyph names are much less descriptive.
You’ll add a couple of SVGs and icon fonts directly!
Prepare Collections Round Your Web site
Icons are arranged into collections.
Click on New Assortment, input a reputation, then click on Create to construct a set. Collections permit you to prepare icons into teams, making them more uncomplicated to seek out within the icon picker.
A set can include each SVG icons and font icons. It’s worthwhile to staff arrows, touch symbols, and customized carrier illustrations beneath “Emblem Necessities,” even if they arrive from other resources.
Choose an icon to expose its to be had movements. Use Shift, Ctrl, or Command whilst settling on to paintings with a couple of icons, then make a choice Transfer to put them in every other assortment. Those movements also are to be had from an icon’s right-click menu.
Use Rename to replace a set’s identify, Take away to take decided on icons out of it, or Delete to take away a customized assortment.
Stay Icon Pickers Targeted
Every assortment has a toggle that controls whether or not its icons seem in pickers around the web site.
On a consumer web page, you’ll want to permit a curated selection of licensed icons and switch off collections the buyer does now not want. That provides everybody a extra targeted variety when including new content material. Turning off a set preserves icons already used on pages. Disposing of icons from a set or deleting a customized assortment additionally preserves the ones current makes use of and the underlying Media Library information.
Take Icon Collections Between Internet sites
The Icon Supervisor comprises an Import & Export Icon Collections regulate in its header.
Open it, make a selection the collections you wish to have to export, and use Export Icon Collections. The export comprises their assignments and referenced customized icon information, together with font identify mappings when provide.
On every other web site, open the similar regulate and use Import Icon Collections to deliver them into that web page’s library.
Should you construct web sites for a couple of places of the similar trade, you’ll want to get ready a unmarried branded assortment and switch it to every web page with no need to add each and every SVG or font once more.
Your Icons, Within Divi’s Icon Picker
The up to date icon box shows a compact preview of your decided on icon. Click on it to open a dropdown with an icon grid, seek, and assortment filters.
Make a choice All Collections to browse the entirety enabled, or slender the choice to a selected assortment. The filter out teams Theme Icons, Customized Icons, and Kinds, making it more uncomplicated to seek out the precise set whilst modifying.
When you want to prepare your library or upload one thing new, click on Icon Supervisor on the backside of the picker.
Set up Icons With The Divi AI Agent
The Divi AI Agent beneficial properties equipment to seek for icons and arrange collections.
Ask it to create or rename a set, flip a set on or off, Import supported connected information or current Media Library information, or transfer or take away icons. It may additionally delete customized collections.
As an example, connect a suite of carrier SVGs and ask, “Import those icons into a brand new assortment referred to as Products and services.” Or ask the agent to seek out icons in an current assortment earlier than opting for which of them to make use of.
Imports request affirmation, as do strikes, removals, and assortment deletions.
Have You Attempted Divi’s Multi-Choose & Bulk Modifying?
Closing week we launched multi-select and bulk editing for Divi 5!
Modifying a web site incessantly manner making the similar alternate greater than as soon as. Modify the spacing on a number of playing cards. Restyle a handful of buttons. Transfer a selection of modules into every other column.
Multi-Select and Bulk Editing deliver the ones duties in combination in Divi 5. 🎉 Choose person parts with Cmd/Ctrl-click, make a selection a spread with Shift-click, and edit your variety from one settings panel.
Variety additionally extends into the Layers panel, right-click movements, keyboard shortcuts, the Inspector, and the Divi AI Agent. You’ll make a choice the weather you wish to have to paintings on, then lift that variety via your workflow.
Let’s take a better glance. 👇
Extra Divi 5 Updates Are On The Approach
The options stay coming, and we aren’t slowing down anytime quickly!
If you’re playing those updates, do us an enormous desire through liking this video and leaving a comment. It manner so much to us to peer you cheering Divi on, and it’s crucial to feed the set of rules and unfold the phrase.
Don’t fail to remember to follow us on YouTube and subscribe to the Divi newsletter so that you by no means leave out an replace. I’ll see you quickly for every other Divi 5 characteristic announcement, which I promise might be correct across the nook.
The put up Introducing The Icon Manager For Divi 5 gave the impression first on Elegant Themes Blog.
0 Comments