Syntax Overview

This page provides a concise overview of the XTML template syntax, including variables, expressions, control flow, and HTML blocks.

1. Logic Blocks

All logic, variable declarations, loops, and function calls must be inside <xtml> blocks:

<xtml>
    var title = "My Page";
    var total = 10 + 20;

    function sum(a, b) {
        return a + b;
    }

    var result = sum(5, 15);

    var i = 0;
    while(i < 3) {
        print("Iteration " + i);
        i++;
    }
</xtml>

2. Variables & Placeholders

Variables are defined inside <xtml> blocks but can be referenced in HTML using placeholders {{@varname}}:

<xtml>
    var title = "My Page";
</xtml>

<h1>{{@title}}</h1>

Placeholders are evaluated and replaced with the variable content at runtime.

3. Expressions

XTML supports arithmetic, string, and HTML expressions:

<xtml>
    var total = 10 + 15;
    var greeting = "Hello, " + "World!";

    var header = expr {
        html {
            <h2>"Dynamic Header"</h2>
        }
    };
</xtml>

4. Functions

Define functions inside <xtml> blocks:

<xtml>
    function sum(a, b) {
        return a + b;
    }

    var result = sum(10, 20);
</xtml>

Functions can return values, HTML blocks, or expressions.

5. Loops

Loops must also reside in <xtml> blocks:

<xtml>
    var i = 0;
    while(i < 3) {
        render("Iteration " + i);
        i++;
    }
</xtml>

6. Conditional Statements

All conditionals are placed inside <xtml> blocks:

<xtml>
    if(total > 10) {
        var msg = "Greater than 10";
    } else {
        var msg = "10 or less";
    }
</xtml>

7. HTML Blocks

Direct HTML can be embedded with html inside <xtml> blocks:

<xtml>
    html {
        <div class="alert">"This is an alert"</div>
    }
</xtml>

The <xtml> block is required for logic, but the generated HTML is inserted wherever you place it in your template.

8. Native Functions

Call built-in or DLL module functions inside <xtml> blocks:

<xtml>
    var randStr = native std::randStr(10);
</xtml>

9. Includes

Include external XTML files for modular templates:

<xtml>
    include "functions.xtml";
</xtml>

This ensures that all logic resides in <xtml>, while bookmarks ({{@var}}) can freely appear in HTML content.