Are you looking for the best way to remove sidebar in Divi WordPress theme? Or do you want to create a full-width page or post with no sidebar using the Divi theme?
If you’re using Divi Theme and want to create a cleaner, distraction-free layout, removing the sidebar is one of the easiest ways to improve your page design.
A full-width layout gives your content more space, improves readability, and often works better for landing pages, sales pages, portfolios, and modern blog posts.
I have worked extensively with the Divi theme across blogs, business websites, affiliate sites, and WooCommerce stores. In this guide, you’ll learn multiple ways to remove the sidebar in Divi theme pages, including:
- Divi layout settings
- Divi Theme Builder method
- Custom CSS solutions
- Troubleshooting fixes when the sidebar still appears
I have noticed that site owners are more focused these days, aiming to impress visitors with interactive content and improve the user experience.
As I’m a Divi theme user through the highest Divi Discount offer, I have received a few requests to make a video tutorial to remove the sidebar and set up a homepage without a sidebar by creating it from scratch.
Before getting into the details, let me tell you the benefits of removing the Sidebar from a website, and hence, it would support your decision to disconnect the Divi sidebar.
Disclosure: We get a commission when you buy a product via our affiliate link at no additional cost.
Table Of Contents
The following are the valid reasons to design a full-width website!
1. Let Your Visitors Focus On Content
Getting rid of the Sidebar would allow your site visitors to more deeply engage with the content you have written for them. They never get distracted or frustrated by banners, advertisements, lists of other blog posts, or any other elements in the Sidebar.
They will have an excellent opportunity to dive into the content deeply and respond to your call to action. When you have multiple CTAs in the Sidebar, they may get confused and leave your site without taking any action.
2. Make Your Web Pages Load Lightning Fast
It is well known that we should load our web pages faster to achieve higher search engine rankings. Since we are detaching the website’s Sidebar, we are eliminating the additional widgets & Ads that load unnecessarily, helping the site load super-fast.
3. Improve Mobile Compatibility
To rank well in search engines and deliver an optimized browsing experience for your site’s audience, focus on responsive web design so your site looks stunning on small-screen devices.
You may need to add CSS or JavaScript to create a mobile-friendly sidebar, which will be part of your content. When you omit the Sidebar, it would be easier to improve mobile compatibility, which supports your SEO.
Here is a method for designing your Divi post page and homepage without a sidebar to achieve the benefits discussed above!
You can remove the Sidebar from an existing blog post or a new article you will create.
Go to WordPress Dashboard > Posts > Edit the post you want to keep its width full.
Now, look to the right and find the option “Divi Page Settings.“ In this section, there is a page layout option; select “No Sidebar,” as shown in the screenshot below.
Then click the “Save” button and refresh the single post page. You will see the content without any sidebar like this!
If you create a new blog post, follow this procedure to complete the job in seconds.
Sometimes, you may want to take out the Sidebar from the home page or blog page of your website/blog to make your site visually appealing and not to divert your readers’ minds.
Here I will explain how to delete the Sidebar from the homepage built with the Divi theme.
Step 1: Go to WordPress Dashboard > Pages > Add New to create a new page with Divi settings.
Step 2: Name the page as you like and click the Publish button.
Step 3: Click Use Divi Builder to see three options, as shown in the image below!
Step 4: Select the option Build From Scratch. You will get a popup, and there you need to pick – Single Column.
Step 5: A new window will open, and there, search for Blog elements and click on that element. You can glance at the blog elements like blog count, and so many options are available; you may pick the elements per your requirements.
Step 6: Now, click the tick mark and Save button. You can see the blog page without a sidebar. So, in this way, you can remove the side from the Divi home blog page.
Step 7: After removing the Sidebar from the homepage, click the Theme Customizer to set up the blog page we created as the homepage.
So, go to Theme Customizer > click Homepage settings > A static page, and under the Homepage option, choose the page you have created. Here, I’m giving “Blog page” and clicking Publish. That’s all!
And if you visit your homepage, it goes live without a sidebar. I have implemented the same method on my blog, and yes, you can use another method to remove the Sidebar from the Divi homepage. I have shown just what I have done for my blog.
Sometimes, the default Divi layout settings may not completely remove the sidebar. In those situations, custom CSS can help force a true full-width layout. Add the following CSS code:
#sidebar {
display:none;
}
#left-area {
width:100%;
margin-right:0;
}
.et_right_sidebar #main-content .container:before {
display:none;
}Add this code in:
Divi → Theme Options → Custom CSS
This CSS does three things:
1. Hides the sidebar area
2. Expands the main content width
3. Removes the vertical sidebar divider line
If you’re editing Divi extensively, I recommend using a child theme to avoid losing customizations after theme updates.
Frequently Asked Questions
How do I create a full-width page in Divi?
You can create a full-width Divi page by selecting the “No Sidebar” layout in the page settings or by using Divi Builder full-width modules.
Can I remove the sidebar globally in Divi?
Yes. The best way to remove sidebars globally is by using Divi Theme Builder templates or custom CSS.
Why is the sidebar still showing in Divi?
This usually happens because of:
caching issues
Theme Builder overrides
WooCommerce template
Third-party plugin conflicts.
There is no need to worry if you don’t have time to read the above explanation for removing the Sidebar from the Divi theme. Here is a detailed video tutorial to remove the Divi sidebar on the blog page and posts.
Wrapping Up
Divi is a fantastic WordPress theme for building high-converting business sites. To narrow down your efforts in getting the leads & conversions, I would suggest you create full-width web pages and landing pages and let your visitors be involved in your content.
Besides, Google loves the site’s elegant design and simple navigation for a great user experience. So, if you are building a blog, business site, landing page, or eCommerce store and have decided to get rid of the Divi theme sidebar is a great decision to maximize its potential.
For beginners, the built-in Divi layout settings are enough. For advanced customization, the Divi Theme Builder and custom CSS offer greater control over your website design. After working with Divi for many years, I’ve found that sidebar-free layouts consistently perform better for conversion-focused pages.
I hope I have explained how to remove sidebar in the Divi theme, which will help you construct the non-distracting pages for your targeted readers. Have you understood the methods through step-by-step explanations? Let me know if you need any help with Divi theme customizations.
Other Divi Tutorials
How To Add a Testimonial Slider In Divi?
How To Upload Custom Fonts In Divi?
