BugWP logo BugWP
Back to Community
Home / Community / Theme → Twenty fourteen

How to Remove or Modify the Sidebar in Twenty Fourteen

19 threads Sep 7, 2025 Theme → Twenty fourteen

Content

The Twenty Fourteen theme's unique two-sidebar layout is a defining feature, but it's not always what every site needs. A common request from users is to remove a sidebar—either the left primary sidebar or the right content sidebar—on specific pages or across the entire site. Based on community discussions, this guide covers the most effective methods to achieve this.

Why This Happens

The theme is designed with a specific layout structure. Simply removing all widgets from a sidebar area often leaves an empty space because the HTML container for the sidebar and its associated CSS styling remain active. To properly remove it, you must modify the underlying page structure or styling.

Common Solutions

1. Using a Page-Specific Template (For Individual Pages)

This is the most common and recommended method for removing a sidebar from a single page without affecting others.

  1. Create a Child Theme: Always make changes in a child theme to preserve your modifications after theme updates.
  2. Duplicate the Template: Copy the page.php file from the parent Twenty Fourteen folder into your child theme directory.
  3. Rename and Modify: Rename the copied file to something descriptive, like page-no-sidebar.php. At the top of this new file, add the following template name comment:
    <?php /* Template Name: Full Width, No Sidebar */ ?>
  4. Remove the Sidebar Call: Find the line that says <?php get_sidebar(); ?> and delete it.
  5. Apply the Template: Edit the desired page in your WordPress dashboard and select your new "Full Width, No Sidebar" template from the Page Attributes meta box.

2. Using Custom CSS (For Visual Adjustments)

If your goal is to remove a sidebar's visual space or adjust padding/margins (as seen in threads about spacing below widgets), CSS is the perfect tool. You can add CSS via a child theme's style.css or a Custom CSS plugin.

  • Hide the Left Sidebar Entirely:
    #primary-sidebar { display: none; }
    .site-content { margin-left: 0; }
  • Hide the Right Content Sidebar:
    #content-sidebar { display: none; }
    .content-area { width: 100%; }
  • Adjust Widget Spacing: To reduce the space between widgets in a sidebar, target the widget class:
    .widget { margin-bottom: 10px !important; }

3. Conditional Code for Posts and Pages

For more advanced control, such as removing a sidebar from all posts or a specific category, you can add conditional code to your child theme's functions.php file. This method hooks into WordPress to adjust the layout based on defined conditions.

Important Considerations

  • Child Theme Essential: The Twenty Fourteen team updates the theme. Using a child theme is the only way to ensure your customizations are not overwritten.
  • Plugin Caution: Some threads mentioned plugins like "Fourteen Extended" to manage sidebars. While plugins can offer a user-friendly interface, they may not be maintained indefinitely. Custom code in a child theme often provides a more permanent solution.
  • Responsive Design: Be aware that removing a sidebar with CSS will affect all screen sizes. To make changes only for desktop or mobile, you will need to use CSS media queries.

By understanding these methods, you can confidently tailor the Twenty Fourteen layout to your specific needs, whether you want a single-page modification or a site-wide change.

Related Support Threads Support