Public-Facing Website

Every child app can have a public-facing marketing and documentation website. The subtheme-website repo is the reference implementation — clone it to create a website for your app.

Quick Start

1. Clone the website template

   git clone git@github.com:WaveNetworks/subtheme-website.git your-site
   cd your-site
   rm -rf .git
   git init
   git remote add origin git@github.com:YourOrg/your-site.git

2. Update the bootstrap

   Edit site/bootstrap.php to point to your admin's common_auth.php path and update the branding fallback array with your app name.

3. Replace content

   Update index.php with your marketing content. Replace docs sections in site/docs/ with your app's documentation.

4. Update URL routing

   Edit .htaccess for your domain's URL structure.

5. Deploy

   Upload to public_html/ on your production server alongside admin/ and your child app.

Architecture

The website is standalone PHP + HTML + CSS — no framework, no build tools, no npm, no database writes. It lives alongside the admin and child app repos in the same webroot:

Bootstrap Pattern

The website uses admin's common_auth.php to get branding data without requiring a login session:

<?php
// site/bootstrap.php — Minimal bootstrap for marketing site
include_once(__DIR__ . '/../admin/include/common_auth.php');
$site_branding = get_branding();
// Returns: site_name, logo_path, favicon_path, theme_color, etc.

CSS Stack

The website loads CSS from three repos in a specific order:

Use absolute paths (/admin/assets/...) to load assets from sibling repos. Keep all your website CSS in a single site/style.css file.

Documentation System

The docs system uses section-based routing via .htaccess:

# .htaccess
RewriteRule ^docs$ site/docs.php [L,QSA]
RewriteRule ^docs/(.+)$ site/docs.php?section=$1 [L,QSA]

site/docs.php maintains a $sections array mapping slugs to labels, then includes the matching partial from site/docs/:

$sections = [
    'overview'  => 'Overview',
    'setup'     => 'Setup Guide',
    'features'  => 'Features',
    // Add your sections here
];

$section = $_GET['section'] ?? 'overview';
include __DIR__ . '/docs/' . $section . '.php';

To add a new section: create site/docs/{slug}.php, add it to the $sections array, and add to sitemap.xml.

Dark/Light Mode

The website inherits dark/light mode from admin's color-mode.js. Your site/style.css should include [data-bs-theme="light"] overrides for every glass panel and custom element:

/* Dark mode (default) */
.glass-panel {
    background: rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(12px);
}

/* Light mode override */
[data-bs-theme="light"] .glass-panel {
    background: rgba(255, 255, 255, 0.85);
}

Key Rules

• Use h() for all output (available via common_auth.php)
• Use absolute paths for cross-repo assets (/admin/assets/, /child-app/assets/)
• Use __DIR__-based includes for PHP files
• Keep all CSS in site/style.css — no build tools
• No authentication required on any page
• No database writes — read-only access to admin's branding data
• No framework, no npm, no bundlers
• Support both dark and light mode
• Maintain glassmorphism glass panels: backdrop-filter: blur(12px) + transparent backgrounds

Template Repo

The complete reference implementation is available at:

git clone git@github.com:WaveNetworks/subtheme-website.git

This repo contains the full source for subtheme.com — marketing homepage, documentation system, admin preview gallery, dark/light mode, glassmorphism panels, and the Bootswatch theme switcher.