Archived

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

  • 0

Resolved How To Change Footer Font Size And Background Color?


Question

Posted · Report post

Hi there,

I'm having a couple problems:

  1. How, and more importantly, where do I change the font size of the items in our footer columns? We want to make the font much smaller, but I can't for the life of me find where to put to the code. I have tries the CSS/LESS field, and the footer.php. No dice.
  2. How do I tell the footer to have its own background? We want the footer to have a solid color background that infinitely spans horizontally and vertically. Right now, it's transparent.

Thanks!

Share this post


Link to post
Share on other sites

8 answers to this question

Posted · Report post

Looking at your link the site is set up in fixed width mode, so the css is slightly different for the footer. You'll need to add the following.


body.fixed_width #footer {background: #ffffff;}

Share this post


Link to post
Share on other sites

Posted · Report post

Thanks! That helped - though it sprung up a couple lingering new issues;

  1. The changes don't seem to be reflected on the homepage, but only the static pages (example: http://adsonwheels.c...cts-services-2/ shows the changes, but not the root ../sitetest/). The site is set to have a static page for its front page (this was off initially, but I set one, and the issues persisted.)

    EDIT: It seems to be working, now, after changing the static page's order to 0. I'm aware that the background is now off, 'cause I set the site to full-width.

  2. I was able to globally resize the fonts in the footer, but what do I need to do to target the column headers? They're now too small

Thanks again!

Share this post


Link to post
Share on other sites

Posted · Report post

Try this:


#footer li.link-list a, #footer .widget-title {

    color: rgba(54, 54, 54, 0.6);

    font-size: 1.3em;

}

Share this post


Link to post
Share on other sites

Posted · Report post

Awesome, thanks!

Also, the root cause of the 'changes not being reflected' issue was the fact that wp-super-cache was running, unintentionally (hence, changing the ID of the page made the site think it was 'new,' and not pull from the cache.)

Share this post


Link to post
Share on other sites

Posted · Report post

Excellent, I'm glad this worked for you. Yes whenever you're making changes we'd always advise you switch off any caching plugins so you can see the changes.

Share this post


Link to post
Share on other sites

Posted · Report post

The topic was marked as resolved.

Share this post


Link to post
Share on other sites

Posted · Report post

Hi there,

Both of the above questions will require custom Css, what Css have you been entering in the custom code field so far? We don't advise against entering any code into the core files as these could break the site or be wiped on updates.

Share this post


Link to post
Share on other sites

Posted · Report post

So far I've just tried popping in simple CSS targeting the footer, but clearly I'm overlooking something. Basically what I've put in resembles the following (what exactly should I be putting in?):

.footer {

background: #585858;

font-size: 8px;

}

That's essentially it, and a few other minor permutations. I'm surprised the option isn't in the theme itself.

Share this post


Link to post
Share on other sites