Why Is My WordPress Header or Footer Not Showing? (And How to Fix It)

A missing WordPress header or footer doesn't automatically mean your layout was deleted. Usually the page is set to a blank template, an Elementor display condition is excluding it, or a stray CSS rule is hiding the section from view.

Before rebuilding your navigation from scratch, figure out what controls your site's header and footer: your main theme, the WordPress Site Editor (FSE), a page builder, or custom code in a child theme. Identifying the owner tells you exactly where to look.

Use this process to locate and fix missing headers and footers without losing your site's styling.

1. Determine if the issue is global or page-specific

Open your homepage, a blog post, a category archive, and the broken page in a private or incognito window (while logged out). Test on both desktop and mobile screens.

• If the header is missing everywhere: The problem lies in your global theme options, Site Editor, or a site-wide caching issue.
• If it disappears on only one page: Check that specific page's template settings and display conditions.
• If it fails only on mobile: Responsive visibility settings or media-query CSS rules are hiding the container.

2. Inspect the individual Page Template setting

Open the affected page in the WordPress block editor and check the right-hand panel under Page → Template.

Page templates named Canvas, Elementor Canvas, Blank Page, or Landing Page are designed specifically to strip away the theme's header and footer so you can build a standalone page. Switch the template back to Default Template or Full Width, save, and refresh your page to see if the layout returns.

3. Check the WordPress Site Editor (Block Themes)

If you're using a block-based theme (like Twenty Twenty-Four), headers and footers are managed through Appearance → Editor.

Navigate to Templates or Patterns → Template Parts and open the header or footer part. It's common for a header template part to exist in your library but be missing from the active layout (such as Single Posts or Pages). Make sure the Header block is inserted into the template, and ensure you save both the template part and the main template when WordPress prompts you.

4. Review your page builder's display conditions

If you use Elementor Pro, Divi Theme Builder, Bricks, or Beaver Builder, your builder handles header and footer rules independently of your theme.

Open your builder's template conditions and review rules like Entire Site, Include, and Exclude. A common culprit is an overlapping rule—for example, a custom landing page template set to "Include on All Pages" that overrides your default site header but has no content inside it.

In one case, a client's header disappeared because an Elementor Pro header template was set to Exclude on All Pages after a plugin update. The template still existed, but the condition excluded every page on the site. Resetting the condition to Entire Site fixed it instantly.

5. Confirm navigation menus and widget blocks still exist

Sometimes the header wrapper is rendering on the page, but it appears completely invisible because its contents were unassigned or wiped out during an update.

Go to Appearance → Menus (or inspect your Navigation Block in the Site Editor) and verify that your primary menu is assigned to the active theme location. If you recently changed themes, WordPress often unassigns menu locations and widget areas by default.

6. Clear every layer of caching and regenerate assets

Stale cache files often serve an outdated page structure even after you've fixed the template settings.

Clear all of the following in order:

1. Your WordPress caching plugin (WP Rocket, LiteSpeed Cache, W3 Total Cache, etc.)
2. Server or hosting cache (Cloudflare, Kinsta, WP Engine, SiteGround)
3. Page builder CSS assets (e.g., Elementor → Tools → Regenerate CSS & Data)
4. Your local browser cache

7. Check for responsive visibility toggles

Most modern themes and page builders offer responsive controls that allow you to hide specific sections based on screen size (e.g., "Hide on Desktop" or "Hide on Mobile").

If your desktop header disappeared after setting up a custom mobile menu, edit the header layout and ensure you didn't accidentally toggle off visibility for desktop screens. Drag your browser window gradually from wide to narrow to spot where the break occurs.

8. Inspect your CSS for hidden or overlapped elements

Right-click the top or bottom of your page and choose Inspect (Developer Tools). Search the DOM for <header> or <footer> tags.

If the elements are present in the HTML but invisible on screen, check your CSS inspector for properties like:

• display: none; or visibility: hidden;
• opacity: 0;
• z-index: -999; (which pushes the header behind your page background)
• Stray position: absolute; rules overlapping the section with main content

Disable recent custom CSS additions in your Customizer or child stylesheet to see if the header reappears.

9. Run a plugin conflict test

If your header vanished right after updating WordPress, your theme, or a plugin, an active script error may be interrupting page rendering before the header or footer HTML finishes loading.

On a staging site, temporarily deactivate recent plugins—specifically optimization, caching, header/footer builder, or multilingual plugins. If the section reappears, reactivate them one by one to isolate the culprit.

10. Audit custom theme files and PHP hooks

If you are working with a classic theme or custom child theme, verify that your template files (like page.php or index.php) still include the required PHP hooks:

<?php get_header(); ?>
<!-- Page Content -->
<?php get_footer(); ?>

Also confirm that wp_head() and wp_footer() calls exist in your header.php and footer.php files. Omitting these hooks prevents plugins and builders from rendering header and footer scripts properly.

Verify the cause before you rebuild

Before you spend hours rebuilding a header or footer from scratch, take five minutes to check the page template and builder display conditions. Those two settings account for the vast majority of missing layout issues.

Work systematically down the list—templates, display rules, caches, responsive controls, and CSS—and you'll almost always restore your layout without having to start over.