How to Edit Footer in WordPress [5 Visual Ways]

Blog Tutorials
Author
Zee Ahmed
President/CEO
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.

Do you want to edit the footer in WordPress? The good news is it’s effortless.

Not only I’ll show you how to edit, but also answer all your questions given at the end as FAQs.

Before I proceed, let me explain what the footer means for WordPress.

What is the footer in WordPress?

The “footer” in WordPress is the bottom area of your website. The footer generally contains information such as your contact information, social media links, phone numbers, links to important pages.

Let me explain with real-world examples.

  • Microsoft’s Footer

Microsoft’s official website’s footer contains five columns; each column is for a different purpose — Store, Education, Enterprise, Developer, and Company.

Microsoft Website Footer

  • Amazon’s Footer

Amazon’s footer is divided into four sections — well-written and easy to understand headings — Get to know us, Make Money with Us, Amazon Payment Products, and Let Us Help You.

Amazon Website Footer

  • One Smart Sheep’s Footer

Our company’s footer has a clear call to action button to convince clients to purchase our packages for building world-class websites for $49/month.

One Smart Sheep Footer

6 Ways to Edit WordPress Footer

There are several ways to edit a WordPress footer; I’ll explain the six most common ways.

Are you ready?

Let’s get started.

Way 0: Find Footer Section In the Documentation of a Theme

Finding the documentation is obvious, but many people ignore it.

Did you know?

There are more than 8,000+ WordPress themes, and each theme might have its way of customizing a footer.

WordPress Documentation For Footer Editing

You need to type the name of the theme along with the word documentation on Google. The first result is probably the right result, provided the theme is prevalent.

Your next job is to find the text Footer using Ctrl+F (Windows) or CMD+F (Mac).

Finding A Footer Section

I understand most WordPress themes have poorly written documentation and don’t explicitly explain how to edit a footer.

To overcome the issue, here is the visual guide that will help you.

Way 1: WordPress Customizer

Almost all the WordPress themes have the option to edit the footer using the built-in customize feature.

Firstly, click on the Appearance icon after you sign in to your WordPress website.

Apperance WordPress

Then, click on Customize.

Click Customize WordPress

You’ll come across many options. Look for Footer and click it.

Footer After Clicking Customizing

You’ll encounter plenty of Footer options that you can edit easily.

Footer Options In WordPress

For example, when I click Widgets, I can easily change the font size, font color, and much more with a few clicks.

Note: The method explained above doesn’t apply to each theme due to the nature of the theme. Few themes might not have the option to customize the footer from the Customize section of WordPress.

Way 2: Footer Widget Option

The second most common method to edit a footer is the widget option in WordPress.

You might be wondering what a widget in WordPress is?

A widget in WordPress is the block of content that you can add to your site to enhance the user experience.

How can you get to widgets? Easy.

Go to Appearance and click Widgets. You’ll discover dozens of widgets depending on your theme’s capabilities.

Widgets In WordPress

Widgets are divided into two sections: Left and Right.

The left section consists of widgets that you can use on your site. They’re not visible. On the other hand, the right section consists of widgets that are actively running on your site.

The best part?

You can drag and drop widgets from the left section to the right section to make them visible on your site.

If you want to edit any footer area, click on the Footer area to expand it and edit any part of it effortlessly.

Edit The Footer Area

Want to add something to the footer?

Just drag and drop the block from left to right, as shown in a video.

Some users might want to show the navigation menu separately for the footer.

Way 3: Upload a Footer Plugin

By the way, it’s recommended not to use a plugin for basic things that you can do without a plugin since plugins are the most common reason WordPress websites are hacked.

How WordPress Websites Are Hacked

If it’s the end of the world for you to use a plugin for editing the footer, then make sure:

  • You create a regular backup of your website frequently; daily is recommended.
  • You should enable auto-updates to all the plugins to receive the latest security updates.
  • You should use a plugin from the well-known developers that frequently update a plugin, at least once a month.

I’ll recommend installing the plugin “Remove Footer Credit,” trusted by 70,000 websites with a rating of 4.5 in order to edit the footer credit.

Remove Footer Credit In WordPress

Are you confused about how to install it?

It’s simple.

Go to Plugins > Add New > Search Remove Footer Credit > Install Now > Activate it.

Install The Plugin

After you have activated, go to Tools and click Remove Footer Credit.

Location Of Remove Footer Credit In WordPress

The plugin cannot only be used to remove the credit but also used to replace any existing content in your footer section.

For instance, you want to remove the credit, as shown above.

