Themes

Themes control the look and feel of your website. ZephyrPHP uses Twig-based themes with section schemas, live customizer support, and a built-in code editor.

Managing Themes

Go to CMS Admin > Themes to manage your themes. From here you can:

  • View all installed themes
  • Activate a theme (set as live)
  • Preview a theme before activating
  • Upload new themes (ZIP file)
  • Delete unused themes

Theme Structure

A theme is a folder inside pages/themes/ with this structure:

pages/themes/my-theme/
├── layouts/
│   └── base.twig          # Main layout template
├── sections/
│   ├── hero.twig           # Hero section
│   ├── featured.twig       # Featured collection
│   ├── faq.twig            # FAQ accordion
│   └── ...                 # More sections
├── snippets/
│   ├── header.twig         # Header snippet
│   └── footer.twig         # Footer snippet
├── templates/
│   └── collection.twig     # Collection entry template
└── config/
    └── settings_schema.json # Theme settings schema

Section Schemas

Each section template defines its configurable settings using a JSON schema embedded in the Twig file. This schema powers the visual customizer — users see form fields (text inputs, color pickers, dropdowns) that map to the schema.

Live Customizer

The customizer (Themes > Customize) provides a live preview of your site as you edit. Changes are shown instantly in the preview pane. Click Save to publish your changes.

Installing Themes

  1. Go to CMS Admin > Themes
  2. Click Upload Theme
  3. Select a ZIP file or enter a download URL
  4. The theme is extracted and ready to activate
Creating Your Own Theme

Want to build a custom theme? See the Creating Themes guide for the full development workflow.