You are here

page.html.twig in Drupal 10

Bartik's theme implementation to display a single page.

The doctype, html, head and body tags are not in this template. Instead they can be found in the html.html.twig template normally located in the core/modules/system directory.

Available variables:

General utility variables:

  • base_path: The base URL path of the Drupal installation. Will usually be "/" unless you have installed Drupal in a sub-directory.
  • is_front: A flag indicating if the current page is the front page.
  • logged_in: A flag indicating if the user is registered and signed in.
  • is_admin: A flag indicating if the user has permission to access administration pages.

Site identity:

  • front_page: The URL of the front page. Use this instead of base_path when linking to the front page. This includes the language domain or prefix.

Page content (in order of occurrence in the default page.html.twig):

  • node: Fully loaded node, if there is an automatically-loaded node associated with the page and the node ID is the second argument in the page's path (e.g. node/12345 and node/12345/revisions, but not comment/reply/12345).

Regions:

  • page.header: Items for the header region.
  • page.highlighted: Items for the highlighted region.
  • page.primary_menu: Items for the primary menu region.
  • page.secondary_menu: Items for the secondary menu region.
  • page.featured_top: Items for the featured top region.
  • page.content: The main content of the current page.
  • page.sidebar_first: Items for the first sidebar.
  • page.sidebar_second: Items for the second sidebar.
  • page.featured_bottom_first: Items for the first featured bottom region.
  • page.featured_bottom_second: Items for the second featured bottom region.
  • page.featured_bottom_third: Items for the third featured bottom region.
  • page.footer_first: Items for the first footer column.
  • page.footer_second: Items for the second footer column.
  • page.footer_third: Items for the third footer column.
  • page.footer_fourth: Items for the fourth footer column.
  • page.footer_fifth: Items for the fifth footer column.
  • page.breadcrumb: Items for the breadcrumb region.

File

core/themes/bartik/templates/page.html.twig
View source
  1. {#
  2. /**
  3. * @file
  4. * Bartik's theme implementation to display a single page.
  5. *
  6. * The doctype, html, head and body tags are not in this template. Instead they
  7. * can be found in the html.html.twig template normally located in the
  8. * core/modules/system directory.
  9. *
  10. * Available variables:
  11. *
  12. * General utility variables:
  13. * - base_path: The base URL path of the Drupal installation. Will usually be
  14. * "/" unless you have installed Drupal in a sub-directory.
  15. * - is_front: A flag indicating if the current page is the front page.
  16. * - logged_in: A flag indicating if the user is registered and signed in.
  17. * - is_admin: A flag indicating if the user has permission to access
  18. * administration pages.
  19. *
  20. * Site identity:
  21. * - front_page: The URL of the front page. Use this instead of base_path when
  22. * linking to the front page. This includes the language domain or prefix.
  23. *
  24. * Page content (in order of occurrence in the default page.html.twig):
  25. * - node: Fully loaded node, if there is an automatically-loaded node
  26. * associated with the page and the node ID is the second argument in the
  27. * page's path (e.g. node/12345 and node/12345/revisions, but not
  28. * comment/reply/12345).
  29. *
  30. * Regions:
  31. * - page.header: Items for the header region.
  32. * - page.highlighted: Items for the highlighted region.
  33. * - page.primary_menu: Items for the primary menu region.
  34. * - page.secondary_menu: Items for the secondary menu region.
  35. * - page.featured_top: Items for the featured top region.
  36. * - page.content: The main content of the current page.
  37. * - page.sidebar_first: Items for the first sidebar.
  38. * - page.sidebar_second: Items for the second sidebar.
  39. * - page.featured_bottom_first: Items for the first featured bottom region.
  40. * - page.featured_bottom_second: Items for the second featured bottom region.
  41. * - page.featured_bottom_third: Items for the third featured bottom region.
  42. * - page.footer_first: Items for the first footer column.
  43. * - page.footer_second: Items for the second footer column.
  44. * - page.footer_third: Items for the third footer column.
  45. * - page.footer_fourth: Items for the fourth footer column.
  46. * - page.footer_fifth: Items for the fifth footer column.
  47. * - page.breadcrumb: Items for the breadcrumb region.
  48. *
  49. * @see template_preprocess_page()
  50. * @see html.html.twig
  51. */
  52. #}
  53. <div id="page-wrapper">
  54. <div id="page">
  55. <header id="header" class="header" role="banner">
  56. <div class="section layout-container clearfix">
  57. {{ page.secondary_menu }}
  58. {{ page.header }}
  59. {{ page.primary_menu }}
  60. </div>
  61. </header>
  62. {% if page.highlighted %}
  63. <div class="highlighted">
  64. <aside class="layout-container section clearfix" role="complementary">
  65. {{ page.highlighted }}
  66. </aside>
  67. </div>
  68. {% endif %}
  69. {% if page.featured_top %}
  70. <div class="featured-top">
  71. <aside class="featured-top__inner section layout-container clearfix" role="complementary">
  72. {{ page.featured_top }}
  73. </aside>
  74. </div>
  75. {% endif %}
  76. <div id="main-wrapper" class="layout-main-wrapper layout-container clearfix">
  77. <div id="main" class="layout-main clearfix">
  78. {{ page.breadcrumb }}
  79. <main id="content" class="column main-content" role="main">
  80. <section class="section">
  81. <a id="main-content" tabindex="-1"></a>
  82. {{ page.content }}
  83. </section>
  84. </main>
  85. {% if page.sidebar_first %}
  86. <div id="sidebar-first" class="column sidebar">
  87. <aside class="section" role="complementary">
  88. {{ page.sidebar_first }}
  89. </aside>
  90. </div>
  91. {% endif %}
  92. {% if page.sidebar_second %}
  93. <div id="sidebar-second" class="column sidebar">
  94. <aside class="section" role="complementary">
  95. {{ page.sidebar_second }}
  96. </aside>
  97. </div>
  98. {% endif %}
  99. </div>
  100. </div>
  101. {% if page.featured_bottom_first or page.featured_bottom_second or page.featured_bottom_third %}
  102. <div class="featured-bottom">
  103. <aside class="layout-container clearfix" role="complementary">
  104. {{ page.featured_bottom_first }}
  105. {{ page.featured_bottom_second }}
  106. {{ page.featured_bottom_third }}
  107. </aside>
  108. </div>
  109. {% endif %}
  110. <footer class="site-footer">
  111. <div class="layout-container">
  112. {% if page.footer_first or page.footer_second or page.footer_third or page.footer_fourth %}
  113. <div class="site-footer__top clearfix">
  114. {{ page.footer_first }}
  115. {{ page.footer_second }}
  116. {{ page.footer_third }}
  117. {{ page.footer_fourth }}
  118. </div>
  119. {% endif %}
  120. {% if page.footer_fifth %}
  121. <div class="site-footer__bottom">
  122. {{ page.footer_fifth }}
  123. </div>
  124. {% endif %}
  125. </div>
  126. </footer>
  127. </div>
  128. </div>