How to Change Footer Text and Background Color in WordPress

Are you wondering how to change the footer text and color in WordPress? If that’s the case, then you’ve landed on the right page.

Although footers are usually overlooked areas of a website, it’s extremely important for site navigation. However, it can be made stunning in several ways. All you need to edit it and do some tweaks to make changes to its text, color, and background.

Having said that, you might still be curious about how to change the footer text and color in WordPress. Don’t be concerned! A thorough handbook has been prepared specifically for you.

Therefore, we’ll go through different ways to change footer color and text in WordPress within this article. Let’s get rolling!

What is a Footer on a WordPress site?

Footer is usually the bottom part of the WordPress website that comes after the main content. It serves as the conclusion of the overall website as it completes the entire design, something like the final slide.

As we know, footers aren’t as exclusive as headers of the website, regardless, it’s immensely important to create a distinct footer. So, WordPress mostly offers the unique footer functionality that comes with your theme.

Moreover, with stunning footers, you can make it simple for your visitors to navigate your website easily. Also, it’ll be useful for those visitors who are interested in and dug deep into your content. 

Further, the WordPress footer comes with the default design. You can edit it to include different colors, fonts, and backgrounds. Also, you can insert essential links, information, blog posts, security badges, forms, and more.

Did you accidentally land up here? And are you planning to build a website of your own? Then, check our comprehensive and beginner-friendly article on how to create a website.


Importance to Have Footer on Website

Before moving to the different ways to change the color and text in WordPress, let’s discuss the reasons for it.

  • Improves SEO: With the help of important links on your footer, the SEO of your website will be enhanced. Because the number of external and internal links determines SEO rankings. 
  • Builds Trust: You can include prominent awards, reliable certificates, security tags, etc. on your footer area. This makes customers feel your site is trustworthy. 
  • Branding: Footer is an ideal place on the website to display your company name, logo, and tagline. This reinforces the brand identity of your company to the customers.
  • Establish Communication: Footer provides a line of communication with your visitors. Because you can include interactive elements like contact form, location info, contact details, etc. 

With that, now let’s dive into the different ways!


How to Change Footer Text & Background Color in WordPress?

We’ve enlisted some of the easiest ways to change the footer text and color on the WordPress website. So, let’s start!

Method 1: When Using WordPress Theme Settings

One of the easiest methods to change the text and background color in WordPress is using its theme settings.

Let’s get into our ride!

For Footer Text

First of all, we’ll be editing the footer text in 3 different ways. Let’s go!

I). Using Theme Settings

In this method, we need to have a theme. So, for that, we’ll be using the Astra theme to take as an example. If you are using a different theme than Astra, you can also follow a similar way. Or follow the theme documentation of that particular theme.

Therefore, for this tutorial, we’ve already installed and activated the Astra theme. Now, let’s get back to business!

Go to your WordPress dashboard and click on Appearance>Customize

Customizing Astra Theme
Customizing Astra Theme

Then, you’ll be redirected to the editing panel. On the customization options, look for the footer option. On the Astra theme, you can find the Footer Builder option. Simply, click on that!

Footer Builder in Astra Theme - How to Change Footer Color and Text WordPress
Footer Builder in Astra Theme

After that, you can see the Copyright option under the Elements tab.

Click on the Copyright Option
Click on the Copyright Option

Once you click on the Copyright option, you can find copyright text. The text is written as “Copyright © 2022 Numberless Afternoon | Powered by Astra WordPress Theme”

Copyright Text
Copyright Text

You can simply edit the text or completely remove it as per your choice. For now, we’ve changed the text to “Copyright © 2022 Numberless Afternoon | All Rights Reserved”. After changing the text, you can instantly see the changes on your footer on the customizer as well. Also, don’t forget to click on the Update or Publish button at the top after making changes to save them.

Edit the Copyright Text - How to Change Footer Color and Text WordPress
Edited the Copyright Text

That’s it! Editing your footer text is way easier than you think with this method, right?


II). Using Page Builder (Elementor)

In this section, we would give you a tour of how to edit the footer text using the page builder. For this method, we’ll be using the Elementor plugin. However, note that you’ll need the Pro version of the Elementor plugin to use this feature. So, make sure that you have the premium Elementor.

For that, you need to log in to your WordPress dashboard and go to the Plugins>Add New

Add a New Plugin in WordPress Dashboard
Adding a New Plugin

After that, go to the search bar and enter “Elementor”. Once you’ve found the plugin, click on the Install button. 

Installing the Elementor Plugin
Installing the Elementor Plugin

After the installation is completed click on the Activate button. 

Activating Elementor Plugin
Activating Elementor Plugin

Now, you can select any of the premium pricing plans of Elementor and upgrade it to the pro version. For reference, check how to purchase and install the premium version of a plugin from our guide.

After upgrading the premium version, go to the Templates menu of your dashboard and click on the Theme Builder option.

Theme Builder - How to Change Footer Color and Text WordPress
Theme Builder of Elementor Plugin

Following that, you can see all the parts required for your website.

All Parts of Website Shown by Theme Builder
All Parts of Website Shown by Theme Builder

