Header, footer, and sidebar templates in Wordpress - Step-by-Step Execution

Concept Flow - Header, footer, and sidebar templates

Start WordPress Theme

↓

Load header.php

↓

Render Header Content

↓

Load main template content

↓

Load sidebar.php

↓

Render Sidebar Content

↓

Load footer.php

↓

Render Footer Content

↓

Page fully rendered

WordPress loads header, main content, sidebar, and footer templates in order to build a complete page.

Execution Sample

Wordpress

<?php get_header(); ?>
<main>Main content here</main>
<?php get_sidebar(); ?>
<?php get_footer(); ?>

This code loads the header, main content, sidebar, and footer templates in a WordPress theme.

Execution Table

Step	Action	Template Loaded	Content Rendered
1	Call get_header()	header.php	Header HTML output
2	Render main content	N/A	Main content HTML
3	Call get_sidebar()	sidebar.php	Sidebar HTML output
4	Call get_footer()	footer.php	Footer HTML output
5	Page complete	N/A	Full page HTML ready

💡 All template parts loaded and rendered, page output complete.

Variable Tracker

Variable	Start	After Step 1	After Step 2	After Step 3	After Step 4	Final
header_loaded	false	true	true	true	true	true
sidebar_loaded	false	false	false	true	true	true
footer_loaded	false	false	false	false	true	true
page_content	empty	header HTML	header + main HTML	header + main + sidebar HTML	header + main + sidebar + footer HTML	full page HTML

Key Moments - 3 Insights

Why does get_header() load before main content?

Because WordPress expects the header template to be output first to set up the page structure, as shown in execution_table step 1.

What happens if get_sidebar() is missing?

The sidebar content won't appear, but the page still renders header, main, and footer as seen in execution_table steps 1, 2, and 4.

Can footer.php be loaded before sidebar.php?

No, the typical flow loads sidebar before footer to maintain page layout order, as shown in execution_table steps 3 and 4.

Visual Quiz - 3 Questions

Look at the execution_table, what template is loaded at step 3?

A header.php

B sidebar.php

C footer.php

D main content

💡 Hint

Check the 'Template Loaded' column for step 3 in execution_table.

At which step is the footer.php template loaded?

A Step 2

B Step 3

C Step 4

D Step 5

💡 Hint

Look at the 'Action' column in execution_table for when get_footer() is called.

If get_sidebar() is removed, which variable in variable_tracker stays false after step 4?

A sidebar_loaded

B footer_loaded

C header_loaded

D page_content

💡 Hint

Check the 'sidebar_loaded' row in variable_tracker to see when it changes to true.

Concept Snapshot

WordPress templates load in order: header.php, main content, sidebar.php, footer.php.
Use get_header(), get_sidebar(), get_footer() functions to include these parts.
Header sets up page start; footer closes it.
Sidebar adds extra content alongside main.
Missing parts still render page but layout changes.

Full Transcript

In WordPress themes, pages are built by loading template parts in a specific order. First, the header.php file is loaded using get_header(), which outputs the top part of the page including navigation and site title. Next, the main content is rendered directly in the template file. Then, get_sidebar() loads sidebar.php, which usually contains widgets or extra links. Finally, get_footer() loads footer.php to output the bottom part of the page. This flow ensures the page structure is complete and consistent. Variables like header_loaded, sidebar_loaded, and footer_loaded track which parts have been included. If a part like the sidebar is missing, the page still shows but without that section. Understanding this order helps in customizing WordPress themes effectively.