# Twig templates ## Basic syntax ```twig {# Comment #} {{ variable }} {{ variable|default('default') }} {% if condition %}...{% endif %} {% for item in items %}...{% endfor %} {% extends 'base.twig' %} {% block content %}{% endblock %} {% include 'partials/header.twig' %} ``` ## base.twig example ```twig {{ page_title }} - {{ site_title }} {% include 'partials/header.twig' %} {% block content %}{% endblock %} {% include 'partials/footer.twig' %} ``` ## Variables available in templates ### Page data | Variable | Type | Description | |----------|------|-------------| | `page_title` | string | Current page title (HTML-escaped) | | `content` | string | Rendered page content (HTML) | | `page_metadata` | array | Frontmatter metadata of the page | | `layout` | string | Layout name (e.g. `full_content`) | | `sidebar_content` | string | Sidebar content from plugins (HTML) | | `breadcrumb` | string | Breadcrumb HTML (generated by CMS) | ### Site data | Variable | Type | Description | |----------|------|-------------| | `site_title` | string | Site title from config.json | | `default_page` | string | Default page path | | `homepage` | string | Homepage path | | `homepage_title` | string | Homepage title | | `is_homepage` | bool | Whether current page is the homepage | | `is_guide_page` | bool | Whether current page is a guide page | | `has_content` | bool | Whether content directory is not empty | | `cms_version` | string | CMS version number | ### Menu & Navigation | Variable | Type | Description | |----------|------|-------------| | `menu` | string | Rendered menu HTML | | `current_page` | string | Current page path | | `breadcrumb` | string | Breadcrumb HTML | ### Language | Variable | Type | Description | |----------|------|-------------| | `current_lang` | string | Current language code (e.g. `nl`) | | `current_lang_upper` | string | Current language in uppercase | | `available_langs` | array | Available languages with `code`, `name`, `url`, `is_current` | ### SEO | Variable | Type | Description | |----------|------|-------------| | `seo_description` | string | SEO description | | `seo_keywords` | string | SEO keywords | | `block_ai_bots` | bool | Block AI bots | | `block_search_engines` | bool | Block search engines | ### Author | Variable | Type | Description | |----------|------|-------------| | `author_name` | string | Author name | | `author_website` | string | Author website URL | | `author_git` | string | Author Git URL | ### Theme | Variable | Type | Description | |----------|------|-------------| | `theme_title` | string | Theme title | | `theme_css_url` | string | Compiled CSS URL | | `theme_js_url` | string | JavaScript URL | | `theme_config` | array | Theme configuration from theme.json | | `theme_base_url` | string | Theme base URL (e.g. `/themes/default`) | | `theme_css_files` | array | List of CSS files | | `theme_js_files` | array | List of JS files | | `theme_favicon` | string | Favicon URL | | `plugin_css_urls` | array | CSS URLs from plugins (loaded after theme CSS) | ### Theme colors | Variable | Type | Description | |----------|------|-------------| | `header_color` | string | Header background color | | `header_font_color` | string | Header text color | | `header_height` | string | Header height in px | | `navigation_color` | string | Navigation background color | | `navigation_font_color` | string | Navigation text color | | `nav_height` | string | Navigation height in px | | `sidebar_background` | string | Sidebar background color | | `sidebar_border` | string | Sidebar border color | ### File info | Variable | Type | Description | |----------|------|-------------| | `created` | string | File creation date | | `modified` | string | File modification date | | `show_created` | bool | Whether to show creation date | | `file_info_block` | bool | Whether to show file info block | ### Translations | Variable | Type | Description | |----------|------|-------------| | `t_home` | string | "Home" translation | | `t_search` | string | "Search" translation | | `t_search_placeholder` | string | Search placeholder translation | | `t_search_button` | string | Search button translation | | `t_welcome` | string | "Welcome" translation | | `t_created` | string | "Created" translation | | `t_modified` | string | "Modified" translation | | `t_author` | string | "Author" translation | | `t_manual` | string | "Manual" translation | | `t_guide` | string | "Guide" translation | | `t_no_content` | string | "No content" translation | | `t_no_results` | string | "No results" translation | | `t_results_found` | string | "Results found" translation | | `t_powered_by` | string | "Powered by" translation | | `t_page_not_found` | string | "Page not found" translation | | `t_page_not_found_text` | string | "Page not found" text translation | | `t_mappen` | string | "Folders" translation | | `t_paginas` | string | "Pages" translation | ## Layouts and blocks A layout template extends `base.twig` and fills the `content` block: ```twig {% extends 'base.twig' %} {% block content %}
{{ content|raw }}
{% endblock %} ``` ## Conditional sidebar ```twig {% if sidebar_content %}
{{ content|raw }}
{% else %}
{{ content|raw }}
{% endif %} ``` ## Language switcher ```twig {% for lang in available_langs %} {{ lang.name }} {% endfor %} ``` ## Plugin CSS loading Plugin CSS is automatically loaded after theme CSS, so themes can override plugin styling: ```twig {% for cssUrl in plugin_css_urls|default([]) %} {% endfor %} ```