Back to Community
Home / Community / Theme → Twenty twenty-one

How to Customize the Footer in Twenty Twenty-One: A Complete Guide

19 threads Sep 16, 2025 Theme → Twenty twenty-one

Content

The Twenty Twenty-One theme offers a clean, modern design, but many users find its footer customization options to be a common point of confusion. Unlike some themes, it doesn't provide a visual footer editor in the Customizer, leading to questions about how to add, remove, or rearrange elements like copyright text, privacy policy links, logos, and menus.

Why This Happens

The Twenty Twenty-One theme is designed with a block-based approach, but its footer structure is more traditional. The main content area above the dividing line is a widget-ready section, while the area below the line (containing the site title, logo, and "Powered by WordPress" credit) is hardcoded into the theme's footer.php template file. This separation is why you can't simply click to edit the entire footer like a block.

Common Solutions for Footer Customization

1. Adding Content to the Footer Widget Area

The simplest way to add content like text, a copyright notice, or a privacy policy link is to use the built-in footer widget area.

  1. Navigate to Appearance → Widgets in your WordPress dashboard.
  2. Locate the "Footer" widget area.
  3. Add a "Text" widget or any other block-based widget to this area.
  4. Insert your desired content, such as a copyright notice (© 2024 Your Site Name) or a link to your Privacy Policy page.
  5. Use the alignment options within blocks (e.g., Paragraph blocks) to center or right-align text.

2. Adding a Social Menu to the Footer

Twenty Twenty-One has a specific feature for social icons.

  1. Go to Appearance → Menus.
  2. Create a new menu and assign it the "Social" location.
  3. Add menu items using the URLs of your social profiles (e.g., https://facebook.com/yourprofile).
  4. The theme will automatically replace the text of common social links (like "Facebook" or a "Kontakt" email link) with their corresponding icons. To prevent this for a specific link, you may need to use custom code to unhook the social icon function.
  5. This social menu will appear in the footer widget area. You can adjust its appearance (e.g., icon color, size) with CSS in the Appearance → Customize → Additional CSS section.

3. Modifying or Removing the Lower Footer Section

The lower section (below the line) contains the site name, logo, and "Powered by WordPress" credit. To change this, you have two primary options:

Option A: Using CSS (Quick Fix)
You can hide elements using CSS without altering theme files. Add the following to Appearance → Customize → Additional CSS:

  • To hide the entire lower footer, including the line: .site-footer > .site-info { display: none; }
  • To hide only the site name and logo but keep the "Powered by WordPress" credit: .site-footer .site-name { display: none; }
  • To hide only the "Powered by WordPress" credit: .site-footer .powered-by { display: none; }

Option B: Using a Child Theme (Recommended for Advanced Changes)
For permanent changes that survive theme updates, such as replacing the logo with a menu or completely rewriting the footer HTML, creating a child theme is the best practice. This involves:

  1. Creating a child theme for Twenty Twenty-One.
  2. Copying the parent theme's footer.php file into your child theme directory.
  3. Editing the copied file to add, remove, or rearrange the hardcoded elements.

4. Aligning Footer Elements

Aligning widgets or the hardcoded footer content requires CSS. The exact CSS needed depends on your specific layout goals. For example, to center the entire lower footer section, you could use a rule like .site-info { text-align: center; }. For more complex layouts involving multiple widgets, you may need to use CSS Flexbox or Grid properties.

Conclusion

Customizing the Twenty Twenty-One footer typically involves a combination of using the Footer widget area for the upper section and using CSS or a child theme to modify the lower, hardcoded section. For most users, the widget area and Additional CSS panel provide enough flexibility to achieve a personalized footer without editing core theme files.

Related Support Threads Support