Theme System
On this page
The theme system manages site appearance and templating:
- ThemeManager (
core/lib/theme/theme-manager.js
): Main coordinator for theme operations - ThemeDiscovery (
core/lib/theme/modules/theme-discovery.js
): Scans for available themes - ThemeTemplateResolver (
core/lib/theme/modules/theme-template-resolver.js
): Resolves template paths - ThemeInstaller (
core/lib/theme/modules/theme-installer.js
): Handles theme installation - ThemeMarketplaceCDN (
core/lib/theme/modules/theme-marketplace-cdn.js
): Integrates with theme marketplace
Architecture
Theme Manager
├── Theme Discovery # Find and validate themes
├── Theme Template Resolver # Resolve template paths
├── Theme Installer # Install/delete themes
└── Theme Marketplace CDN # Download from marketplace
Theme Structure
theme-name/
├── theme.json # Theme metadata (required)
├── templates/ # Main templates
│ ├── layout.html # Base layout (required)
│ ├── home.html # Homepage template
│ ├── post.html # Single post template
│ ├── page.html # Single page template
│ ├── taxonomy.html # Category/tag template
│ └── 404.html # Error page template
├── custom/ # Custom templates
│ ├── homepage.html # Custom homepage
│ ├── category.html # Custom category page
│ ├── tag.html # Custom tag page
│ ├── categories.html # Categories listing page
│ ├── tags.html # Tags listing page
│ ├── topics.html # Taxonomies listing page
│ ├── blog.html # Paginated posts page
│ ├── [taxonomy]-[slug].html # Specific taxonomy slug page
│ └── [slug].html # Page-specific templates
├── partials/ # Reusable components
│ ├── header.html
│ ├── footer.html
│ └── sidebar.html
└── assets/ # Static assets
├── css/
│ └── style.css # Main stylesheet (required)
└── js/
└── main.js # JavaScript files
Template Resolution Hierarchy
- Custom templates:
custom/[slug].html
- Content-specific:
[type].html
(post.html, page.html) - Generic content:
content.html
- Base layout:
layout.html
(fallback)
Theme Validation
Themes must include:
- Valid
theme.json
with required fields templates/layout.html
assets/css/style.css
For more details, see Theme Structure