How to Remove Sidebar from WordPress Page or Hide WordPress Sidebar

Are you looking for a quick step by step solution to remove the sidebar from your WordPress website? I have a simple to understand and implement tutorial here detailing how to remove WordPress sidebar without a hitch no matter your level of WordPress experience.

The problem with most WordPress tutorials, they complicate simple things like removing sidebar in WordPress with verbose descriptions that are difficult for WordPress beginners to follow.  This tutorial will share a simple approach to remove WordPress sidebar as well as the advanced way you can remove the sidebar in WordPress.

This tutorial has a detailed guide on how to remove the sidebar in WordPress and why everything works as well as the last part that has that quick code to just implement without deeply understanding how it works.

Steps to Remove Sidebar WordPress

To remove the sidebar in WordPress we can undo either of the two steps used to add sidebar in WordPress as you I have explained here and summarized in the section below. Most importantly, the second step – calling the sidebar should be the one we undo most of the time.

We can omit this function that calls the sidebar (get_sidebar()) in the page template to successfully remove the sidebar in a WordPress site. In a quick overview, you can remove sidebar in WordPress following these steps:

1. Locate the page template or post template that displays the sidebar among your active theme files or the theme you want to remove the sidebar. (For this tutorial, I will demonstrate how to remove sidebar in Twenty Seventeen default WordPress theme)
2. Open the page or post templates and look for the code that displays the sidebar <?php get_sidebar(); ?>
3. Check if this code is repeated several times in your theme page and posts template since some themes come with multiple sidebars.
4. Delete these lines of code that display the sidebar.
5. Alternatively you can create a full-width page template that omits the call to the sidebar – sidebar <?php get_sidebar(); ?>
6. Finally, you can use the WordPress function unregister_sidebar() in the action hook that uses widgets_init to remove the sidebar in your WordPress theme.

How to Add and Display Sidebar in WordPress

First, you need to understand that a sidebar is simply a widget area that is created in your theme using a function called register_sidebar() for programmers they will understand this in detail as I explained in this tutorial  – how to add a sidebar in WordPress.

It may also be useful for WordPress users to understand how a sidebar is added from that tutorial so that we can learn how to remove the sidebar in your WordPress theme.

Fundamentally, when adding a sidebar in WordPress as explained here, there are two important steps; registering the sidebar, and calling the sidebar in the theme templates.

Registering WordPress Sidebar

This uses the register_sidebar function and the code can be found in the functions.php file of your theme. For purposes of this tutorial, I will be using the Twenty Seventeen default WordPress theme to explain step by step how to remove sidebar in WordPress.

First, on the frontend you can see the sidebar is displayed as shown in the image below:

When you download this theme and open the functions.php file, you can see the sidebars are added in the code shown on the image below:

There are three sidebars registered in this theme and the sidebars include the main blog sidebar and two footer widgets.

To remove sidebar in this WordPress theme we need to choose which sidebar we need to remove and the most important sidebar that should be removed is obviously the main blog sidebar that is registered in the code below:

This is the sidebar that has the name ‘Blog Sidebar’ and the id as ‘sidebar-1’ as shown in the image above. Similarly, in your current WordPress theme when you open the functions.php, you should be able to isolate this code that registers the sidebar widget.

If you removed this code from the functions.php the sidebar would be removed but this is not the best approach since you may also have to edit the other function that displays the sidebar.

You may also want to have this sidebar in other pages and only removed on one page so removing the sidebar from this functions.php file is not recommended.

Display of Sidebar in WordPress Theme

The sidebar is displayed on any page or post using a call to a template called sidebar.php. Essentially what happens is that the page or post templates they call the file called sidebar.php which contains the code that displays the sidebar.

In our tutorial illustration, when you open the sidebar.php file of the Twenty Seventeen WordPress theme, you will see the following line of code that is responsible for rendering the sidebar code:

Further into the WordPress theme files, when you open the index.php or page.php or the single.php file, you will see the code shown in the image below that now calls the sidebar.php file to display its content in the page and the post:

In the twenty Seventeen default WordPress theme the code is located in the index.php file just before the call to the footer template.

How WordPress Sidebar Code Works

There are three files that are involved with the WordPress sidebar and also there are three main functions that are involved when adding WordPress sidebars and they work as follows:

1. Functions file registers the sidebar(widget areas) using this function – register_sidebar()
2. The sidebar file contains the code to display the sidebar using this function – dynamic_sidebar()
3. Index,page.php or single.php or custom-post-type-page.php calls the code from the sidebar.php with this template tag – get_sidebar()

