Jump to content
Sign in to follow this  
adsonwheels2012

How To Change Footer Font Size And Background Color?

Recommended Posts

adsonwheels2012    0
adsonwheels2012

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
James B    436
James B

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.


Kindly search the forum and read the documentation before posting. It will help you resolve many issues.

For CSS help be sure to check out W3Schools first and be sure to download FireBug for FireFox for troubleshooting.

James B

Share this post


Link to post
Share on other sites
adsonwheels2012    0
adsonwheels2012

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
James B    436
James B

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


Kindly search the forum and read the documentation before posting. It will help you resolve many issues.

For CSS help be sure to check out W3Schools first and be sure to download FireBug for FireFox for troubleshooting.

James B

Share this post


Link to post
Share on other sites
adsonwheels2012    0
adsonwheels2012

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
Rob    547
Rob

Try this:


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

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

    font-size: 1.3em;

}


Former PageLines Moderator, Food Expert and Raconteur

Share this post


Link to post
Share on other sites
adsonwheels2012    0
adsonwheels2012

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
James B    436
James B

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.


Kindly search the forum and read the documentation before posting. It will help you resolve many issues.

For CSS help be sure to check out W3Schools first and be sure to download FireBug for FireFox for troubleshooting.

James B

Share this post


Link to post
Share on other sites
James B    436
James B

The topic was marked as resolved.


Kindly search the forum and read the documentation before posting. It will help you resolve many issues.

For CSS help be sure to check out W3Schools first and be sure to download FireBug for FireFox for troubleshooting.

James B

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  

  • Similar Content

    • Barnaby Skinner
      By Barnaby Skinner+
      Hey all, hope I worded the topic correctly!
      I just need to know if either 1) I'm making a mistake or 2) this could be set as a new feature?
      Using the global settings typography parameters, I have a global paragraph font type (set using googlefonts) and have set the style to align:justify. When laying out <p> text inside a simple TEXT module, the <p> text adheres to both the font type and justification. Perfect.
      Now, when I set <p> text inside the PARAGRAPH TEXT field within an ELEMENT module, the <p> text adheres to the font type, but not the justification. It's rather annoying as I like to fully justify para text across the board and tend to use Element modules instead of text boxes for various reasons. It also seems silly that some PARAGRAPH TEXT fields adopt global settings, whilst other don't.
      Or I'm doing it wrong :S
      Any help or advice is much appreciated!
      Cheers
    • John Olsson
      By John Olsson+
      Hello,
      I wondering (and custumers) when does Font Awesome 4.7 comes with an update of Pagelines?
    • Houston Haynes
      By Houston Haynes+
      OK - folks - back with another nit... The "back to top" link works - BUT - it's only active (i.e. clickable with the associated action following) when the mouse-over hovers over the footer area of the page. I did a quick change of the z-depth (to -1) and nothing made a difference. Any thoughts on how to make the *entire* back-to-top icon hover-able/actionable? Thanks!
       

    • romanondrasek
      By romanondrasek
      hi all, I have some trouble using PL5 on my site. 
      I used plugins for event calendar (event on) and plugin (timetable responsive scheduler for WP) for schedule (classes) in the gym.
      The problem is, that post from this 2 plugins are shown without menu in header and footer. (I setup header and footer) in the page editor for all type of page. 
      When I create a lesson, it creates posts with slug (I have a slug "lekce" & event for events).
      I try to edit the post with PL editor, but editor is not opening on the post.

      Do you have some idea where should be some problem? Thanx so much.
      here are links for the sites :
      site with schedule :
      http://www.myfit.cz/rozvrh/
      site of one of the class (pilates)
      http://www.myfit.cz/lekce/pilates/
      site with calendar :
      http://www.myfit.cz/kalendar/
      7 side with one event from the calendar :
      http://www.myfit.cz/event/pilates-instruktor-akreditovana-licence/?ri=1
      when I have my site on DMS2 it was working :-(
       
       
    • Michael Kummer
      By Michael Kummer+
      Hi guys,
      I have been unsuccessfully trying to get my 3-column widgetized footer aligned centered. The widget section itself is aligned left because the alignment appears to be controller the widget's content only. The container that contains the widget section is aligned centered. I have chosen a 3 column layout and I added 3 widgets, assuming they would be aligned centered.
      Any idea of what I may be doing wrong?
      The page is question is: http://www.michaelkummer.com
      Thanks
      Michael
×