Jump to content


Photo
- - - - -

changing background color on pages


  • Please log in to reply
16 replies to this topic

#1 tandan

tandan

    Super Member

  • Members


  • 152 posts
  • LocationNew York
  • Country: Country Flag

Posted 09 May 2012 - 12:28 AM

Hi there,
I'm trying to figure out how to make my site background look like what's in this pic Posted Image
with the white branding area, blue feature area (full width), white content area, and blue footer area...
what's the best way to accomplish this? there doesn't seem to be an easy way to do that when looking at this how-to:

Please Login or Register to see this Hidden Content



Any suggestions? I have a few sites I'd like to do this for not only this one...

Thanks so much!!
Tan

#2 catrina

catrina

    Advocate

  • Members
  • 12345 posts
  • LocationCalifornia
  • Country: Country Flag

Posted 09 May 2012 - 02:34 AM

There is a way to accomplish this, but not a way with the Color Control settings. Custom CSS settings (described here:

Please Login or Register to see this Hidden Content

) can be used to implement these changes. There's a tutorial on using Firebug to create the CSS you need for those customizations:

Please Login or Register to see this Hidden Content

I inspected your site and your canvas (that white space background on top of the overall background) is "blocking" the way of other background colors that can be added. Using Firebug, I added a background color to the feature area and it was full width, but that white background was sitting on top of it. You'd need to make that white background transparent first and then make the changes to the background colors for your features.

#3 sum247

sum247

    Advanced Member

  • Members

  • 53 posts
  • Framework Version:plus
  • Country: Country Flag

Posted 09 May 2012 - 12:53 PM

Hi, I need main page "to NOT have a Page Backgroung color" and the rest of the pages to have the setting "Background color to white" please help is there a way to fix this. Thank you!

#4 catrina

catrina

    Advocate

  • Members
  • 12345 posts
  • LocationCalifornia
  • Country: Country Flag

Posted 09 May 2012 - 01:14 PM

@sum247 If you want your main page to not have a page background color and the rest of the pages to have a white background color, what background do you want the main page to have? (Also, since this issue is different from the original topic, your issue can be posted as a separate topic, but there isn't a way for me to move your issue to a brand new thread so we'll leave it here)

#5 sum247

sum247

    Advanced Member

  • Members

  • 53 posts
  • Framework Version:plus
  • Country: Country Flag

Posted 09 May 2012 - 01:31 PM

Thank you Catrina. I didn't know how to make my own topic. I need the main page to show the Background image I've placed so that's why the Page Background color needs to be transparent (not showing).

#6 catrina

catrina

    Advocate

  • Members
  • 12345 posts
  • LocationCalifornia
  • Country: Country Flag

Posted 09 May 2012 - 01:38 PM

Can you please post a link to your site? By the way, a new topic can be started by clicking the "Start New Discussion" button on the top right corner of the forum. :)

#7 sum247

sum247

    Advanced Member

  • Members

  • 53 posts
  • Framework Version:plus
  • Country: Country Flag

Posted 09 May 2012 - 03:46 PM

www.chatsworthfinehomes.com/new-landing

#8 sum247

sum247

    Advanced Member

  • Members

  • 53 posts
  • Framework Version:plus
  • Country: Country Flag

Posted 09 May 2012 - 03:46 PM

thanks

#9 catrina

catrina

    Advocate

  • Members
  • 12345 posts
  • LocationCalifornia
  • Country: Country Flag

Posted 09 May 2012 - 04:15 PM

Please add this to Custom Code > Custom CSS in the PageLines theme settings:

Please Login or Register to see this Hidden Content



#10 sum247

sum247

    Advanced Member

  • Members

  • 53 posts
  • Framework Version:plus
  • Country: Country Flag

Posted 09 May 2012 - 05:05 PM

Hi Catrina, I placed the code in CSS Rules and made the page main page but is not working.

#11 sum247

sum247

    Advanced Member

  • Members

  • 53 posts
  • Framework Version:plus
  • Country: Country Flag

Posted 09 May 2012 - 05:23 PM

Can you suggest something else because I really need that page baground colour to be transparent. Thank you!

#12 Rob

Rob

    One Smart Egg

  • Members
  • 13575 posts
  • LocationEast Coast, USA
  • Framework Version:The Latest, of course
  • Country: Country Flag

Posted 09 May 2012 - 09:03 PM

@tandan, your selection of canvas is what's preventing you from applying a different background image in the site. Take a look at

Please Login or Register to see this Hidden Content

to see that I put a site-wide background behind my header. That could be any height I prefer it to be, since it's not a header background, but a site background. Also, look at

Please Login or Register to see this Hidden Content

and view the background to see how I used a graphic to create a white canvas area. I'd suggest reading

Please Login or Register to see this Hidden Content

and this

Please Login or Register to see this Hidden Content

for additional information. Please let us know if you need additional assistance.

#13 sum247

sum247

    Advanced Member

  • Members

  • 53 posts
  • Framework Version:plus
  • Country: Country Flag

Posted 10 May 2012 - 07:53 PM

All I need is for one page to not have the canvas is there a way to do that.

#14 catrina

catrina

    Advocate

  • Members
  • 12345 posts
  • LocationCalifornia
  • Country: Country Flag

Posted 11 May 2012 - 02:35 AM

A page is always going to need a canvas, but if you want to change its color to transparent, use this:

Please Login or Register to see this Hidden Content



#15 sum247

sum247

    Advanced Member

  • Members

  • 53 posts
  • Framework Version:plus
  • Country: Country Flag

Posted 11 May 2012 - 10:58 AM

does this goes directly inside the CSS Rules and how will it know to do that to the main page? thanks

#16 Danny

Danny

    Is Awesome!

  • Moderators
  • 15702 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 11 May 2012 - 11:43 AM

Hi Sum247,

I have read through this whole topic and I am at a loss as to what you actually want to accomplish.

If you want to achieve a full width white background color on the header section, content area of your website, with a full width blue background on the feature area and footer section. That you mentioned in your original post, then use the following code as a template to work from.

Please Login or Register to see this Hidden Content


All sections have a .texture and a .content you can use these to add a background color to the section or use transparent like I did above to make the background color of that section transparent.

#17 tandan

tandan

    Super Member

  • Members


  • 152 posts
  • LocationNew York
  • Country: Country Flag

Posted 11 May 2012 - 02:08 PM

hi danny, i'm actually the originating post. sum247 posted on my thread so that's why it's confusing--but i definitely appreciate the help!!! thank you!!! tan