Soooo, have you folks heard about the new Full Site Front-End Editing For Divi? Everybody is talking about it and we can’t believe the sheer amount of features the team at Elegant Themes have released over the last month. Full Site Front-End Editing is another addition aimed at making us more efficient when building Divi sites.
Now here comes the but!
Not everybody is a big fan, and if you are an antiquated Divi user such as myself, you prefer things like the Classic Editor and that dusty odor extends to new things like the Full Site Front-End Editing For Divi. Elegant Themes has not added a setting to natively disable this feature, so we whipped up some CSS to remove it from the Front-End Editor, but before we look at that, let’s just quickly cover what this feature does.
Table of Contents
Difficulty
Easy
Time
5 Minutes
What is Full Site Front-End Editing For Divi?
With the introduction of the Divi Theme Builder, we were finally given a space to create global layouts for various parts of our site like headers and footers. It was an unprecedented step towards greater efficiency for developers, but something was always missing, one could not edit these Theme Builder layouts on the front-end of our sites. We were always relegated to going through the back-end of our site to the Theme Builder section and then editing these layouts without seeing them as they would appear on the page.
Say hello to Full Site Front-End Editing For Divi, which solves this issue by allowing you to edit these Theme Builder layouts on the front-end as you would any other page. This is great as you can now see how it fits into your overall design and saves you time bouncing around, or as in my case, having 20 tabs open at any given time.
For more information on the Full Site Front-End Editing For Divi, check out the official post over at Elegant Themes.
Disable Full Site Front-End Editing For Divi
So as I mentioned before, maybe you are averse to change right now and want to cozy up to the idea of the new Full Site Front-End Editing For Divi and that is ok. With just a few lines of code, you can send this efficiency tool into oblivion.
Just follow the steps below, beat your chest, and claim your freedoms!
Head over to Divi > Theme Options > Custom CSS
Paste the code below in the Custom CSS box
Save
Buh-bye Full Site Front-End Editing For Divi
Conclusion
Congrats, you did it. We understand that some of these new features are not always easy to get into at first, but we promise once you embrace them, that they will be a gamechanger for your efficiency….uh…game? You know what we mean.
Use this code as a breather but we encourage you to play with all the new Divi features as they come out and we will try to continue to release content that helps you on that journey.
We hope you found this post on how to Disable the New Full Site Front-End Editing For Divi helpful! We will be back soon with more valuable content.
Until next time 😁
Everything is doggedly slow now?? and I don’t mind the front end template editors, but they get accidentally clicked on all the time because everything is so laggy?
I try to keep my edits in css anyway, but now it’s even difficult just to try and apply classes?
Thank you so much – i’ve been looking for this for days.
Great snippet. Unfortunately, I got a rude awakening when I then tried to edit the header through the Theme Builder (ya know, the old fashioned way) – the page was blank. Turns out this code hides the header/footer in the Theme Builder too. I tweaked it a bit so it still hides when in VB on a page/post, but not in the Theme Builder.
.page-template-default .et-l.et-l–header, .page-template-default .et-l.et-l–footer {
display: none !important;
}
Scratch that snippet – it hid the header/footer on the live page too (doh). I’m sure there is a combo that works, but I’m on deadline and I’ll just adjust the CSS as needed to edit via the Theme Builder.
If someone else figures it out, please post here!
Thanks for the code. Two things though. Can we keep the header on the page? The header and the footer aren’t the issue to me. It is the buttons that you can click to edit the header, body and the footer templates.
The second is that this doesn’t disable the body button for editing the body template.
Hence, my question is, is there a way to just remove the buttons that appear for the header, body and footer and leave the UI as is?
Great! Thanks. My clients were a bit puzzled when the header suddenly appeared in their visual editor, so this is welcome. I prefer to keep the header intact: If the header breaks, the site breaks.