• 0
Sign in to follow this  
Followers 0

How to change colour of header colum


Question

Posted · Report post

Hello,

 

I LOVE your template. Absolutly everything I wanted to do with my new site I have acheived in just under an hour. The only item I can't figure out is how to change the header area (the area where my site title image name is) to match the footer colour. (I have enclosed my private in the works site url with my account as requested). You'll see my title image sits on the body background colour (cream colour). I want it to sit on a slate gray colour like the footer. I tried the settings in the tool you provide - but the only way I could get the colour behind the header title to change was to change the whole page.

 

For example, I want my header image to site on a backgorund colour similar to my current page: laughingmom.com.

 

How do I change the colour of the header (the colour behing my title image)?

 

Thank you.

 

Share this post


Link to post
Share on other sites

10 answers to this question

  • 0

Posted · Report post

Hi.

 

If you use the following code, your branding area will look like this:

 

#branding .content {
background-color: #33342E;
}
 
 
If you use this code instead, your branding area will look like this:
 

#branding .texture {
background-color: #33342E;
}

 

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Hi,

 

If you look at your site header in Chrome, you'll find the header edit icon on the left side.  When you edit that section, you'll see a field where the color can be changed by CSS. 

 

Check these instruction http://docs.pagelines.com/tutorials/section-area-styling

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

I'm sorry, your answer sounds so easy, but I am not seeing it. I have gone to my site in CHROME but there is no edit option. If I go to the WP admin then it is just the same settings as before. What am I missing?

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Okay, this isn't as difficult as one might think.

 

See the image below for guidance.

 

Click on the little pencil icon shown. When you do, the editing tools for the Header section will appear below the DMS toolbar.

 

Add a new, unique class for your header.  In this case, we'll call it my-header1.

[attachment=1490:9-7-2013 4-59-43 PM.jpg]

 

Next, we're going to add the color using CSS in Custom Code. 

You'll add something like this:

.my-header1 {

    background-color: #C00000;

}

 

Please note the color I selected (dark red) is for demonstration purposes only.  You should change it to the color you wish.

 

Since the columns are transparent by default, the background color of the header will show through them.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Thank you. As I have Page Lines and not DMS I had to fiddle a bit as the image you provided is not an option I have. But you pointed me in the right direction with the code. Thank you.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Perfect. Thank you so much.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Glad to hear Danny's code helped.  Your topic was posted under PageLines DMS.  You did not mention using PageLines Framework or PlatformPro. Apologies for my confusion.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

I hope that is OK to tailgate onto this conversation but what is the code for the footer section?

I am looking to change the color of just the footer area.

 

http://thelocalfilmnetwork.com/

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

DanatTLFN

There is no content in your footer area so you can't add any background to it. The security button is outside of your footer, if you want a background color added to that button you will need to target the buttons class and add your own styling.

 

As this button isn't part of the PageLines product we can't provide support.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

@mention

 

Thank you for getting back to me!

 

I some how through the magic of blind clicking managed to achieve a black footer, so no worries. I think it was just a case of tweaking a few of the settings in the pallette section. 

 

Thanks again for the help, anyway.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!


Register a new account

Sign in

Already have an account? Sign in here.


Sign In Now
Sign in to follow this  
Followers 0