How to Add Space In Footer On WordPress

Click Image To Be Taken To Video on

How to Add Space In Footer On WordPress

Hey there, Vaughn Bullard here again! Ever wondered why you don’t have enough space in your footer? Well, maybe it’s not your fault! Maybe your using a free theme from the WordPress theme repository or you just didn’t think of it when you designed your site. Either way, you need the ability to add some extra space. I’m gonna show you how to do it the right way.

So check out this page. We’ve got a decent amount of space, but we might want to add some more. So we’re gonna change the amount of space by editing the theme’s stylesheet.

We’re gonna go to the WordPress administration pages. This is done by typing in the url of your blog followed by forward slash wp-admin. You will be prompted for your administrative username and password. Type that in and press the “Login” button.

So we’re gonna go all the way to the down to the bottom of our administrative menu. We’re gonna hover over this “Appearance” menu and up will pop the hover menu and we’re gonna choose “Editor”. This will obviously bring up the “Edit Themes” administrative page. You will select the stylesheet.css file to edit.

Now let’s flip back over to the home page. What we can do is to what’s called “Inspecting an element”. Now I am using Safari, but this can also be done on Google Chrome, Opera, Firefox and Microsoft Internet Explorer. Inspecting an element exposes the raw HTML code that has the element information we need. In this case, the footer is wrapped around an element called “site-info”. Keep that element name in mind as we flip back to our stylesheet editor.

So what we’re gonna do is do a search for that element called “site-info”. Here we go. Now we’re gonna add a line in the selector here. We’re gonna change the height of that footer by editing the site-info element. Here we enter height, then colon, ohhh, then let’s give it some off the wall height like say 800 pixels and then follow that with a semicolon. Now we click “Update File”.

Great, now that’s saved! So let’s flip back on over to our WordPress home page. Click refresh or reload on our home page. Scroll all the way back down to our footer and voila, our footer height has been changed!

TIP: Sometimes your changes won’t seem like they’ve taken place. If this is the case, clear your browser cache, then click reload.

That’s just how easy it is folks! For more info on doing other cool things with WordPress, check out my other WordPress Lessons on and check out Build.Automate’s innovative WordPress plugins at

The following services are out of scope for our managed WP Pro Support plans. If you don’t see it, call us, we offer a ton of services that can be done once or on a regular schedule.



Pin It on Pinterest

Share This