Remove The Credit

In order to remove “© 2020 DroiThemes. All rights reserved”,  you need to copy and paste precisely like that, but if it’s a link, you have to type separately.

Replace The Footer Credit

Once you’ve done Step 1 and Step 2, it will look like this:

Change The Footer

Moreover, you can add media like images or a video to make it more appealing to users, for example adding a social media icon.

Make sure you upload the PNG for the best user experience.

Adding Social Icons

Way 4: Edit the Footer.php Code

Footer.php in WordPress is the official part of WordPress theme development to build a footer. Without it, you cannot publish your theme, nor will it work properly.

Footer.php In WordPress

In order to edit it, simply navigate to Appearance > Theme Editor > Theme Footer.

WordPress Footer.php Location

When you click the Theme Footer, aka footer.php, you can view all the footer code.

You can easily edit any part of it, and it will reflect in the footer immediately upon saving it.

Don’t like your website’s footer at all?

Don’t worry; we wrote a footer code for you.

Simple copy and paste the below code into the footer.

Save Changes For Footer Templete

<style>

.site-footer

{

background-color:#26272b;

padding:45px 0 20px;

font-size:15px;

line-height:24px;

color:#737373;

}

.site-footer hr

{

border-top-color:#bbb;

opacity:0.5

}

.site-footer hr.small

{

margin:20px 0

}

.site-footer h6

{

color:#fff;

font-size:16px;

text-transform:uppercase;

margin-top:5px;

letter-spacing:2px

}

.site-footer a

{

color:#737373;

}

.site-footer a:hover

{

color:#3366cc;

text-decoration:none;

}

.footer-links

{

padding-left:0;

list-style:none

}

.footer-links li

{

display:block

}

.footer-links a

{

color:#737373

}

.footer-links a:active,.footer-links a:focus,.footer-links a:hover

{

color:#3366cc;

text-decoration:none;

}

.footer-links.inline li

{

display:inline-block

}

.site-footer .social-icons

{

text-align:right

}

.site-footer .social-icons a

{

width:40px;

height:40px;

line-height:40px;

margin-left:6px;

margin-right:0;

border-radius:100%;

background-color:#33353d

}

.copyright-text

{

margin:0

}

@media (max-width:991px)

{

.site-footer [class^=col-]

{

margin-bottom:30px

}

}

@media (max-width:767px)

{

.site-footer

{

padding-bottom:0

}

.site-footer .copyright-text,.site-footer .social-icons

{

text-align:center

}

}

.social-icons

{

padding-left:0;

margin-bottom:0;

list-style:none

}

.social-icons li

{

display:inline-block;

margin-bottom:4px

}

.social-icons li.title

{

margin-right:15px;

text-transform:uppercase;

color:#96a2b2;

font-weight:700;

font-size:13px

}

.social-icons a{

background-color:#eceeef;

color:#818a91;

font-size:16px;

display:inline-block;

line-height:44px;

width:44px;

height:44px;

text-align:center;

margin-right:8px;

border-radius:100%;

-webkit-transition:all .2s linear;

-o-transition:all .2s linear;

transition:all .2s linear

}

.social-icons a:active,.social-icons a:focus,.social-icons a:hover

{

color:#fff;

background-color:#29aafe

}

.social-icons.size-sm a

{

line-height:34px;

height:34px;

width:34px;

font-size:14px

}

.social-icons a.facebook:hover

{

background-color:#3b5998

}

.social-icons a.twitter:hover

{

background-color:#00aced

}

.social-icons a.linkedin:hover

{

background-color:#007bb6

}

.social-icons a.dribbble:hover

{

background-color:#ea4c89

}

@media (max-width:767px)

{

.social-icons li.title

{

display:block;

margin-right:0;

font-weight:600

}

}

</style>

<!– Site footer –>

<footer class=”site-footer”>

<div class=”container”>

<div class=”row”>

<div class=”col-sm-12 col-md-6″>

<h6>About</h6>

<p class=”text-justify”>One Smart Sheep <i> CODE WANTS TO BE SIMPLE </i> is an initiative  to help the upcoming programmers with the code. onesmart sheep focuses on providing the most efficient code or snippets as the code wants to be simple. We will help programmers build up concepts in different programming languages that include C, C++, Java, HTML, CSS, Bootstrap, JavaScript, PHP, Android, SQL and Algorithm.</p>

</div>

<div class=”col-xs-6 col-md-3″>

<h6>Categories</h6>

<ul class=”footer-links”>

