Removing sidebars and search field on home page

• 

  jeanguerre · Member · Mar 1, 2013 at 8:43 pm

  • Copy link
  • Add topic to favorites

  Does anybody know how to remove the side columns (including recent comments, archives, blog roll, meta, etc.) and search field on the home page? I’m using the Oxygen theme and for some reason they only show up partially on my home page when I maximize the screen. I’d like to take them out altogether.

  The blog I need help with is: (visible only to logged in users)

• 

  designsimply · Member · Mar 5, 2013 at 4:02 am

  • Copy link

  If you’d like to simply change out the content for the left sidebar, you can adjust them from the Appearance → Widgets page.

  If you want to remove the sidebar using CSS, you might start with something like this:

  #secondary {
  	display: none;
  }
  
  #content {
  	margin-left: 0;
  }

  If you want to limit that example to the home page, add “.home” to the front of both selectors in the example above.

• 

  jeanguerre · Member · Mar 5, 2013 at 4:40 am

  • Copy link

  Awesome, thank you so much! Is there a way to remove the BlogRoll and Meta section? The code you gave me worked for the left side bars, but not sure how to go about removing the right-side ones.

• 

  designsimply · Member · Mar 5, 2013 at 4:59 am

  • Copy link

  The CSS for that would be very similar.

  Add this to the #content block:

  width: 100%;

  And then add this:

  #tertiary {
  	display: none;
  }

  If you right-click on the sidebar and select the “Inspect Element” option, you should be able to browser through the HTML so you can see were id=”tertiary” gets set and so you have a better idea for how the CSS is working based on the HTML.

• 

  designsimply · Member · Mar 5, 2013 at 5:01 am

  • Copy link

  The CSS for that would be very similar.

  Add this to the #content block:

  width: 100%;

  And then add this:

  #tertiary {
  	display: none;
  }

  If you right-click on the sidebar and select the “Inspect Element” option, you should be able to browser through the HTML so you can see were id=”tertiary” gets set and so you have a better idea for how the CSS is working based on the HTML.

• 

  jeanguerre · Member · Mar 5, 2013 at 3:28 pm

  • Copy link

  Ahh, ok I was wondering how to find the element’s html. Thank you so much! This really helps.