0
0
Wordpressframework~20 mins

Custom headers and footers in Wordpress - Practice Problems & Coding Challenges

Choose your learning style9 modes available
LearnWhyDeepVisualTryChallengeProjectRecallPerf
Challenge - 5 Problems
šŸŽ–ļø
Custom Header & Footer Master
Get all challenges correct to earn this badge!
Test your skills under time pressure!
ā“ component_behavior
intermediate
2:00remaining
What will this WordPress header.php output?
Given this header.php snippet in a WordPress theme, what HTML will be rendered in the browser?
Wordpress
<?php
?><!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
<meta charset="<?php bloginfo('charset'); ?>">
<title><?php wp_title('|', true, 'right'); ?></title>
<?php wp_head(); ?>
</head>
<body <?php body_class(); ?>>
<header>
  <h1><?php bloginfo('name'); ?></h1>
  <nav><?php wp_nav_menu(['theme_location' => 'primary']); ?></nav>
</header>
A<!DOCTYPE html><html lang="en-US"><head><meta charset="UTF-8"><title>My Site |</title><!-- WordPress head content --></head><body class="home"><header><h1>My Site</h1><nav><!-- Primary menu items --></nav></header>
B<!DOCTYPE html><html><head><title>My Site</title></head><body><header><h1>My Site</h1></header>
C<html><head><meta charset="UTF-8"></head><body><header><h1>My Site</h1><nav></nav></header>
D<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>My Site</title></head><body><header><h1>My Site</h1><nav></nav></header>
Attempts:
2 left
šŸ’” Hint
Look carefully at the functions that add language attributes, charset, and menu.
ā“ state_output
intermediate
2:00remaining
What is the footer content after this WordPress footer.php runs?
Consider this footer.php snippet in a WordPress theme. What will be the visible footer content on the page?
Wordpress
<?php
?><footer>
  <p>&copy; <?php echo date('Y'); ?> <?php bloginfo('name'); ?></p>
  <?php wp_footer(); ?>
</footer>
</body>
</html>
A<footer><p>Ā© 2024</p></footer>
B<footer><p>Ā© <?php echo date('Y'); ?> My Site</p></footer>
C<footer><p>Ā© 2023 My Site</p></footer>
D<footer><p>Ā© 2024 My Site</p><!-- WordPress footer scripts --></footer>
Attempts:
2 left
šŸ’” Hint
Remember PHP date('Y') returns the current year.
šŸ“ Syntax
advanced
2:00remaining
Which option causes a syntax error in a WordPress header.php?
Identify which code snippet will cause a syntax error when used in a WordPress theme's header.php file.
A<?php language_attributes(); ?> inside <html> tag without echo
B<?php wp_nav_menu(['theme_location' => 'primary']); ?> correct syntax
C<?php echo get_bloginfo('name'); ?> missing semicolon
D<?php bloginfo('charset'); ?> missing semicolon
Attempts:
2 left
šŸ’” Hint
Check for missing semicolons in PHP statements.
šŸ”§ Debug
advanced
2:00remaining
Why does the custom footer not show the menu?
A developer added this code to footer.php to show a menu, but the menu does not appear on the site. What is the most likely cause?
Wordpress
<?php wp_nav_menu(['theme_location' => 'footer']); ?>
Awp_nav_menu() must be called in header.php only
BThe 'footer' menu location is not registered in functions.php
CThe menu items are empty, so nothing shows
Dwp_nav_menu() requires a second argument for CSS classes
Attempts:
2 left
šŸ’” Hint
Check if the theme supports the menu location used.
šŸ§  Conceptual
expert
2:00remaining
How does WordPress decide which header.php to load?
In a WordPress theme, multiple header files exist: header.php, header-home.php, and header-special.php. Which function call loads header-special.php?
Aget_header('special');
Binclude('header-special.php');
Cget_header();
Dget_header('home');
Attempts:
2 left
šŸ’” Hint
Check how get_header() uses its parameter to load custom header files.