<li><a href=”http://onesmartsheep.com/category/c-language/”>C</a></li>

<li><a href=”http://onesmartsheep.com/category/front-end-development/”>UI Design</a></li>

<li><a href=”http://onesmartsheep.com/category/back-end-development/”>PHP</a></li>

<li><a href=”http://onesmartsheep.com/category/java-programming-language/”>Java</a></li>

<li><a href=”http://onesmartsheep.com/category/android/”>Android</a></li>

<li><a href=”http://onesmartsheep.com/category/templates/”>Templates</a></li>

</ul>

</div>

<div class=”col-xs-6 col-md-3″>

<h6>Quick Links</h6>

<ul class=”footer-links”>

<li><a href=”http://onesmartsheep.com/about/”>About Us</a></li>

<li><a href=”http://onesmartsheep.com/contact/”>Contact Us</a></li>

<li><a href=”http://onesmartsheep.com/contribute-at-onesmartsheep/”>Contribute</a></li>

<li><a href=”http://onesmartsheep.com/privacy-policy/”>Privacy Policy</a></li>

<li><a href=”http://onesmartsheep.com/sitemap/”>Sitemap</a></li>

</ul>

</div>

</div>

<hr>

</div>

<div class=”container”>

<div class=”row”>

<div class=”col-md-8 col-sm-6 col-xs-12″>

<p class=”copyright-text”>Copyright &copy; 2021 All Rights Reserved by

<a href=”#”>onesmart sheep</a>.

</p>

</div>

</div>

</div>

</footer>

It will look like this:

Footer Templete

You’re free to edit any part of the content, from text to links. It’s pretty easy to modify.

Change the followings:

  • Replace the brand name from One Smart Sheep with your brand name.
  • Replace your website links from Onesmartsheep.com to your website name.
  • Replace the categories text and link as per your requirements.

Frequently Asked Questions About Footer in WordPress

1. How to Change Footer Color in WordPress

Changing the footer color is pretty easy, provided you know the basics of HTML and CSS.

Let’s say we want to change the color of the footer.php from black to orange.

Black Footer

Instead of finding the right class for the background color, we can use inspect elements.

See the short video of how I did it.

I simply activated the inspect element of Chrome, went to the footer, selected the item that I wanted to change, clicked the background color and changed it to yellow, and pasted the yellow color’s value to the footer.php’s CSS value, site-footer.

Footer Color Changed It To Yellow

Most themes have the option to change the font color and background color from the customer settings. Go to Appearance > Customize.

Customize WordPress Settings

Find the footer section.

Footer Section

Now you can simply change the background color if the option is visible to you.

Change The Background Of Footer

Don’t forget to select a color to change for the footer background.

Simply Select A Color And Change It

2. How to Edit Footer Content in WordPress

You can use several ways in order to edit the footer content, but the most potent way is to edit the footer.php as I depicted in Way 4.

The reason is that you have complete control over your footer, from text to content to images.

But a few themes use a lot of classes that make the vital content invisible.

For example, like this:

Footer

If this is the case, you have two ways:

  • Delete the whole footer.php code and paste the code I showed in Way 4. You can easily edit any content because you have the ultimate control over it.
  • Learn HTML, CSS, JS, and PHP to create a stunning visual footer yourself.

But don’t worry, most WordPress themes enable you to edit the footer content from text to images using the Customize feature and using the built-in theme features.

First, go to Appearance > Customize > Footer. Click it to edit the content.

Footer Section

In some themes, the footer content can be edited using the Menu section only in WordPress.

 

You need to go to Appearance > Menu > select the desired footer from the drop-down menu and make changes.

Change The Footer Content

3. How to Edit Footer in WordPress Elementor

Elementor is a famous website builder that allows users to create and edit websites using the drag and drop method.

Editing the footer in WordPress Elemento is tricky since thousands of themes support Elementor, and each theme comes with its customizations.

I’ll explain two ways: Elementor pre-installed template and Elementor’s block.

  • Elementor Pre-Installed Template.

Editing the footer in Elementor’s pre-installed template is the most straightforward job in the world. First, create a new page in WordPress for Elementor. Once done, click the Elementor button.

Create A New Page In WordPress For Elementor

Make sure you’ve selected the page layout to Elementor Canvas. Click the Folder icon.

Elementor Canvas

Click on any of the templates you want to import. You need to give a name to the template; basically, a page is created for Elementor.

Insert The Templete

Once down, scroll down to the bottom page of the page, aka the footer, to make any amendments.

Just Click Any Element To Edit Footer In Elementor

  • Elementor Block Footer

