Archived

This topic is now archived and is closed to further replies.

  • 0

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

Question

Posted · Report post

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

Share this post


Link to post
Share on other sites

15 answers to this question

Posted · Report post

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

Share this post


Link to post
Share on other sites

Posted · Report post

` .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.

Share this post


Link to post
Share on other sites

Posted · Report post

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

Share this post


Link to post
Share on other sites

Posted · Report post

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

Share this post


Link to post
Share on other sites

Posted · Report post

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

Share this post


Link to post
Share on other sites

Posted · Report post

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 :)

Share this post


Link to post
Share on other sites

Posted · Report post

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.

Share this post


Link to post
Share on other sites

Posted · Report post

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

Share this post


Link to post
Share on other sites

Posted · Report post

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

Share this post


Link to post
Share on other sites

Posted · Report post

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)

Share this post


Link to post
Share on other sites

Posted · Report post

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

Share this post


Link to post
Share on other sites

Posted · Report post

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

Share this post


Link to post
Share on other sites

Posted · Report post

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

Share this post


Link to post
Share on other sites

Posted · Report post

` .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 <?php } ` We can adjust placement slightly when you get this far.

Share this post


Link to post
Share on other sites

Posted · Report post

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; } `

Share this post


Link to post
Share on other sites