Templated CSS
The stylesheet homepage-theme.css was generated from a template with page-specific color
variables for a light theme.
What This Example Shows
Templated JavaScript
The configuration homepage-config.js has public API endpoints and settings suitable for
the public homepage.
Page-Specific Resolution
SSI resolves tokens differently for homepage-theme.css vs
dashboard-theme.css based on the file path, just like it does for HTML pages.
Processing Type Comparison
Type "plain" with no-escape — For Templating
CSS Processing: The file css/homepage-theme.css contains a colors token. When SSI processes it as a page, it looks for css-vars/homepage/colors.txt and injects those light theme values.
JS Processing: The file js/homepage-config.js contains an api-config token. SSI injects content from js-config/homepage/api-config.txt with public API configuration.
When to use: When you need variable substitution, per-page customization, or dynamic content generation.
Type "raw" — For Verbatim Content
type = "raw" includes content with absolutely no escaping, no token replacement, and no whitespace changes. The content is inserted verbatim.
Inline SVG example: The palette icon below is included with the palette token. Using type = "plain" would HTML-escape the angle brackets in the SVG, breaking it. Using type = "raw" inserts it exactly as written.
When to use: Inline SVG, pre-formatted JSON, raw HTML snippets, or any content that must be preserved character-for-character.
Decision Matrix
| Approach | Use When | Processing |
|---|---|---|
plain + no-escape |
Need variable injection in CSS/JS | Escaping disabled, newlines → spaces (inline) |
raw |
Verbatim content (SVG, JSON, pre-formatted text) | Zero processing — exact passthrough |
processing = "copy" |
Static assets referenced by URL | No token processing — deploys as a file |