Need a white background to posts – different from static home page

• 

  rjt2020 · Member · Jan 9, 2012 at 3:32 pm

  • Copy link
  • Add topic to favorites

  hello! I have set a static home page on my site http://www.hkadventurebaby.com and don’t mind that the post there is transparent.

  But for all other pages on my site, the text is really difficult to read. I would like to add a white background to all my posts but not sure how I can do it.

  Please help! I am basically code illiterate, so please make answers simple. thank you!

  :)

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

• 

  timethief · Member · Jan 9, 2012 at 5:43 pm

  • Copy link

  The Blogum theme has a custom background option and when using it what we choose either a color or an image displays on all pages in the blog. Have you purchased an annually renewable custom design upgrade? Without it you cannot have more than a single background choice for all pages in the blog. With it you may be able to have a white background behind your blogging space on posts and pages but I’m not sure of that as I don’t help with CSS editing.

• 

  rjt2020 · Member · Jan 10, 2012 at 1:36 am

  • Copy link

  thanks timethief. I’ve used the blogum theme to upload a photo background. However, I would like to put a white background behind the text of my posts in the middle colum.

  I have the custom design upgrade and wondering perhaps if there is code that I need to include to allow this to happen?

  thanks :)

• 

  timethief · Member · Jan 10, 2012 at 1:39 am

  • Copy link

  I will flag this thread so it’s moved to the CSS Forum for you. Please be patient while waiting for help.

• 

  thesacredpath · Member · Jan 10, 2012 at 3:30 am

  • Copy link

  It’s a little more involved than just adding a background color, so let’s start with this and then go from there.

  .post, .middle .page {
  background: #FFFFFF;
  padding-left: 10px;
  padding-right: 10px;
  }
  
  .post-meta {
  width: 125px;
  }
  
  .sidebar, .footer {
  background: #FFFFFF;
  }
  
  .widget {
  margin-left: 10px;
  margin-right: 10px;
  }
  
  .widget-body {
  width: 100%;
  }
  
  .footer p {
  margin-left: 10px;
  margin-right: 10px;
  }

• 

  rjt2020 · Member · Jan 10, 2012 at 3:45 am

  • Copy link

  woohoo you legend!! ok two other follow up questions seeing as you were incredibly helpful:

  1. any way to make the front page (i.e HOME page) background NOT white, i.e. transparent like it was, but all the other pages with the white background?

  2. any way to make the side bar NOT white and transparent, so only the MIDDLE text is behind a white background? visually it looks a bit uneven.

  thank you so sosos much!

  :)

• 

  thesacredpath · Member · Jan 10, 2012 at 3:56 am

  • Copy link

  1. Add this that will exclude the background from the home page specifically.

  .home .page, .home .sidebar {
  background: transparent;
  }

  2. Yes, dump .sidebar and the trailing comma out of .sidebar, .footer and then delete the .widget and .widget body rules.

• 

  rjt2020 · Member · Jan 10, 2012 at 9:00 am

  • Copy link

  thesacredpath, you are a lifesaver.

  Ok, got 1. But not sure about 2. Can you please show me how the code should now look?

  thanks so much again,
  RAchel

• 

  thesacredpath · Member · Jan 10, 2012 at 9:07 am

  • Copy link

  The sidebar footer code should now look like this

  .footer {
  background: #FFFFFF;
  }

  These two should be deleted entirely

  .widget {
  margin-left: 10px;
  margin-right: 10px;
  }
  
  .widget-body {
  width: 100%;
  }

• 

  rjt2020 · Member · Jan 10, 2012 at 10:17 am

  • Copy link

  This is what I have, and it doesn’t seem to be working…

  .post,.middle .page {
  background:#FFFFFF;
  padding-left:10px;
  padding-right:10px;
  }

  .post-meta {
  width:125px;
  }

  .footer {
  background:#FFFFFF;
  }

  .home .page,.home .sidebar {
  background:transparent;
  }

• 

  thesacredpath · Member · Jan 10, 2012 at 10:48 am

  • Copy link

  It’s working when I view your site. All pages have a white background for the content except for the main page which does not.

  Clear your browser cache, force refresh and take another look.