Template documents

An Origami template document is a text file with embedded JavaScript, like a big template literal.

products.ori.html

<h3>Products</h3>
<p>
Current product list as of ${
new Date("2026-01-01 12:00").toLocaleDateString("en-US", { month: "long", day: "numeric" })
}:
</p>

http://localhost:5000/products.html

Products

Current product list as of January 1:

Call a template like a function: give it data, get back the text with all the expressions evaluated.

postLink.ori.html

<a href="${ _.href }">
  <span class="title">${ _.title }</span>
</a>

$ ori "postLink.ori.html({ href: 'post1.html', title: 'Hello' })"
<a href="post1.html">
  <span class="title">Hello</span>
</a>
$

In the template, an underscore represents the input.

Call any JavaScript function by file name - no config needed.

index.ori.html

<p>
  Consider this hierarchical tree:
</p>
<figure>
  ${ treeDiagram.js(data.json) }
</figure>

http://localhost:5000/index.html

Consider this hierarchical tree:

Break complex pages into smaller templates and scripts, then combine them to create the final output!

page.ori.html

<body>
  ${ header.ori.html() }
  <h1>Welcome to our site</h1>
</body>

header.ori.html

<nav>
  <a href="/">Home</a>
</nav>

$ ori "page.ori.html()"
<body>
  <nav>
    <a href="/">Home</a>
  </nav>
  <h1>Welcome to our site</h1>
</body>
$