Skip to main content

Creating a theme

Adding a new theme requires you to:

  • Create a new theme bundle
  • Create a theme class that defines your theme
  • Register your theme with Jadu Central
  • Configure your Symfony app to use the theme

Creating a theme bundle​

AlphaTheme 
    |- AlphaThemeBundle.php
    |- Component
    |    |- CategoryNavigationController.php
    |- DependencyInjection
    |    |- AlphaThemeExtension.php
    |- Page
    |    |- UtilitiesContent
    |        |- ThemeDemoController.php
    |- Resources
    |    |- config
    |    |   |- routing.yml
    |    |   |- services.yml
    |    |   |- theme.yml
    |    |- public 
    |    |   |- dist
    |    |   |   |...
    |    |   |- images
    |    |   |   |...
    |    |   |- js
    |    |       |...
    |    |- templates
    |        |- layouts
    |        |   |...
    |        |- pages
    |        |   |...
    |        |- partials
    |        |   |...
    |        |- widgets
    |            |...
    |- Theme
        |- AlphaTheme.php

A bundle is in essence a folder of files laid out in a consistent way.

It must contain:

  • A bundle definition file eg. AlphaThemeBundle.php
  • A theme definition file eg. Theme/AlphaTheme.php
  • A theme service definition in a config file eg. Resources/config/services.yml
  • Dependency injection class to load the theme service definition eg. DependencyInjection/AlphaThemeExtension.php

For Galaxies theme bundles, the following addtions are also required:

  • A demo route definition in a config file eg. Resources/config/routing.yml
  • A theme config file eg. Resources/config/theme.yml
  • A demo route controller eg. Page/UtilitiesContent/ThemeDemoController.php
  • A preview image eg. Resources/public/images/preview.png

Creating a theme definition​

The example defines the demo theme, which extends base. By convention, the theme file sits within the Theme directory of the project.

The machine name of the theme should be defined in the getName() method. If the theme is extending an existing theme, this should be defined in the getParent() method. base is the machine name of the CMS default theme.

The path to the twig templates provided by this theme should be defined within the getPath() method.

<?php

namespace Spacecraft\DemoProject\Theme;

use Photon\Core\Theme\Theme;

class DemoTheme implements Theme
{
    /**
     * @return string
     */
    public function getName()
    {
        return 'demo';
    }

    /**
     * @return string
     */
    public function getParent()
    {
        return 'base';
    }

    /**
     * @return string
     */
    public function getPath()
    {
        return __DIR__ . '/../Resources/templates';
    }
}

Defining a theme service​

To define a theme service service, create a service in services.yml that points to the theme definition file. The service should be tagged with photon.theme.

spacecraft_demo_project.theme:
    class: Spacecraft\DemoProject\Theme\DemoTheme
    tags:
        - { name: photon.theme }
note

Remember to include Dependency injection project extension if your theme includes its own services.yml.

Using a custom theme​

To use a theme, the configuration of your Symfony application should be updated. The photon_core element should have a child, theme. The value of theme should be the machine name of the theme, eg. demo.

By default, Jadu Central stores the Symfony application for the main site in /path/to/jadu/config/frontend.yml.

photon_core:
    theme: demo