I’d earlier written about different ways to remove the footer of a WordPress post or page. The exact solution you need might work for one setup, and fail on another. However, since then, I’ve received questions from some people asking how to insert a footer into WordPress.
Turns out the same method used to remove a footer need not be the same one use to insert it. As before, we want to find a solution that works across all themes and doesn’t get wiped out whenever someone updates a theme file. As such, my preference is to use a function in a custom code plugin to protect against this eventuality.
So here’s how to insert a footer into a WordPress theme.
Add the Code to Your Functions File
Turns out that you can add footer content to your page just by pasting a few lines into your custom PHP plugin or functions.php. Here it is:
function insert_footer_function() {
echo '<p>Putting stuff into the footer area</p>';
}
add_action( 'wp_footer', 'insert_footer_function');
After you’ve saved your changes, you can see that the above line appears as shown here:
This is the TwentyTwenty theme from WordPress, and I haven’t removed the old footer. So you can see that the new one appears right at the very bottom of the page just before the <body> tag.
Styling the New Footer
One thing to note – the styling of the footer doesn’t match the styling of what the footer would have been. This is to be expected because most themes put the footer in a specific location that fits in with the overall look and feel of the site. So you can see in the screenshot above, the natural footer is indented or centered with the rest of the content, whereas the footer that we’ve just inserted just sits there unstyled.
Now of course, we can style it by putting in the appropriate HTML, but this will vary from website to website. However, one trick I’ve found, is that we can “cheat” by using the style that the previous footer had. We can do this by going to the browser’s development tools and highlighting the specific footer area to see the class of its container.
You can see from the screenshot below, that the class is “wrap”.
So now we can modify our code by giving our text the class “wrap” as shown here:
function insert_footer_function() {
echo '<p class="wrap">Putting stuff into the footer area</p>';
}
add_action( 'wp_footer', 'insert_footer_function');
Modify this function based on the class that your theme has. And now after you save your code and reload the page, here is what you see:
Now the footer is much more aligned, and likely fits into the framework of your site. From here, you can go further and start adding all the CSS classes that apply to your current footer. This way, it looks more natural, and less likely to stand out.
It’s that easy! Paradoxically, it seems that sometimes removing a footer can be much harder than adding a new one, since themes can make it hard to remove their own footers, but the process of creating a new one is standardized across all WordPress installations.
I’m a NameHero team member, and an expert on WordPress and web hosting. I’ve been in this industry since 2008. I’ve also developed apps on Android and have written extensive tutorials on managing Linux servers. You can contact me on my website WP-Tweaks.com!
Leave a Reply