Jump to content


Photo

change grey background colour for fixed-width (platform pro)template


This topic has been archived. This means that you cannot reply to this topic.
15 replies to this topic

#1 kitty73

kitty73

    Advanced Member

  • Members
  • PipPipPip
  • 42 posts

Posted 24 October 2010 - 12:48 PM

Hi , please can someone let me know the css code that I need to change the grey background in the fixed-width template - not been able to work it out myself so far. My site is http://www.greentreecompany.co.uk/ - I'd like the grey to be green. Hope you can help Many thanks K

#2 catrina

catrina

    Advocate

  • Members
  • 12345 posts

Posted 24 October 2010 - 05:29 PM

Hello, All I see is white background on all pages, not grey. Were you able to change the background color already?

#3 kitty73

kitty73

    Advanced Member

  • Members
  • PipPipPip
  • 42 posts

Posted 24 October 2010 - 08:29 PM

Hi Catrina, Yeah worked it out eventually. Am trying 2 work out how to add a telephone number above the social icons in the header now... Thanks.

#4 kitty73

kitty73

    Advanced Member

  • Members
  • PipPipPip
  • 42 posts

Posted 25 October 2010 - 11:21 AM

Hi Catrina, I've noticed that because I've changed my background colour to a very light green, the text in the footer has back boarder around it and is hard to read. Do you know how I can get rid of it and just have normal txt. Many thanks Kate

#5 kitty73

kitty73

    Advanced Member

  • Members
  • PipPipPip
  • 42 posts

Posted 25 October 2010 - 12:19 PM

Also, is it possible with the fixed width template to have the footer area in a diff colour than the background? i.e. so that it also has the background colour too? I am looking for it to appear in a nice dark green underneath the main part of the site? Many thanks for your help in advance, Kate

#6 cmunns

cmunns

    Advocate

  • Members

  • 6537 posts

Posted 25 October 2010 - 05:05 PM

This CSS should do the trick. Put in the Base theme or the custom css portion of the theme settings. ` #footer .content {width:980px; background:green; padding:0 10px;} body .fixed_width #footer { text-shadow:none; } `

#7 kitty73

kitty73

    Advanced Member

  • Members
  • PipPipPip
  • 42 posts

Posted 26 October 2010 - 12:14 PM

Thanks Adam. I took out the 'body' from the code and is now working nicely, however I do have a couple more questions to ask on this: 1. How can I get rid of the space between the footer and the main content (i.e. so the darker green meets the white content). I would also like this at the top of the page so that the site has only pale green at the left and right, not top and bottom. 2. How/where can I change the titles of the footers e.g. more to 'Contact Us' 3. How I can add an additional link underneath the pages in the footer. Hope you can help. Many thanks in advance, Kate

#8 cmunns

cmunns

    Advocate

  • Members

  • 6537 posts

Posted 26 October 2010 - 05:24 PM

`
.fixed_width #page {
margin:12px auto 0;
}
`

2. How/where can I change the titles of the footers e.g. more to 'Contact Us'


Edit the section.footcols.php file and search for "more" in the file.

3. How I can add an additional link underneath the pages in the footer.


If you are using the Base child theme then I would do it via a hook. This will also allow you to copy files such as the section.footcols.php over so it doesn't get saved over during platform updates.

There is a sample hook in the functions.php file of the Base theme and a list of all hooks in the template setup area (toggle advanced setup) for each section and you'll see.

Let me know if you need more instruction.

#9 kitty73

kitty73

    Advanced Member

  • Members
  • PipPipPip
  • 42 posts

Posted 26 October 2010 - 07:33 PM

Hi Adam, 1. I've added this into the custom css area, but nothing has changed. Any ideas - I just copied and pasted it from above. Have I put it in the correct place? 2. Great - found it! Thanks 3. Yes please if you can give me some more instruction, I have no idea what hooks are, how to do this or how this works! Many thanks Kate

#10 nelsons

nelsons

    Advanced Member

  • Members
  • PipPipPip
  • 40 posts

Posted 26 October 2010 - 08:11 PM

Hi Katie, How did you change the background colour of your site to the light green if you don't mind me asking. Also I liked the phone number above the footer, would you mind sharing that secret too ?? ;-) Thanks S

#11 kitty73

kitty73

    Advanced Member

  • Members
  • PipPipPip
  • 42 posts

Posted 26 October 2010 - 08:49 PM

Hi Steve, 1. change your site to 'fixed-width' in global options, then add this code to your custom code box #footer .content {width:960px; background:#86a025; padding:0 10px; color:white;} .fixed_width #footer { text-shadow: none!important; } I've used #86a025 as the green, so change that to your colour. I also changed all the footer colours in the theme.css to white (#footer) 2. For the phone number, go to 'footer options' and replace the 'more' text with your telephone text. To get rid of the 'More' at the top, edit the section.footcols.php file and search for "more" in the file and replace with 'Contact Us' or whatever you prefer, as Adam suggests above. Hope this makes sense and helps :)

#12 bryan-hadaway

bryan-hadaway

    Advocate

  • Members
  • PipPipPipPipPip
  • 3697 posts

Posted 27 October 2010 - 05:02 AM

Does anyone still need assistance on this topic? Thanks, Bryan

#13 kitty73

kitty73

    Advanced Member

  • Members
  • PipPipPip
  • 42 posts

Posted 27 October 2010 - 07:46 AM

Hi Bryan, Yes I do - pls see my reply to Adam. Can not get 1 & 3 working still. Many thanks Kate

#14 nelsons

nelsons

    Advanced Member

  • Members
  • PipPipPip
  • 40 posts

Posted 27 October 2010 - 10:09 AM

Hi Kate, OK, thanks for that very much appreciated. I have a question about the footer, if I change some of the colour values the text colour changes. I only want the background of the footer to be black if that makes sense ? Can you help ? Thanks Steve (on a steep learning curve)

#15 kitty73

kitty73

    Advanced Member

  • Members
  • PipPipPip
  • 42 posts

Posted 27 October 2010 - 01:02 PM

do this #footer .content {width:960px; background:#000; padding:0 10px;} .fixed_width #footer { text-shadow: none!important; } Also, please can you start a new topic if you need some more help as I still want to get my questions answered. Many thanks

#16 cmunns

cmunns

    Advocate

  • Members

  • 6537 posts

Posted 27 October 2010 - 05:02 PM

` .fixed_width #page { margin:12px auto 0 !important; } ` Try Adding the !important tag to take supreme precedence and dominate other selectors :) Using the base customization theme look at the functions.php file. There is a sample hook in that file. Yours would be similar in that you just need a link. Something like this could be pasted into functions.php ` add_action('pagelines_after_footcols', 'foot_link'); function foot_link(){?> Link Text