Template parts in Wordpress - Practice Problems & Coding Challenges

Challenge - 5 Problems

❓ component_behavior

intermediate

What is the output of this WordPress template part usage?

Given the following code in a WordPress theme file:

get_template_part('content', 'single');

Assuming the theme folder contains content-single.php and content.php, which file will be loaded and displayed?

Wordpress

get_template_part('content', 'single');

A Both content-single.php and content.php are loaded and displayed.

B The file content.php is loaded and displayed.

C The file content-single.php is loaded and displayed.

D No file is loaded because get_template_part requires a full filename.

💡 Hint

Think about how WordPress looks for template parts when a slug and name are provided.

WordPress first looks for a file named {slug}-{name}.php. If it exists, it loads that file. Otherwise, it falls back to {slug}.php.

📝 Syntax

intermediate

Which option correctly includes a template part with a variable passed in WordPress?

You want to include a template part template-parts/header.php and pass a variable $title to it. Which code snippet correctly does this?

A

use get_template_part with third argument:
<?php get_template_part('template-parts/header', null, ['title' => 'Welcome']); ?>

B

pass variable directly as second argument:
<?php get_template_part('template-parts/header', ['title' => 'Welcome']); ?>

C

use include with variable:
<?php include 'template-parts/header.php'; ?>

D

set query variable and then call get_template_part:
<?php set_query_var('title', 'Welcome'); get_template_part('template-parts/header'); ?>

💡 Hint

Check the WordPress 5.5+ feature for passing variables to template parts.

Since WordPress 5.5, get_template_part accepts a third argument as an array of variables to pass to the template part.

🔧 Debug

advanced

Why does this template part not load the expected file?

Consider this code in a WordPress theme:

get_template_part('sidebar', 'footer');

The theme folder contains sidebar-footer.php but the file is not loaded. What is the most likely cause?

Wordpress

get_template_part('sidebar', 'footer');

A The file sidebar-footer.php is missing or misnamed in the theme folder.

B The function get_template_part does not accept two arguments.

C The file sidebar-footer.php must be in a subfolder named 'template-parts'.

D The second argument must be null to load sidebar-footer.php.

💡 Hint

Check the file name and location carefully.

get_template_part looks for {slug}-{name}.php in the theme root or child theme root. If the file is missing or named differently, it won't load.

❓ component_behavior

advanced

What happens if get_template_part is called with a non-existent template part?

What is the output or behavior when this code runs in a WordPress theme?

get_template_part('nonexistent-part');

Assume no file named nonexistent-part.php exists in the theme.

Wordpress

get_template_part('nonexistent-part');

A WordPress throws a fatal error and stops loading the page.

B A warning message is displayed on the page about missing template.

C WordPress loads the default index.php template instead.

D Nothing is output and the page continues loading normally.

💡 Hint

Think about how WordPress handles missing template parts silently.

get_template_part tries to include the file. If it doesn't exist, it fails silently without error or output.

❓ state_output

expert

What is the value of $color after this template part call?

In header.php you have:

$color = 'blue';
get_template_part('partials/colors', null, ['color' => 'red']);
echo $color;

In partials/colors.php you have:

echo $color;
$color = 'green';

What is the final output of echo $color; in header.php after the call?

Wordpress

$color = 'blue';
get_template_part('partials/colors', null, ['color' => 'red']);
echo $color;

A red

B blue

C green

D Notice: Undefined variable: color

💡 Hint

Consider variable scope when passing variables to template parts.

Variables passed via the third argument are extracted only inside the template part file scope. Changes inside the template part do not affect the original variable in the calling file.

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