Page History

phpFox 4.3+ provides support to develop your themes using LESS. This not only makes it easier on you as the designer, but also gives Admins the ability to change the color palette of your theme direct from their AdminCP.

If you wish to continue reading on, make sure you have an IDE, Text Editor or Server that supports LESS compiling. phpFox only supports the LESS compiling from the AdminCP for when a client is designing your theme. Under development its best to do it via the .less files.

...

variables.less

To get this started we need to have a file in our themes assets/ folder called variables.less. You can place any of your custom less variables here. In this test, we will work with a simple example. In that file add

@header_bg: #000;

With this in place, we can now start working with autoload.less.

...

@import "variables";

.sticky-bar {
   background:@header_bg;
}

...

{
    "id": "sample",
    "name": "Sample"
}

...

{
    "id": "sample",
    "name": "Sample",
    "vars": {
       "header_bg": {
          "title": "Header Background",
          "id": ".sticky-bar",
          "attr": "background"
       }
    }
}

...