The absolute best navigation bar sits at the center of the entire thing you do in Divi. So even small changes to how it’s organized can shift all the enhancing revel in. As Divi 5 presented in more apparatus and shortcuts, the absolute best bar started dressed in a great deal of at once. Finding something as simple as the preview button took further attention than it is going to need to have.
This replace reorganizes the absolute best bar to fix that. We’ll walk you through what changed, where the entire thing lives now, and how it fits into your enhancing workflow.
Why The Divi 5 Highest Bar Was Up to the moment
Proper right here’s the previous very best bar alongside the up to the moment one.

Throughout the out of date layout, each movement sat at the an identical level. Save, preview, undo, view switching, internet web page settings, all visible at once with quite any separation between them. Now not anything else guided your eye to what mattered most, so finding a decided on instrument intended learning through the entire thing. Controls you succeed in for fifty events a day sat right kind next to possible choices you must open once a session.
The up to the moment bar keeps all of the ones apparatus. They’re merely organized otherwise now. Similar actions are grouped into menus, often used controls take a seat down closer to the outside, and the bar has room to breathe. The idea is simple: make regularly actions in point of fact really feel speedy and keep the entire thing else one click on on away.
With that right through ideas, let’s walk through each area of the new very best bar so that you’ll see where problems landed.
A Walkthrough Of The Up to the moment Divi 5 Highest Bar
Starting on the left and transferring right kind, proper right here’s what each area accommodates.
1. Internet web page Menu (Internet page-Level Controls)
The Internet web page Menu groups the entire thing related to managing the internet web page itself, now not its portions. You’ll to find it behind the apparatus icon on the a ways left of the absolute best bar.

Once open, the menu is split into a few clear sections:
- Enhancing Context & Contemporary Pages: On the most productive, you’ll see the name of the internet web page you’re lately enhancing, which is recommended whilst you’re jumping between a couple of pages in one session. Underneath that, Open Contemporary lets you switch to other simply in recent years edited pages without leaving the builder.
- Internet web page Actions: That’s the position you’ll to find Save, Add To Library, Internet web page Settings, Edit Internet web page, and View Internet web page. From proper right here, you’ll save your artwork, regulate page-level settings like determine, excerpt, and featured image, open the WordPress editor, or view the live internet web page.
- Import & Export: The ones imply you’ll be able to switch layouts in and out of Divi. Export a layout to reuse later, or import one into the prevailing internet web page. At hand for sharing templates or transferring designs between internet sites.
- Undo, Redo & History: Step backward or forward through fresh changes, or open the whole History panel to jump once more to a decided on point on your session.
- Clear Layout: Eliminates all content material subject matter from the prevailing internet web page. On account of that’s a big reset, it’s situated at the bottom of the menu to cut back accidental clicks.
2. Canvases
From the absolute best bar, you’ll switch between your Primary Canvas and any more canvases (like off-canvas layouts) without leaving the builder. The Canvas Grid View will give you a visual assessment of all available canvases so that you’ll open and organize them from one place.
3. Responsive View & Breakpoint Controls

- Sitewide Responsive Breakpoints: The three-dot menu opens a modal where you’ll permit or disable breakpoints and set their exact pixel widths (Phone, Phone Huge, Tablet, Tablet Huge, Widescreen, Extraordinarily-Huge). The ones practice all over all your internet web page, protecting responsive behavior consistent on each internet web page.
- Responsive View Switcher: Click on on a device icon to preview and edit your layout at that breakpoint. Since the ones views are tied on your sitewide settings, what you see proper right here shows the fitting widths you’ve defined.
- Canvas Width Keep watch over: Shows the prevailing canvas width in pixels and lets you regulate it manually. Useful when you want to test how your layout behaves at a decided on width previous the preset instrument sizes.
- Zoom Keep watch over: Adjusts the canvas size throughout the builder without affecting the true layout or front-end output. It’s purely in your comfort while enhancing.
4. Cross out Possible choices

The Cross out menu lets you pass away the builder without a wish to guess where you’ll after all finally end up. You’ll return to the previous visual display unit, view the internet web page on the front end, open the WordPress editor, or head in an instant to the dashboard.
5. Preview Possible choices

The Preview menu will give you two techniques to check your artwork. You’ll open a front-end preview in a brand spanking new tab, or Enter Preview Mode to see the internet web page right kind all over the builder. Preview Mode is the faster selection as it lets you overview layout, spacing, and interactions without leaving your workspace.
6. Save Possible choices

From the Save menu, you’ll choose which publish status to save some as: draft, pending overview, private, or post. Each selection corresponds to any other point on your workflow, from early drafts to final publishing.
That’s the whole tour. The absolute best bar seems different, alternatively now not anything else is missing. If the rest, it is going to need to in point of fact really feel like problems are exactly the position you’d expect them to be.
Select the Earlier Icon Layout? You Can Restore It
Will have to you need the previous icon-based very best bar, you’ll switch once more at any time. This is worth working out will have to you’re already comfortable with the older layout, apply tutorials built spherical it, or want to keep the interface consistent all over a gaggle. All you want to do is permit the Internet web page Bar Icons throughout the builder’s settings panel.
![]()
The simplified bar is the default, alternatively the option to restore the icon layout is always there.
A Simpler Highest Bar Without Losing Keep watch over
The up to date best bar doesn’t industry what you’ll do in Divi 5. It changes how briefly you’ll to find it. Every instrument remains to be there, merely arranged so that regularly enhancing feels a lot much less cluttered and additional targeted.
Test it out in Divi 5 lately, in conjunction with all other new choices that we’ve been impulsively freeing!
The publish Exploring Divi 5’s New Best Bar UI gave the impression first on Sublime Topics Weblog.
Contents
- 1 Why The Divi 5 Highest Bar Was Up to the moment
- 2 A Walkthrough Of The Up to the moment Divi 5 Highest Bar
- 3 Select the Earlier Icon Layout? You Can Restore It
- 4 A Simpler Highest Bar Without Losing Keep watch over
- 5 The right way to Use the Grep Command in Linux
- 6 Easy methods to Promote Tournament Tickets The usage of WordPress (4 Simple Strategies)
- 7 How one can Take away Dad or mum Slug From Kid Web page URL in WordPress


0 Comments