Introducing the New Theme System & Theme Manager


We're excited to announce a major update to our platform: a completely revamped theme system with a powerful Theme Manager that gives you unprecedented control over your site's appearance and functionality without changing the core.


What's New?


Our new theme system allows you to create custom themes that can completely override the default page layouts. This means you can design your homepage, services page, checkout page, and more with complete creative freedom while maintaining full compatibility with the core system.


Key Features


  • Template Overrides: Create custom template files that completely replace default page layouts
  • Theme Configuration: Manage colors, typography, and layout settings through JSON configuration files
  • Asset Management: Include custom CSS, JavaScript, and images within your theme directory
  • Content Customisation: Define custom content for each page through JSON content files

How Theme Templates Work


When a user visits a public page (like /services or /checkout), the system first checks if your active theme has a custom template file for that page. If it does, your custom template is used instead of the default one.


Example: If your theme is called "my-custom-theme" and you create a file at:


themes/my-custom-theme/templates/services.php

This file will completely override the default services page layout, giving you full control over the HTML, structure, and design.


Creating Your First Theme


To create a new theme, follow these steps:


  1. Create Theme Directory: Create a new folder in themes/ with your theme name (e.g., themes/my-custom-theme/)
  2. Add Theme Configuration: Create a theme.json file with your theme metadata:
    {
        "name": "my-custom-theme",
        "display_name": "My Custom Theme",
        "description": "A custom theme for my business",
        "author": "Your Name",
        "version": "1.0.0"
    }
  3. Create Template Files: Add template files in templates/ directory:
    • home.php - Homepage
    • services.php - Services page
    • checkout.php - Checkout page
    • cart.php - Shopping cart
    • domains.php - Domain search
    • And more...
  4. Add Custom Styles: Create assets/theme.css for your custom CSS
  5. Configure Theme: Add configuration files in config/:
    • colors.json - Color scheme
    • typography.json - Font settings
    • layout.json - Layout options

Template File Structure


Each template file should follow this basic structure:


<?php
/**
 * My Custom Theme - Services Template
 */

require_once ROOT_PATH . '/includes/bootstrap.php';
require_once ROOT_PATH . '/core/ThemeManager.php';

$theme = ThemeManager::active();
$pageTitle = 'Our Services';

// Your custom logic here
// Fetch data, handle forms, etc.

ob_start();
?>

<!-- Your custom HTML here -->
<div class="my-custom-layout">
    <h1><?= e($pageTitle) ?></h1>
    <!-- More content -->
</div>

<?php
$content = ob_get_clean();
include ROOT_PATH . '/views/layouts/public.php';
?>

Theme Manager Features


The Theme Manager (accessible from the admin area) allows you to:


  • Activate Themes: Switch between installed themes with one click
  • Preview Themes: See how your site looks with different themes before activating
  • Theme Information: View theme details, version, author, and description
  • Template Override Status: See which pages have custom templates in each theme

Example: The All New - Domain Focused Theme


We've created a complete example theme called "Domain Focused" that demonstrates the power of the new system. This theme:


  • Completely redesigns the homepage with a large domain search interface
  • Overrides all public pages (home, services, checkout, cart, domains, etc.)
  • Includes custom navigation, header, and footer components
  • Uses custom CSS with modern design patterns
  • Implements animated typing effects and interactive elements

You can find this theme in themes/domain-focused/ as a reference for creating your own themes.


License Enforcement & Branding


All themes must include core branding when required by your license. The system automatically enforces this through the renderCoreBranding() function. Themes that don't properly call this function will fail to load, ensuring compliance with licensing requirements.


In your template files, you should include:


<?php
// In your footer template or before closing body tag
echo renderCoreBranding();
?>

Best Practices


  • Use Shared Components: Create reusable header, footer, and navigation files (e.g., _header.php, _footer.php)
  • Leverage Theme Configuration: Use theme config files for easy customization without code changes
  • Maintain Compatibility: Ensure your templates work with the core system's helper functions and database structure
  • Test Thoroughly: Test all pages and functionality after creating custom templates
  • Document Your Theme: Include clear documentation in your theme's README file

Getting Started


Ready to create your own theme? Start by:


  1. Exploring the "Domain Focused" theme as a reference
  2. Creating a new theme directory with the basic structure
  3. Starting with one template file (like home.php) to get familiar with the system or use the duplicate theme function.
  4. Gradually adding more templates as you become comfortable

For more information and detailed documentation, visit our knowledge base or contact our support team.


Happy theming!