Advertise Here

Everything you need to know about the Divi 5 inspector

by | Oct 21, 2025 | divi, Divi resources, elegant themes, Etcetera, wordpress | 0 comments


One of Divi 5’s latest features, the Inspector, lets you control and edit component attributes, such as colors, fonts, and presets, in one intuitive panel. Regardless of your talent level, this selection is a must to conveniently develop amazing and consistent internet sites.

Let’s dive in.

What is Inspector Divi 5?

Divi 5 Inspector is an impressive Figma-inspired device integrated into Visible Builder, designed to make using Divi easier and more productive. It allows Divi users to control and organize component attributes (colors, text content, media, presets and more) with one centralized pane.

For this reason, the inspector simplifies the design procedure, taking into account collective changes and offering a transparent and organized evaluation of the design components of your enterprise. Its user-friendly interface mirrors the intuitive workflow of modern Internet design equipment, making it available and environmentally friendly for new Divi customers and seasoned executives.

Key inspector options

Divi 5 Inspector is packed with options that simplify and strengthen the Internet design procedure, making it a useful device for Divi customers. Below are some of its amazing features:

Combine and simplify the main points of the design

The inspector consolidates crucial attributes of the inspected components and their children into a single, organized panel. The result is a clutter-free display that makes it easy to recognize and organize design components at a glance.

Bulk improvement

Save time with Inspector’s powerful bulk editing functionality. You will be able to adjust more than one circumstance of a feature in all components or even within presets in one step. For example, you will toggle every single color example on the web page with just a few clicks.

Intuitive navigation

Navigate your project seamlessly with an outline of every single symbol, feature, textual content, and different design environment by scrolling through choices that make it easy to edit photographs, textual content, colors, and more, from one place.

Inspector of the fifth division

Docking for seamless workflow

The Inspector can also be docked under the settings panel (or anywhere else within the Builder), keeping it easily available without interrupting your workflow. This project allows you to make changes and evaluate attributes in real time, while remaining fully immersed in the design process.

How to gain access and use the inspector

Using Divi 5’s Inspector feature is unobtrusive and intuitive. Open a web page in wordpress and find the file Inspector icon.

Inspector of the fifth division

Click to open the Inspector. What the inspector discovers depends on what is chosen on the web page. When the Web page settings are open, the inspector presents all the components of the web page, along with the types and contents.

Inspector of the fifth division

While clicking on a module inside the Visible Builder, the Inspector shows the related types and contents for that module in the simplest way.

Inspector of the fifth division

Now that you know where to look for the inspector, let’s leave out one of the common tasks you will do with it.

1. Replace colors

The inspector makes it easy to adjust colors on a web page. Make a selection Web page settings to view all the colors on the web page or click on a particular one module to change its colors.

Inspector of the fifth division

Inside the Inspector, click to enlarge it Colors form. There you will see a list of colors assigned to the web page. In this case, the Inspector discovers colors for titles, buttons and backgrounds.

Inspector of the fifth division

To change a color, right-click in a Color box. THE Color selector will appear modal, allowing you to change the price.

Inspector of the fifth division

Use the selector to enter a hexadecimal value in the sector, make a selection in a world color, or create a new one. As you scroll through the web page, you will see each individual color example alternate regularly.

2. Commercial characters and their weights

Adjusting typography is simple with the Inspector. Make a selection a module or the Web page settingsso go to Characters within Inspector mode.

Inspector of the fifth division

Select a brand new font from the drop-down menu or adjust the font weight for selected textual content components. For example, you will transfer all the titles to a brand new font, corresponding to Roboto, or you will change the loading of the textual content of a button to medium OR semi-bold for added emphasis, with adjustments mirrored in real time.

3. Change photographs

Exchanging photographs with the inspector is child’s play. Click on a Symbol module within the Visible Builder (or file Web page settings), and the Inspector will display its attributes, along with a preview of the image.

From there, hover over the image within the Inspector to show the icons. Right here, you will delete or swap the image with a single click on.

Inspector of the fifth division

Increase the Attributes tab to change the image Name Feature Price. Having a transparent and descriptive name enhances the person’s enjoyment by offering guests useful data. It could also lend a hand to snakes and visualize readers in understanding the goal of the image, thus increasing marketing and search engine accessibility.

Inspector of the fifth division

4. Regulate quantity values

The Inspector makes it easy to change quantity values, corresponding to padding, margin, font size, or top of line, in one place.

Inspector of the fifth division

For example, click to focus on a line inside the visible constructor. When the Inspector panel is open, you will see all the numeric values ​​along the line, allowing you to easily change them.

5. Commercial Presets

Another smart way to use the inspector is to simply switch Presets. When you choose a component that has a Preset run on it, whether a Module Preset or an Option Group Preset, you’ll simply change them without needing to dig through the settings.

Inspector of the fifth division

For example, when a component with a preset assigned is chosen, you will use the drop-down menu within the Inspector to change the preset to a button.

Advantages of the Divi 5 inspector

Divi 5 Inspector offers benefits that make online website design faster, easier and more collaborative. Here’s why:

Save time

The Inspector eliminates the need to jump between multiple tabs or settings panels. Regardless of whether you are working on a large undertaking or making repetitive changes, the Inspector allows you to do this in a multifunctional position, significantly speeding up the process.

It’s simple to use

With attributes corresponding to colors, fonts, and presets intelligently arranged by type, the Inspector is simple to navigate. It provides real-time updates as you make changes and works seamlessly with the Divi 5 framework, ensuring a clean and intuitive design.

Simple transfer

The inspector’s transparent and organized view of design types and presets allows buyers to easily make changes once the task is complete. As a freelancer or small Internet business, you will manage an online website realizing that buyers can make small changes in a single, intuitive panel, ensuring you can manage the polished look of the website without having complicated skills.

Check out The Divi 5 Inspector lately

Divi 5’s Inspector feature helps you save time and streamline workflows, making it a crucial resource for every Divi person. With its intuitive panel, you will build beautiful and consistent internet sites faster than ever. Get Divi 5 these days to experiment with the Inspector and share your ideas with us in feedback or on our social channels.

Are you able to improve your design recreation?

The post Everything You Need to Know About the Divi 5 Inspector appeared first on the Elegant Themes Blog.

wordpress Maintenance Plans | wordpress hosting

Read more



Source link

thatguy
Author: thatguy

Places

Services

  • No Categories

Classifieds

  • No Categories

Events

News

Shopping