Footer Padding

I have 3 widgets showing in my site footer but there seems to be large areas of passing applied above and below all the widgets (95pxs each). I want to have control of this padding and reduce wasted space on screen within the footer.

What is the easiest way to control this padding?

Thanks!

Hello there,

To manage the top/bottom spaces in the footer widgets area, you can use this CSS code:


.footer-widgets {
  padding-top: 5px;
  padding-bottom: 5px;
}

To apply to your site, add it into Appearance > Customize > Additional CSS in your site dashboard.

Regards,
Kharis

Kharisblank,

You have helped me on some other feature changes, thank you. I have this issue above, made CSS change but it only seems to apply on front page. You can see all the links and footers moved up near last row. On my other pages it doesn’t seem to apply. See here-
www.dodgecoupons.com

how do I fix the footer padding across all pages to match front page?

Hello there,

Please try this code:

    .footer-widgets {
      padding-top: 5px !important;
      padding-bottom: 5px !important;
    } 

Then clear/flush any applied cache before reloading your site to see if it takes any changes.

Regards,
Kharis

Thanks Kharis for your help, one question on the string below, someone else provided a CSS code for making the front page slider at 400PX instead of full page…

I tried your fix on Sydney free edition that you mention and its not working…thanks in advance
.sydney-hero-area, .slides-container .slide-item {
height: 400px;
}

www.dodgecoupons.com

Hello there,

It looks like you’ve already accomplish it with this code as you choose header image instead of slider.

.header-image {
    height: 480px;
} 

Am I correct? Please advice.

Regards,
Kharis

I switched it back to the image header as the slider header CSS code didn’t work on front page full page slider and since I’m using the front page as template for other pages it changed that format and pushed down the rest of widgets though I had no header images selected. I like the idea of the sliders being 450-500 on the front page but again with the other pages created with front page format the CSS changes is causing issues on all pages…

Hello there,

To reduce the main slider height, please refer to this discussion.

Regards,
Kharis

I tried that Script via Footer plug in and WordFence rejected it on each try

Hello there,

Try doing these steps, please:

  1. Install and activate the TC Custom JavaScript plugin
  2. Go To Appearance > Custom JavaScript
  3. Paste the following code into the provided box
    (function($){
          
      $(window).on('load resize', function() {

        var slideHeight = $('#slideshow').height();
        var newHeight = slideHeight-150;

        $('#slideshow').height(newHeight);
        
      });

    })(jQuery);
  1. Update

Regards,
Kharis

Kharis, See www.auditmybdc.com

The script is working though it loads full length sometimes and then reverts to half page setting in place. I noticed on the smartphone upon scrolling down the page gets stuck in full screen mode. Any ideas if their is something to keep this from happening on mobile and also the reversion to full screen on pc screen. Seems to be the java script itself…

Hello there,

Please try the code posted here in docs. Clear any applied cache after applying new code, as it usually won’t load recent changes due to older code is being cached. https://codex.wordpress.org/I_Make_Changes_and_Nothing_Happens

Regards,
Kharis