So the sequence of events is as follows in a diagrammatic illustration:

How to we remove the WordPress Sidebar?

As mentioned above, the best place to interrupt this sequence of events is to avoid the last part which is displaying the sidebar since we just want to remove it from the view rather than to completely remove sidebar from WordPress theme functions.

This is often the case since we want to remove the sidebar from one page or post of a site and not in all the pages or posts of a site.

4 Ways to Remove Sidebar in WordPress Theme

#1 Delete get_sidebar() function Remove Sidebar WordPress Site

Now that we understand how the WordPress sidebar is added and displayed in WordPress site we can now easily remove the sidebar by removing the get_sidebar() code from the page template that we want to remove sidebar from.

• Open your theme files and look for get_sidebar() function in the page.php, single.php, index.php or other custom page templates that are added to your theme.
• When you open this file look for that code and delete it this will remove WordPress sidebar.
• Sometimes the code might call a specific sidebar like the footer sidebar might have a code like this – <?php get_sidebar(‘footer-widget-area’); ?>  simply delete the code that corresponds to the WordPress sidebar that you want to remove.

#2 Create Full Page Custom Template to Remove Sidebar WordPress Site  (Static Page)

The second way to remove sidebar in WordPress is to create a custom page template that does not have the get_sidebar() function.

• To create a custom template page for your theme, you need to add the following code to a new file that you will save inside your main theme folder:

<?php

/*
*
*  Template Name: Fullwidth Template
*/

get_header();

• Save the file as fullwidth-page.php and log into your WordPress dashboard and click on create a new page. Under the Page Attributes metabox, you should see the full page custom page template in the drop-down menu as shown on the image below:

• Now you need to add the page contents so that you can display the other page contents and omit the sidebar. Open your theme’s php and copy all the content to the new fullwidth-page.php removing the get_sidebar() tag so that you have all other parts without the sidebar.
• When you copy save and return to your dashboard to create a new page using the new full-width page template without the sidebar.
• You can also create a custom single post template to remove the sidebar from the posts just like you have removed the sidebar from the page. Add the following code in the new file :

<?php
/*
* Template Name: Post without Sidebar
* Template Post Type: post, page, product
*/

get_header();  ?>

• Save this file as fullwidth-single-post.php and you can now access the fullwidth single custom post template just as you access the custom page template explained in the step above.

#3 Use Unregister Sidebar Function to Remove Sidebar WordPress

Another ingenious way you can remove the sidebar in WordPress is to use the unregister_sidebar() function. This function takes one argument that s the sidebar ID and the general expression is as follows:

unregister_sidebar( string|int $sidebar_id )

The function removes sidebar from a list of sidebars and it can be used in an action hook as follows :

function remove_footer_widgets(){

   // Unregister the TwentySeventeen footer sidebars
   unregister_sidebar( 'sidebar-2' );
   unregister_sidebar( 'sidebar-3' );
}

add_action( 'widgets_init', 'remove_footer_widgets', 11 );

This will effectively remove the footer sidebars in the Twenty Seventeen default WordPress theme.

#4 Use Free Plugins to Remove WordPress Sidebars

There are several plugins that you can use to disable sidebar on pages and post by managing the sidebars. The three most popular sidebar and widgets management plugins that are free include:

• Custom Sidebars – Dynamic Widget Area Manager
• Simple Page Sidebars
• Content-Aware Sidebars – Unlimited Widget Areas
• Widget Disable

CSS Adjustment after You Remove WordPress Sidebar

Finally, you may have to readjust your styles since removing sidebar leaves a space and this can be achieved by some CSS adjustments.

In the Twenty Seventeen default WordPress theme you can add the following CSS styles to adjust the space left by removed sidebar:

.content-area {
    width: 100%;
    margin: 0px;
    border: 0px;
    padding: 0px;
}

.content-area .site {
    margin:0px;
}

Now without the sidebar, the site should be successfully removed and the content area width adjusted to fit in the full page as shown in the image below:

Wrapping Up

In this post, we have broadly outlined the four common ways you that remove sidebar in WordPress and each of these methods have pros and cons. To remove WordPress sidebar, you need to evaluate your theme and find how it has been coded so that you can implement the best method to remove the sidebar in your WordPress theme. I hope you find this WordPress tutorial useful and you can get in touch if you need more guidance on how to remove your WordPress theme sidebar.