Kirigami
Tutorial · Part 2 of 7

Pages & layout

Three real pages, one shared header and footer, and the PHPDOC block that drives them.

  1. Add two more pages

    Studio Plié needs a home page (already there), a notes section, and a gallery:

    
                                src/
                                ├── _index.php          → /
                                ├── notes/_index.php    → /notes/
                                └── atelier/_index.php  → /atelier/

    Each starts the same way — a PHPDOC block, then markup:

    
                                /**
                                 * @title    Atelier
                                 * @section  atelier
                                 * @abstract Where the folding happens.
                                 */

                                echo '<h1>' . str_htmlesc($title) . '</h1>';
                                echo '<p>' . str_htmlesc($abstract) . '</p>';

    Every @key value in that docblock becomes a $key variable — in the page itself, and in before/after. Define whatever keys make sense; @title, @section and @abstract are just this project's own convention, not reserved words.

  2. Wire up navigation in the header

    src/_layouts/header.php runs before every page (it's prepros.before in kirigami.yaml), so it's the natural place for a nav built from a plain PHP array:

    
                                $nav = [
                                    ''         => ['Home',   'home'],
                                    'notes/'   => ['Notes',  'notes'],
                                    'atelier/' => ['Atelier','atelier'],
                                ];
                            
    
                                foreach ($nav as $path => [$label, $key]) {
                                    $current = ($section ?: 'home') === $key;
                                    echo '<a href="' . $relroot . $path . '"'
                                       . ($current ? ' aria-current="page"' : '')
                                       . '>' . $label . '</a>';
                                }

    $relroot is injected by Kirigami on every render — the relative path from the current page back to kirigami.root — so these links work whether the current page is / or three folders deep.

  3. Close the layout in the footer

    src/_layouts/footer.php is prepros.after — it closes whatever <main>/<body> the header opened. Nothing new here yet; it stays as the starter template left it until Part 4 re-themes it.

NOTE

There's no router, no template inheritance system, no special "layout" concept beyond two plain PHP includes run before and after the page body. That's deliberate — it's the same PHP you already know, just running once at build time instead of on every request.