From there, you need to go to the Footer part. And, you can see various footer templates that you can install. 

Footer Templates - How to Change Footer Color and Text WordPress
Surf Through Footer Templates

You can explore those templates and click on the Insert button of your preferred ones. 

Inserting Template
Inserting Template

After inserting the template, you’ll be redirected to the editor panel of the Elementor.

Elementor Editing Panel - How to Change Footer Color and Text WordPress
Redirected to the Elementor Editing Panel

Now, click on the text you want to edit and you can find an edit icon. Click on that icon and on the left side, you can see that text is under the Title box, written as “All Rights Reserved”.

Title Box to Edit the Footer Text
Title Box to Edit the Footer Text

From there, click on the text, and edit those text with the preferred ones. For example, we’ve changed it to “Powered by WordPress”.

Edited Text - How to Change Footer Color and Text WordPress
Edited Text

So, this is how you can edit your footer text effortlessly.


III). In Block Themes (Full Site Editing Themes)

Yet another method we would like to recommend to our users is to edit the footer text using Block themes. You can use any of the Full Site Editing  (FSE) themes. However, for this tutorial, we’ve already installed and activated the Twenty Twenty-Two theme. 

Next, go to the Appearance option of your WordPress dashboard. Then click on the Editor (beta) dropdown option. 

Editor Option of Twenty Twenty Two Theme
Editor Option of Twenty Twenty Two Theme

Now, you’ll be redirected to the editor interface where you can edit any of the elements of this theme.

Editor Interface of Twenty Twenty Two Theme
Editor Interface of Twenty Twenty Two Theme

So, to edit the footer text, scroll down below and click on the text you want to edit. If you want to edit the “Proudly Powered by WordPress” text, then simply click on that text, and write the text of your choice. 

Text Editing in Twenty Twenty Two Theme
Text Editing in Twenty Twenty Two Theme

We’ve changed the text to “All Rights Reserved” which is shown in the below snapshot.

Changing the Footer Text - How to Change Footer Color and Text WordPress
Changing the Footer Text

You can also remove the entire “Proudly Powered by WordPress” text. If you want to do so, then click on that text and go to the settings options as shown below:

There you can find a Remove Paragraph option. Just click on that option and that text will disappear. 

Removing an Entire Footer Text
Removing an Entire Footer Text

So, that’s how easy it’s to edit or remove the footer text.


For Footer Background Color

In this section, we’ll be editing the background color of the footer in 3 different ways similar to the footer text. So, let’s move!

I). Using Theme Settings

In this method, we’ll be using the Astra theme to change the background color similar to editing the footer text.

Since we’ve already installed the Astra theme, just go to your WordPress dashboard and click on Appearance>Customize. Now that you’re in the customization interface, go to the Footer Builder option. 

After that, click on the Edit icon on the footer. 

Go to the Edit Icon - How to Change Footer Color and Text WordPress
Go to the Edit Icon

Then, you can see various options under the General tab. But you need to click on the Design tab where you can find the Background option.

Background Option Under Design Tab
Background Option Under Design Tab

Now, click on the background option and you can find a range of color options. To change the color of your choice, you can simply click on any color or drag the slides to make it a precise color. 

Slide Colors to Pick Suitable One
Slide Colors to Pick Suitable One

Alternatively, you can also edit the color code. For that click on the color picker on the right side, and you can write your color code. 

Edit Color Code - How to Change Footer Color and Text WordPress
Edit Color Code

Now that you’ve changed the color, don’t forget to click on the Publish or Update button at the top. 


II). Using Page Builder (Elementor)

As you know, we’ve already installed the Elementor page builder to edit the footer text. So, we’ll be using the same page builder to change the footer background color as well. 

Simply, go to the Templates>Theme Builder from your WordPress dashboard. Then, go to the Footer parts, and insert the footer of your choice. 

Once the footer is inserted, click on the whole footer layout, and you’ll see the blue-colored border. There, you need to click on the middle icon which is between the + and x icons. That middle icon is the edit section icon.

Click on Edit Section Icon
Click on Edit Section Icon

Then, you’ll find different options under the Layout tab. However, all you need to do is go to the Style tab. Under the Style tab, go to the Background option. 

Background Option - How to Change Footer Color and Text WordPress
Background Element

There, you can find the Background Type element from which you need to select the Classic icon. 

Background Type for Changing Footer Background Color
Background Type for Changing Footer Background Color

After clicking on the Classic icon, you can finally see the Color element. Then, click on the icon which is on the right side of the Color element. From there, you can select the global colors. 

Global Color Options To Choose Color
Global Color Options To Choose Color

Once you’ve selected the color, you can also make your color more precise by clicking on the color picker. There, you can directly click on the color of your choice, or write the color code. 

Color Picker in Elementor Plugin
Color Picker in Elementor Plugin

Thus, you can instantly see the background color of the footer which is changed after your color selection. 


III). In Block Themes (Full Site Editing Themes)

We’ve already installed and activated the Twenty Twenty-Two theme. So, we’ll be using the same theme to change the background color of the footer as well.