Unfortunately, all the blocks for the footer area require the Pro version of Elementor.

When you click the folder icon, go to the block section and select Footer from the drop-down menu.

Import Footer Block In Elementor

Once the block template is imported, you can modify any text and image with ease.

Easily Edit Elementor Footer Block

4. How to Edit Footer in WordPress Divi

Editing footers is one of the most straightforward jobs, as well.

Visit your homepage after you sign in to WordPress and click Enable Visual Builder.

Click Enable Visual Builder

Just go to the bottom of the page, the footer, and click on any block to edit it.

Edit The Text

For example, you want to edit the big text shown in the below screenshot, click the Settings icon, and type anything.

Editing Footer In Divi

If you’re not a fan of this way, don’t worry, you can adopt another way.

Again go to your homepage and click Edit Page.

Edit Page

After it’s loaded, scroll down to the footer section. You can see plenty of blocks, all you need to click the Settings icon.

Footer Location In WordPresss Page

For example, you want to edit the social links in the footer, click the settings icon of Social Media Followers, and insert your social media links.

Edit Social Media In Footer

5. How to Edit Footer in WordPress Avada

Avada is one of the most selling WordPress themes in history — earned a revenue of 39 million dollars.

Did you know that 1.4 million websites in the world are using Avada?

Avada Usage

Due to the amount of money it has generated, Avada offers effortless customization for footers.

Once you have imported your demo, go to the homepage and click Live Edit.

Edit Live In Avada

Scroll down to the bottom of the page, aka the footer, and click the centered black icon.

Edit Footer Layout In Avada

You can click on any element in the footer to make changes effortlessly.

Footer Edit In Avada

Don’t forget to save changes.

Save Changes To Avada

Did you know there is another way to edit the footer in Avada?

Go to Avada > Options > Footer and click Page.

Edit Avada In Options

You’ll be redirected to the Layouts page. Click Global Footer’s edit icon.

Global Footer In Avada

Now you can easily edit it.

Edit Easily The Footer

Once you click the pencil icon, you’ll get a pop up to make any adjustments.

Make Any Changes To Footer

That’s it.

6. How to Edit Footer Credits in WordPress

Before you edit the footer credit, make sure you’re allowed to modify the changes as per the rules of your agency and theme provider.

It might be against their terms and conditions if you modify the credit without their permission.

If you’re eligible, that’s great.

You can edit the footer credit using two ways:

  • Remove Footer Credit Removal Plugin

It’s the simplest way to edit the footer credit, but only the drawback is that using more plugins makes your site more vulnerable to hacking and makes your site slower.

If you’re creating a regular backup and have the best hosting, you don’t need to worry about it.

Simply install the plugin Remove Footer Credit.

Remove Credit In Footer

Go to Tools > Remove Footer Credit.

Remove Credit Line

In Step 1, type the line that you want to remove from your footer. In Step 2, enter your footer credit that will be replaced by the words you type in Step 1.

  • Modifying Footer.php

This method works without installing the plugin.

Simply go to Appearance > Theme Editor > locate Footer.php.

Find the copyright content and replace it with your content.

In the default Twenty Twenty-One theme for WordPress, the code looks like this:

Powered By WordPress Remove In WOrdPress

<div class=”powered-by”>

<?php

printf(

/* translators: %s: WordPress. */

esc_html__( ‘Proudly powered by %s.’, ‘twentytwentyone’ ),

‘<a href=”‘ . esc_url( __( ‘https://wordpress.org/’, ‘twentytwentyone’ ) ) . ‘”>WordPress</a>’

);

?>

</div><!– .powered-by –>

Change it to:

One Smart Sheep Copyright

And it will look like this:

Footer

7. Is It Legal to Edit the WordPress Footer?

Of course, it is 100% legal to edit WordPress footers since WordPress is open source in nature.

WordPress is licensed under the GNU General Public License, meaning you’re free to download, reuse, modify, and distribute any files.

According to the official documentation of WordPress, even if you purchase the paid theme of WordPress, you’re free to modify as you want.

WordPress Is Free

But, some agencies require special permissions to edit the footer credit. They can sue you if you go against the terms and conditions specified in the agreement.

Final Thoughts

As you have seen, editing a footer section in WordPress is straightforward in the majority of cases.

On the market, thousands of themes might have their way of modifying the footer section.

But the good news is that they all work on the same fundamental principle. The article can help you to modify any theme’s footer effortlessly.

Do you have any questions on your mind? I’ll be happy to answer them.