Need help with CSS to remove sidebar

• 

  memorymark · Member · Feb 16, 2015 at 3:10 pm

  • Copy link
  • Add topic to favorites

  I’m creating a website with the Parament theme, and would like to remove the sidebar for the page on which I’m integrating my Ecwid store. I’d appreciate help with the CSS for that change. I’m familiar with where to paste the code, but I’m not able to write it…thanks!

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

• 

  designsimply · Member · Feb 17, 2015 at 12:41 am

  • Copy link

  You can hide the sidebar and the Parament theme by adding the following CSS to your Appearance > Customize > CSS editor:

  #sidebar {
  	display: none;
  }
  
  #main {
  	width: 960px;
  }

  Adjust the 960px value as needed.

  When making a change to the content width for any theme, you will also want to update the Media Width setting below the editor. If the content container width is 960px, then the inner container works out to be about 928px so you should enter 928 for the Media Width in that case.

• 

  memorymark · Member · Feb 17, 2015 at 2:22 am

  • Copy link

  Thanks so much for your help! That CSS removes the sidebar on all pages. Is there a way to remove it only on one page, the page with my Ecwid store, and keep it visible on the other pages?

• 

  designsimply · Member · Feb 17, 2015 at 4:12 pm

  • Copy link

  You can target specific pages with CSS by putting a body class in front of the selector. For example, changing “#sidebar” to “.home #sidebar” means the change would just be applied to the home page.

  To figure out what body class to use, you can use this method to look at the page source and find a class that’s specific to the page you want to change:
  http://en.support.wordpress.com/custom-design/how-to-find-your-themes-css/

  If you need more help figuring it out, provide a link to the store page here and I will take a closer look.

• 

  memorymark · Member · Feb 17, 2015 at 4:43 pm

  • Copy link

  Thanks much! I’ll give it a go…and let you know if I need more help.

• 

  mjk1450 · Member · Mar 2, 2015 at 8:19 pm

  • Copy link

  Here is what I placed in my CSS. Although the width of the text area is correct, my sidebar is still visible. How do I remove the sidebar? I am using Misty Lake theme.

  .page-id-2932 #sidebar {
  display: none;
  }

  .page-id-2932 .entry-content {
  width: 820px;
  }

• 

  mjk1450 · Member · Mar 2, 2015 at 8:40 pm

  • Copy link

  I got it. Instead of #sidebar, I replaced it with #secondary. It works.