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:
- Create Theme Directory: Create a new folder in
themes/with your theme name (e.g.,themes/my-custom-theme/) - Add Theme Configuration: Create a
theme.jsonfile 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" } - Create Template Files: Add template files in
templates/directory:home.php- Homepageservices.php- Services pagecheckout.php- Checkout pagecart.php- Shopping cartdomains.php- Domain search- And more...
- Add Custom Styles: Create
assets/theme.cssfor your custom CSS - Configure Theme: Add configuration files in
config/:colors.json- Color schemetypography.json- Font settingslayout.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:
- Exploring the "Domain Focused" theme as a reference
- Creating a new theme directory with the basic structure
- Starting with one template file (like
home.php) to get familiar with the system or use the duplicate theme function. - 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!
Comments
No comments yet. Be the first to comment!
Leave a Comment
You must be logged in to comment. Login or Register to continue.