page.html.twig
Same filename in this branch
Same filename in other branches
- 9 core/profiles/demo_umami/themes/umami/templates/layout/page.html.twig
- 9 core/themes/olivero/templates/layout/page.html.twig
- 9 core/themes/stable9/templates/layout/page.html.twig
- 9 core/themes/seven/templates/page.html.twig
- 9 core/themes/claro/templates/page.html.twig
- 9 core/themes/bartik/templates/page.html.twig
- 9 core/themes/stable/templates/layout/page.html.twig
- 9 core/themes/starterkit_theme/templates/layout/page.html.twig
- 9 core/themes/classy/templates/layout/page.html.twig
- 9 core/modules/system/templates/page.html.twig
- 8.9.x core/profiles/demo_umami/themes/umami/templates/layout/page.html.twig
- 8.9.x core/themes/seven/templates/page.html.twig
- 8.9.x core/themes/claro/templates/page.html.twig
- 8.9.x core/themes/bartik/templates/page.html.twig
- 8.9.x core/themes/stable/templates/layout/page.html.twig
- 8.9.x core/themes/classy/templates/layout/page.html.twig
- 8.9.x core/modules/system/templates/page.html.twig
- 11.x core/profiles/demo_umami/themes/umami/templates/layout/page.html.twig
- 11.x core/themes/olivero/templates/layout/page.html.twig
- 11.x core/themes/stable9/templates/layout/page.html.twig
- 11.x core/themes/claro/templates/page.html.twig
- 11.x core/themes/starterkit_theme/templates/layout/page.html.twig
- 11.x core/modules/system/templates/page.html.twig
Olivero'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.content: The main content of the current page.
- page.sidebar: Items for the first sidebar.
- page.featured_bottom_first: Items for the first featured bottom region.
- page.featured_bottom_second: Items for the second featured bottom region.
- page.footer_first: Items for the first footer column.
- page.footer_second: Items for the second footer column.
- page.breadcrumb: Items for the breadcrumb region.
- page.social: Items for the social region.
See also
3 theme calls to page.html.twig
- ElementInfoManagerTest::providerTestGetInfoElementPlugin in core/
tests/ Drupal/ Tests/ Core/ Render/ ElementInfoManagerTest.php - Provides tests data for testGetInfoElementPlugin().
- ElementInfoManagerTest::testGetInfoElementPlugin in core/
tests/ Drupal/ Tests/ Core/ Render/ ElementInfoManagerTest.php - Tests the getInfo() method when render element plugins are used.
- Page::getInfo in core/
lib/ Drupal/ Core/ Render/ Element/ Page.php - Returns the element properties for this element.
File
-
core/
themes/ olivero/ templates/ layout/ page.html.twig
View source
- {#
- /**
- * @file
- * Olivero'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.content: The main content of the current page.
- * - page.sidebar: Items for the first sidebar.
- * - page.featured_bottom_first: Items for the first featured bottom region.
- * - page.featured_bottom_second: Items for the second featured bottom region.
- * - page.footer_first: Items for the first footer column.
- * - page.footer_second: Items for the second footer column.
- * - page.breadcrumb: Items for the breadcrumb region.
- * - page.social: Items for the social region.
- *
- * @see template_preprocess_page()
- * @see html.html.twig
- */
- #}
-
- <div id="page-wrapper" class="page-wrapper">
- <div id="page">
-
- {% if page.header or page.primary_menu or page.secondary_menu %}
- <header id="header" class="site-header" data-drupal-selector="site-header" role="banner">
-
- {# Gets fixed by JavaScript at wide widths. #}
- <div class="site-header__fixable" data-drupal-selector="site-header-fixable">
- <div class="site-header__initial">
- <button class="sticky-header-toggle" data-drupal-selector="sticky-header-toggle" role="switch" aria-controls="site-header__inner" aria-label="{{ 'Sticky header'|t }}" aria-checked="false">
- <span class="sticky-header-toggle__icon">
- <span></span>
- <span></span>
- <span></span>
- </span>
- </button>
- </div>
-
- {# Needs to extend full width so box shadow will also extend. #}
- <div id="site-header__inner" class="site-header__inner" data-drupal-selector="site-header-inner">
- <div class="container site-header__inner__container">
-
- {{ page.header }}
-
- {% if page.primary_menu or page.secondary_menu %}
- <div class="mobile-buttons" data-drupal-selector="mobile-buttons">
- <button class="mobile-nav-button" data-drupal-selector="mobile-nav-button" aria-label="{{ 'Main Menu'|t }}" aria-controls="header-nav" aria-expanded="false">
- <span class="mobile-nav-button__label">{{ 'Menu'|t }}</span>
- <span class="mobile-nav-button__icon"></span>
- </button>
- </div>
-
- <div id="header-nav" class="header-nav" data-drupal-selector="header-nav">
- {{ page.primary_menu }}
- {{ page.secondary_menu }}
- </div>
- {% endif %}
- </div>
- </div>
- </div>
- </header>
- {% endif %}
-
- <div id="main-wrapper" class="layout-main-wrapper layout-container">
- <div id="main" class="layout-main">
- <div class="main-content">
- <a id="main-content" tabindex="-1"></a>
- {{ page.hero }}
- <div class="main-content__container container">
- {{ page.highlighted }}
- {{ page.breadcrumb }}
-
- {% if page.sidebar %}
- <div class="sidebar-grid grid-full">
- <main role="main" class="site-main">
- {{ page.content_above }}
- {{ page.content }}
- </main>
-
- {{ page.sidebar }}
- </div>
- {% else %}
- <main role="main">
- {{ page.content_above }}
- {{ page.content }}
- </main>
- {% endif %}
- {{ page.content_below }}
- </div>
- </div>
- <div class="social-bar">
- {{ page.social }}
- </div>
- </div>
- </div>
-
- <footer class="site-footer">
- <div class="site-footer__inner container">
- {{ page.footer_top }}
- {{ page.footer_bottom }}
- </div>
- </footer>
-
- <div class="overlay" data-drupal-selector="overlay"></div>
-
- </div>
- </div>
Buggy or inaccurate documentation? Please file an issue. Need support? Need help programming? Connect with the Drupal community.