header.php 2.7 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273
  1. <?php
  2. /**
  3. * The header.
  4. *
  5. * This is the template that displays all of the <head> section and everything up until main.
  6. *
  7. * @link https://developer.wordpress.org/themes/basics/template-files/#template-partials
  8. *
  9. * @package WordPress
  10. * @subpackage Twenty_Twenty_One
  11. * @since Twenty Twenty-One 1.0
  12. */
  13. ?>
  14. <!doctype html>
  15. <html <?php language_attributes(); ?> <?php twentytwentyone_the_html_classes(); ?>>
  16. <head>
  17. <meta charset="<?php bloginfo( 'charset' ); ?>" />
  18. <meta name="viewport" content="width=device-width, initial-scale=1" />
  19. <?php wp_head(); ?>
  20. </head>
  21. <body <?php body_class(); ?>>
  22. <?php wp_body_open(); ?>
  23. <div id="page" class="site">
  24. <a class="skip-link screen-reader-text" href="#content"><?php esc_html_e( 'Skip to content', 'twentytwentyone' ); ?></a>
  25. <?php
  26. $wrapper_classes = 'site-header';
  27. $wrapper_classes .= has_custom_logo() ? ' has-logo' : '';
  28. $wrapper_classes .= ( true === get_theme_mod( 'display_title_and_tagline', true ) ) ? ' has-title-and-tagline' : '';
  29. $wrapper_classes .= has_nav_menu( 'primary' ) ? ' has-menu' : '';
  30. ?>
  31. <header id="masthead" class="<?php echo esc_attr( $wrapper_classes ); ?>">
  32. <?php
  33. $blog_info = get_bloginfo( 'name' );
  34. $description = get_bloginfo( 'description', 'display' );
  35. $show_title = ( true === get_theme_mod( 'display_title_and_tagline', true ) );
  36. $header_class = $show_title ? 'site-title' : 'screen-reader-text';
  37. ?>
  38. <div class="site-branding">
  39. <?php if ( has_custom_logo() && $show_title ) : ?>
  40. <div class="site-logo"><?php the_custom_logo(); ?></div>
  41. <?php endif; ?>
  42. <?php if ( $blog_info ) : ?>
  43. <?php if ( is_front_page() && ! is_paged() ) : ?>
  44. <h1 class="<?php echo esc_attr( $header_class ); ?>"><?php echo esc_html( $blog_info ); ?></h1>
  45. <?php elseif ( is_front_page() && ! is_home() ) : ?>
  46. <h1 class="<?php echo esc_attr( $header_class ); ?>"><a href="<?php echo esc_url( home_url( '/' ) ); ?>"><?php echo esc_html( $blog_info ); ?></a></h1>
  47. <?php else : ?>
  48. <p class="<?php echo esc_attr( $header_class ); ?>"><a href="<?php echo esc_url( home_url( '/' ) ); ?>"><?php echo esc_html( $blog_info ); ?></a></p>
  49. <?php endif; ?>
  50. <?php endif; ?>
  51. <?php if ( $description && true === get_theme_mod( 'display_title_and_tagline', true ) ) : ?>
  52. <p class="site-description">
  53. <?php echo $description; // phpcs:ignore WordPress.Security.EscapeOutput ?>
  54. </p>
  55. <?php endif; ?>
  56. </div><!-- .site-branding -->
  57. <?php get_template_part( 'template-parts/header/site-nav' ); ?>
  58. </header>
  59. <div id="content" class="site-content">
  60. <div id="primary" class="content-area">
  61. <main id="main" class="site-main">