Template parts in Wordpress - Step-by-Step Execution

Concept Flow - Template parts

Start: Main Template File

↓

Call get_template_part()

↓

Locate Template Part File

↓

Load Template Part Content

↓

Insert Content into Main Template

↓

Render Full Page

The main template calls get_template_part(), which loads a smaller template file and inserts its content into the page.

Execution Sample

Wordpress

<?php get_template_part('header'); ?>

This code loads the header.php template part and inserts its content where called.

Execution Table

Step	Action	File Targeted	Result
1	Main template starts rendering	index.php	Page rendering begins
2	Call get_template_part('header')	header.php	Look for header.php file
3	Load header.php content	header.php	Header HTML loaded
4	Insert header content into main template	index.php	Header appears at call location
5	Continue rendering rest of main template	index.php	Page completes rendering

💡 All template parts loaded and inserted, page fully rendered

Variable Tracker

Variable	Start	After Step 2	After Step 3	After Step 4	Final
current_template	index.php	header.php	header.php content loaded	header.php content inserted	full page content

Key Moments - 2 Insights

Why does get_template_part('header') look for header.php?

Because get_template_part() adds '.php' automatically and looks in the theme folder for that file, as shown in step 2 and 3 of the execution table.

What happens if the template part file is missing?

The function will not insert content, so the page will render without that part. This is implied by the file lookup step in the execution table.

Visual Quiz - 3 Questions

Look at the execution table, what file does get_template_part('header') try to load?

A header.html

B index.php

C header.php

D footer.php

💡 Hint

Check Step 2 and 3 in the execution table where the file targeted is header.php

At which step is the header content inserted into the main template?

A Step 2

B Step 4

C Step 3

D Step 5

💡 Hint

Step 4 says 'Insert header content into main template'

If the header.php file is missing, what will happen to the page rendering?

A Page will render without header content

B Page will crash and not render

C Page will load footer instead

D Page will load header.html instead

💡 Hint

Refer to key moment 2 about missing template parts and execution table step 3

Concept Snapshot

Template parts let you split theme files into smaller pieces.
Use get_template_part('name') to load 'name.php'.
This inserts that part's content into the main template.
If the file is missing, no content is added.
It helps keep code organized and reusable.

Full Transcript

In WordPress themes, template parts are smaller template files like header.php or footer.php. The main template calls get_template_part('name') to load and insert these parts. The function looks for 'name.php' in the theme folder, loads its content, and places it where called. This keeps templates organized by splitting code into reusable pieces. If the file is missing, that part is skipped and the page still renders. This visual trace shows each step from calling get_template_part to inserting the content and completing the page render.

Practice

1. What is the main purpose of using get_template_part() in WordPress themes?

easy

A. To create database tables

B. To register new custom post types

C. To include reusable template parts and keep code organized

D. To enqueue styles and scripts

Solution

1. Step 1: Understand the function role

   get_template_part() is designed to include reusable parts of a theme, like headers or footers.

2. Step 2: Compare with other options

   Registering post types, enqueuing scripts, and creating tables are unrelated to template parts.

3. Final Answer:

   To include reusable template parts and keep code organized -> Option C

4. Quick Check:

   Template parts = reusable code pieces [OK]

Hint: Remember: template parts reuse code pieces [OK]

Common Mistakes:

• Confusing template parts with post type registration
• Thinking it manages scripts or styles
• Assuming it handles database operations

2. Which of the following is the correct syntax to include a template part named 'content' with a specific variation 'single'?

easy

A. get_template_part('content', 'single');

B. get_template_part('single', 'content');

C. get_template_part('content-single');

D. get_template_part('content', single);

Solution

1. Step 1: Recall function parameters

   get_template_part() takes two string arguments: slug and optional name.

2. Step 2: Match correct order and syntax

   The correct call is get_template_part('content', 'single'); with both parameters as strings.

3. Final Answer:

   get_template_part('content', 'single'); -> Option A

4. Quick Check:

   Slug then name as strings [OK]

Hint: Use two strings: slug first, then name [OK]

Common Mistakes:

• Passing combined slug and name as one string
• Swapping slug and name order
• Forgetting quotes around name

3. Given the code snippet:

get_template_part('header');

What file will WordPress try to load first?

medium

A. header.php

B. header-header.php

C. header-single.php

D. header-template.php

Solution

1. Step 1: Understand default file naming

   When only slug is given, WordPress looks for {slug}.php file.

2. Step 2: Apply to example

   Slug is 'header', so WordPress loads header.php.

3. Final Answer:

   header.php -> Option A

4. Quick Check:

   Slug only loads slug.php [OK]

Hint: Slug alone loads slug.php file [OK]

Common Mistakes:

• Expecting a suffix like '-header' automatically
• Confusing with named template parts
• Assuming different file extensions

4. What is wrong with this code snippet?

get_template_part('footer', single);

medium

A. No issues, code works fine

B. Wrong function name, should be get_template_parts

C. Footer template parts cannot have a name

D. Missing quotes around 'single' causing a syntax error

Solution

1. Step 1: Check parameter types

   Both slug and name must be strings, so 'single' needs quotes.

2. Step 2: Identify error cause

   Without quotes, single is treated as a constant or variable, causing syntax error.

3. Final Answer:

   Missing quotes around 'single' causing a syntax error -> Option D

4. Quick Check:

   Strings need quotes [OK]

Hint: Always quote slug and name strings [OK]

Common Mistakes:

• Omitting quotes around name parameter
• Using wrong function name
• Thinking named parts are not allowed

5. You want to create a reusable sidebar template part with two variations: 'left' and 'right'. Which folder structure and code usage is correct to achieve this?

hard

A. Files: sidebar-left.php, sidebar-right.php inside /parts/ folder; Code: get_template_part('sidebar', 'left');

B. Files: sidebar-left.php, sidebar-right.php in theme root; Code: get_template_part('sidebar', 'left');

C. Files: sidebar.php only; Code: get_template_part('sidebar-left');

D. Files: sidebar-left.php, sidebar-right.php in theme root; Code: get_template_part('sidebar-left');

Solution

1. Step 1: Understand file naming for variations

   Named template parts use {slug}-{name}.php in theme root.

2. Step 2: Match code to file structure

   Calling get_template_part('sidebar', 'left'); loads sidebar-left.php.

3. Step 3: Evaluate other options

   B places files in subfolder without adjusting slug to include path; C uses only one file; D uses combined slug-name as one string incorrectly.

4. Final Answer:

   Files: sidebar-left.php, sidebar-right.php in theme root; Code: get_template_part('sidebar', 'left'); -> Option B

5. Quick Check:

   Slug-name files in root with two-string call [OK]

Hint: Use slug-name.php files in root, call with two strings [OK]

Common Mistakes:

• Placing files in subfolders without adjusting code
• Passing combined slug-name as one string
• Using only one file for multiple variations