How to Remove the Sidebar on Your WordPress Site

By November 8, 2018WordPress

WordPress sidebars can be found in many places – usually on the right, left, or bottom area of your website. In fact, a lot of WP themes (free and paid) come with built-in sidebars.

Are you considering removing the sidebars from your website? If so, consider these benefits of using sidebars first:

  1. You can display items that are relevant to your niche but not necessarily related to single posts.
  2. If you have an email list, the signup form can be placed on the sidebar.
  3. You can use the sidebar as advertisement area.
  4. Affiliate links can be placed on sidebars.
  5. Your social media profiles on Facebook, Instagram, LinkedIn, etc. will lead to more exposure when placed on your website’s sidebars.

Do You Need Sidebars on Your WordPress Site?

Sidebars are indeed useful and a lot of websites use them (for both personal and business sites). However, there are valid reasons for other WordPress users to want to remove sidebars from their sites, such as:

  1. Appearance Issues – A lot of WordPress themes appear differently when viewed from personal computers, laptops, tablets, mobile phones, etc. – this affects the sidebars’ use and functionality.
  2. Size Matters– No matter where a user chooses to access a website, the content screen will always be smaller than the full-sized screen because the sidebars definitely eat up some space.
  3. Usefulness is Limited – While sidebars are very useful when they’re located at the right or left side of your website, they will not be as effective when viewed from a mobile device. You see, most WordPress themes are programmed to display their sidebars at the bottom of the site when viewed from devices with small screens (e.g. cell phones, tablets).

All in all, we can say that sidebars either work for or against your intended purposes. Having sidebars work well for websites with viewers that mostly use PCs and laptops. However, if you are catering to an audience that mostly use cell phones and tablets, websites without sidebars are indeed more user-friendly.

How to Remove Sidebars from Your WordPress Site

The following steps will allow you to remove the sidebars from your WordPress theme:

  1. Connect to your site by using an FTP client (e.g. FileZilla, CyberDuck, Transmit, etc.).
  2. Look for /wp-content/themes/the-name-of your-theme/ folder.
  3. Since you need to edit all the templates that have sidebars, look for codes like home.php, page.php, index.php, single.php, archive.php, etc.
  4. If you’re using a WordPress theme with one sidebar, look for the code below when you open a template:
?php get_sidebar(); ?
  1. If you’re using a WordPress theme with multiple (2 or more) sidebars, look for a code like this:
?php get_sidebar('footer-widget-area'); ?

Note: In the example above, you will see that the sidebar is located at the bottom part of the website (footer).

  1. At this point, delete all the lines (codes) that you want to remove as sidebars.
  2. Save all the changes you’ve made and upload the revised files back to your website.
  3. Now, go to your website to see if removing the sidebar/s has been successful.

The Problem with Removing Sidebars

With the sidebars gone, you might find that your site’s content area still has the same width (as before removing the sidebars). What’s worse, those areas that used to have sidebars are now empty – empty spaces that occupy a part of the screen, that is.

Keep in mind that a lot of WordPress themes have a predetermined width for the content area. Some WordPress themes are customizable, but if you’re using one that doesn’t have customization features, you will need to add a CSS code manually.

Below is a demonstration of a custom CSS to expand your site’s content area.

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

margin:0px;
}

In the above example, the expanded width is the 100% value. Since everything else has 0 value, the content of your site will be extended up to the edge of the screen.

Website with Full-Width Screen

How to Remove Sidebars from a Static Page

If you just started building your website and are decided on a site without sidebars, we suggest using a WordPress theme that already comes with a built-in full-width template. With such a theme, you can immediately launch your website without tweaking on codes and stuff.

Is your WordPress website already up and running? Well, you can still use the same theme (if you don’t want to replace it). All you have to do is edit the particular page with sidebars and select the full-width option in the Page Attributes meta box.

In the event that the full-width option is unavailable in your theme’s Page Attributes section, you can create your own template with a full-width feature. Here’s how to do it:

  1. Open a text editor (e.g. Notepad)
  2. Copy the codes below.
<?php /* * Template Name: Full-Width */ get_header(); ?>
  1. For ease of use, save the file as full-width.php
  2. Now, connect to your website using an FTP client.
  3. Look for the /wp-content/themes/the-name-of-your-theme/ folder.
  4. Edit the file called page.php and copy all the codes after the line that says
?php get_header(); ?
  1. Paste the codes in the file that you created – the one with the filename full-width.php
  2. Find the line that looks like the codes below and delete it.
?php get_sidebar(); ?
  1. Click on the Save button.
  2. Upload the revised full-width.php to the theme that you’re currently using.

Note: The steps above can be applied to any page on your site. You will see the full-width option on the Page Attributes section on your WordPress Dashboard.

How to Remove Sidebars from Blog Posts

If you’re running a website with a static page as the front page and a separate page for your blog, you can remove the sidebars on your blog if you want to. To do this, perform the following steps:

  1. On your Admin Dashboard, go to Settings.
  2. Choose the Reading option.
  3. Go to Pages section.
  4. Select All Pages
  5. Choose the particular page assigned for your blog posts.
  6. Look for the Page Attributes meta box.
  7. Select full-width
  8. Click Save.

Note: If you can’t find the full-width option, just follow the method in the previous section to create your own.

We sincerely hope that we have helped you in removing the sidebars on your website. Give us a thumbs-up if we did and do share this post, ok?

MangoMatter WP Team

About MangoMatter WP Team

We live to solve WordPress issues, and help beginners on their WP journey :)