Page Template(s)

Pages to be rendered by PageFactory need to use a meta-file named z.txt (e.g. content/1_home/z.txt).
Thus, Kirby invokes the template site/templates/z.twig, which causes Twig to render the page.

To use multiple templates, just use another name for the meta-file and define a correspondingly named Twig template, as you would normally do in Kirby.

Sample Template

Show source...

File sample.twig:

<!doctype html>
<html lang="{{ page.lang }}">
<head>
  <meta charset="utf-8">
  <title>{{ page.headTitle }}</title>

  <meta name="viewport" content="width=device-width, user-scalable=yes, initial-scale=1">
  <meta name="generator" content="{{ page.generator }} (on PHP {{ page.phpVersion }})">

  {{ page.headInjections|raw }}
</head>

<body id='pfy' class='pfy-default-styling {{ page.bodyTagClasses|raw }}' {{ page.bodyTagAttributes|raw }}>

<div class='pfy-page'>

  <header class='pfy-header'>
    {{ nav({ wrapperClass: 'pfy-primary-nav', type: 'top' }) }}
  </header>




  <!-- === page content =============== -->
  <main id='main' class='pfy-main'>

    {{ page.pageContent | raw }}

  </main>
  <!-- === /page content =============== -->



  <footer class="pfy-footer">
    <div class="pfy-footer-left">
      {{ page.langSelection|raw }}
    </div>

    <div class="pfy-footer-center">
    {{ page.adminPanelLink|raw }}
    </div>

    <div class='pfy-footer-right'>
    {{ page.loginButton|raw }}
    </div><!-- /pfy-footer-right -->
  </footer>




  <div class="pfy-small-screen-header pfy-small-screen-only" style='display: none;'>
    {{ page.smallScreenHeader|raw }}
  </div><!-- /pfy-small-screen-header -->


  {{ prevnextlinks() }}

</div><!-- /.pfy-page -->



{{ page.bodyEndInjections|raw }}
</body>
</html>

Variables in Templates

Use {{ page.myvar }} in the Twig template for any variable elements.
If variables contain HTML, you need to write {{ page.myvar | raw }} instead.

Note:
This applies only to Twig templates, in .md files omit the page. selector, just write {{ myvar }} instead.

Useful variables:

{{ page.lang }}// the language code, e.g. 'en'
{{ page.kirbyPageTitle }}// page-title as determinded by Kirby
{{ page.kirbySiteTitle }}// site-title as determinded by Kirby
{{ page.headTitle }}// title as rendered by PageFactory ^#)
{{ page.generator }}// reference to Kirby and PageFactory
{{ page.phpVersion }}// version of PHP currently running
{{ page.langSelection|raw }}// autmatically generated selection menu for supported languages
{{ page.adminPanelLink|raw }}// link to the Kirby Panel (label from {{ pfy-admin-panel-link-text }}^*))
{{ page.loggedIn|raw }}// who is logged in
{{ page.loginButton|raw }}// login icon
{{ page.webmasterEmail|raw }}// automatically derived (guessed) from domain, if undefined

^*) Define/override variables via site/custom/variables/myvars.yaml (see Variables).

^#) To customize the page title, use a variable definition such as

headTitle: '{{ kirbyPageTitle }} | {{ kirbySiteTitle }}'