Thus, all you need to do is go to your WordPress dashboard and click on the Appearance option. After that, go to the Editor (beta) option within the dropdown menu of Appearance. 

Following that, you’ll go to the editing interface. Within that interface, scroll down below and click on the footer block.

Once you’ve clicked on the footer block, now go to the top right of your editing interface, and click on the settings icon. 

Footer Block - How to Change Footer Color and Text WordPress
Go to Footer Block and Click on Settings Icon

There, you can see various options of settings. Among them, click on the Background option. After that, it comes with different color options. Click on your preferred color and you can see the changes in the background color of your footer instantly.

Changing Background Color
Changing Background Color

Thus, you can change your background color quickly by using the block theme.


Method 2: Editing Themes File 

This is yet another possibly easy method for those who have basic coding knowledge as we’ll be editing the themes file. However, this method is quite not recommended to beginners.

Here, we’ll be editing the backend part and tweaking some codes. So, for this, we’ll be using the default theme of WordPress, i.e. Twenty Twenty theme. We can use this theme to edit the footer text as well as its background color. 

You need to note that, while editing the code, we recommend you to use the child theme. Because using the parent theme directly could break your site and changes may be lost in future updates. So, this can be avoided by editing the child theme.

Now, let’s move toward our agenda!

I). For Footer Text: footer.php

Here, we’ll be editing the footer text via the theme file editor. So, to access your theme file editor, go to your WordPress dashboard and click on Appearance>Theme File Editor.

Theme File Editor of Twenty-Twenty
Theme File Editor of Twenty-Twenty

Next, you’ll see the code editing interface. Then, on your right, there is a Theme Files. From there, go to the class and click on the footer.php file. 

Access footer.php File - How to Change Footer Color and Text WordPress
Access footer.php File

Remember, you can access this file on only this theme. Different themes have different files and template parts. So, you can search this file on your theme which can have different places.

Now, in the code editor, you can see a few lines of code. You can simply go through the code and find out the text you want to edit. 

Alternatively, if you want to avoid such hassle, then simply click CTRL + F on your keyboard. And the search bar will appear. There, just write the starting word of the text you want to edit. Then, you can see the highlight of that word on your lines of code.

For example, we’ve typed “Powered” as we want to edit the text “Powered by WordPress”.

Now that we’ve found the text we want to edit, check out the snap below. There, we’ve highlighted the text where you can add yours. 

Search the Initial Text Using Keyboard Shortcut
Search the Initial Text Using Keyboard Shortcut

Since we’ve found the place where we can edit ours, we’ve added the replaced “Powered by WordPress” text with “All Rights Reserved”. You can replace it with your text as well. Now, that you’ve edited the text on your code editor, don’t forget to click on the Update File button.

Edit the Footer Text in Code Editor
Edit the Footer Text in Code Editor

Following that, visit your site and check the footer text to make sure that the edited text appears on your front end. 

Preview the Edited Footer Text
Preview the Edited Footer Text

Definitely, a convenient method, isn’t it?  


II). For Footer Background Color: style.css

To edit the background color, the first few steps are similar to that of editing the footer text. Go to your WordPress dashboard, and click on Appearance>Theme File Editor. Then, on the Theme Files, look out for the style.css file which is usually at the top. Once you’ve found the file, click on it and you can see a lot of code on your code editor.

Access style.css-File - How to Change Footer Color and Text WordPress
Access style. CSS-File

Now, on the search bar, you can look for the background color of the footer section. On the theme Twenty Twenty, you can search by typing “#site-footer”. There, you can see the code written for the background color

Color Code for Footer Background Color
Color Code for Footer Background Color

Simply, change the code or type the color name like red, blue, etc. We’ve written “red” as the background color of the footer. After changing that, click on the Update File button.

Changing the Background Color Code
Changing the Background Color Code

Now that you’ve changed the background color, you can see how your front-end preview appears in the following snapshot.

Preview the Changed Background Color of Footer
Preview the Changed Background Color of Footer

Thus, this is how you change the background color using the theme file editor.


Conclusion

That’s all folks! We’ve arrived at the end of this article. 

We’ve discussed different methods on how to change footer color in WordPress. Now, you can easily change footer color and text in your WordPress site using any of these easy methods. 

We recommend you to go to the “Using Theme Settings” method for changing both the footer text and background color in WordPress. This method is easier and more convenient to use. Most of all, anyone, even beginners, can quickly change them. 

Also, if you’ve tried any of these ways mentioned above, then do leave us a comment below and your experience regarding the method.

In case you’ve any more queries about changing footer color and text in WordPress, then feel free to ask us. We’ll get back to you as soon as possible. Also, share this article with your friends and colleagues. 

Also, do check out our article on how to add images side by side in WordPress Gutenberg & how to add a logo slider in WordPress.

Don’t forget to follow us on Facebook and Twitter for more helpful articles.

Updated on

Leave a Reply

Your email address will not be published.

Join our Community, Don't Miss an Update!

Get the latest posts and blogs directly to your inbox. Subscribe to our newsletter. Don't worry! We won't spam you like others.