PHPackages                             lekoala/silverstripe-theme-framework - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [Utility &amp; Helpers](/categories/utility)
4. /
5. lekoala/silverstripe-theme-framework

ActiveSilverstripe-module[Utility &amp; Helpers](/categories/utility)

lekoala/silverstripe-theme-framework
====================================

Theme framework SilverStripe

1.1.0(11y ago)2182BSD-3-ClauseJavaScript

Since Apr 8Pushed 3y ago3 watchersCompare

[ Source](https://github.com/lekoala/silverstripe-theme-framework)[ Packagist](https://packagist.org/packages/lekoala/silverstripe-theme-framework)[ RSS](/packages/lekoala-silverstripe-theme-framework/feed)WikiDiscussions master Synced 1mo ago

READMEChangelogDependencies (2)Versions (4)Used By (0)

Silverstripe Theme Framework
============================

[](#silverstripe-theme-framework)

A default set of tools to create themes for Silverstripe with LESS.

SiteConfig and Page extensions
------------------------------

[](#siteconfig-and-page-extensions)

When adding this module, the ThemeSiteConfigExtension is activated on your SiteConfig. It will create a new theme tab where you can configure your theme.

You can configure the base, primary and secondary colors of your theme and the logo/favicon.

The ThemePageControllerExtension will make sure that:

- You include jquery (and jquery ui if needed). It's always nice to have this loaded first to avoid any further inclusion which could break plugins (typically if loading the min version in place of the full version).
- It will compile the styles if needed. Please note that the styles are only automatically refreshed in dev mode.

Two conventions are used by the Theme Framework:

- Your theme MUST include a "all.less" file in the css folder. This all.less must be compiled as a all.css file that will be used by default if no compiled style is found.
- Your theme SHOULD include a "init.js" file in the javascript folder.

All compiled styles are stored in assets/Theme folder to avoid versioning compiled versions of your theme.

You can disable auto compile (which is slow if you are developing locally) by defining the following constant:

```
define('THEME_FRAMEWORK_DISABLE_COMPILE',true);

```

Ui Kit
------

[](#ui-kit)

For webapps, I recommend using the Ui Kit framework to get most of what you need

To enable, simply use the following yml config:

```
ThemePageControllerExtension:
  uikit:
	enabled: true
    theme_enabled: false
	theme: 'almost-flat'

```

You can choose to use a already compiled theme or use the less files. It is useful to use the less files if you want to overwrite variables based on your own color scheme.

NOTE: don't forget that less variables are lazy evaluated, meaning that you can define variables AFTER importing the uikit.less

NOTE: if you choose to import less files, you can import any of the base themes. For the icons, to avoid messing with paths, it's easier to copy the "fonts" directory right inside your theme folder

Google Fonts
------------

[](#google-fonts)

By default the theme framework will load Open Sans as the default font. You can define the fonts of your choice or disabling this setting

```
SiteConfig:
  google_fonts: 'Open+Sans:400italic,400,600&subset=latin,latin-ext'

```

Noty
----

[](#noty)

The theme framework comes with a notification system that use Noty

Messages can also be pulled from the session by using SetSessionMessage method on the controller

Outdated browsers
-----------------

[](#outdated-browsers)

This plugin is integrated and enabled by default with IE9 as a minimum

Icomoon
-------

[](#icomoon)

This module comes bundled with a all Fontawesome. Feel free to include your own set of icons created through the online app:

Default CSS for Silverstripe
----------------------------

[](#default-css-for-silverstripe)

Libraries:

- Mixins
- Normalize

Please note that since less files are compiled through php, your less librairies should not make use of Javascript functions (like Lesshat does).

Default styles:

- Layout
- Typography
- Form

The css framework comes with a series of breakpoints that should fit most projects. You can check the "variables.less" files.

The Grid
--------

[](#the-grid)

This module includes a standalone grid system compatible with Silverstripe Forms

How to create a theme?
----------------------

[](#how-to-create-a-theme)

Create a theme as usual ! Simply include the less files you need. Typically, I'll have the following files:

- all.less which includes all other files
- typography.less
- variables.less
- layout.less
- form.less
- fonts.less
- editor.less

Include Theme Framework base less files in each, for instance in variables.less

```
@import "../../../theme-framework/css/variables.less";

```

Or in layout.less

```
@import "variables.less";
@import "../../../theme-framework/css/mixins.less";
@import "../../../theme-framework/css/layout.less";

```

Google Analytics Helper
-----------------------

[](#google-analytics-helper)

It is a common scenario to have Google Analytics in your project. Although modules exists to do so in Silverstripe, I always feel it is a bit of a shame to include a whole module just to add a snippet at the bottom of your pages. It is also a common scenario to let your user configure their tracking code. Therefore, this module comes with a little helper to include tracking code.

Thirdparty libs
---------------

[](#thirdparty-libs)

Icon generator

Less compiler

Compatibility
=============

[](#compatibility)

Tested with 3.1

Maintainer
==========

[](#maintainer)

LeKoala -

###  Health Score

30

—

LowBetter than 64% of packages

Maintenance20

Infrequent updates — may be unmaintained

Popularity11

Limited adoption so far

Community14

Small or concentrated contributor base

Maturity65

Established project with proven stability

 Bus Factor1

Top contributor holds 93.1% of commits — single point of failure

How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window.

**Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores.

**Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement.

**Maturity (30%)** — Project age, version count, PHP version support, and release stability.

###  Release Activity

Cadence

Every ~17 days

Total

3

Last Release

4024d ago

### Community

Maintainers

![](https://avatars.githubusercontent.com/u/250762?v=4)[Thomas Portelange](/maintainers/lekoala)[@lekoala](https://github.com/lekoala)

---

Top Contributors

[![lekoala](https://avatars.githubusercontent.com/u/250762?v=4)](https://github.com/lekoala "lekoala (134 commits)")[![Shetza](https://avatars.githubusercontent.com/u/5880072?v=4)](https://github.com/Shetza "Shetza (5 commits)")[![hackardoX](https://avatars.githubusercontent.com/u/10788630?v=4)](https://github.com/hackardoX "hackardoX (4 commits)")[![tomzi](https://avatars.githubusercontent.com/u/4091451?v=4)](https://github.com/tomzi "tomzi (1 commits)")

---

Tags

silverstripecmsmoduletheme

### Embed Badge

![Health badge](/badges/lekoala-silverstripe-theme-framework/health.svg)

```
[![Health](https://phpackages.com/badges/lekoala-silverstripe-theme-framework/health.svg)](https://phpackages.com/packages/lekoala-silverstripe-theme-framework)
```

###  Alternatives

[symbiote/silverstripe-grouped-cms-menu

Allows you to group CMS menu items.

3696.2k6](/packages/symbiote-silverstripe-grouped-cms-menu)[entidi/silverstrap

A Silverstripe theme based on Bootstrap front end framework

111.4k1](/packages/entidi-silverstrap)

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)
