Each style uses one theme, and you can use multiple styles simultaneously --> so you can use multiple themes in one site.

1. Default Themes

By default, JA T3v3 supports 4 themes named: default, green, red and dark. You can assign the theme you want for each style.

For each style, you can select any theme to be applied for the style. To use multiple themes in one site, you need to override template.

Read more override template

2. Customize theme

To customize theme, you can use settings of template (Theme Setting tab or ThemeMagic) or customize the Theme LESS files located in: templates/ja_t3v3_blank/assets/less/themes/Theme_Name. In case you are not in development mode, you customize the Theme CSS file located in: templates/ja_t3v3_blank/assets/css/themes/Theme_Name

Note: After complied, the following files are auto created: bootstrap.css, bootstrap-responsive.css, responsive-home.css and template-responsive.css

3. Create New theme

There are 2 ways to create new theme:

#1: Create manually

Step 1: Create theme folder

In the folder: templates/ja_t3v3_blank/assets/less/themes, create a theme folder. In this example, we name it: custom-theme

Step 2: Create theme files

Each theme has 3 LESS files: template.less, variables.less, variables-custom.less. We add the files in folder: templates/ja_t3v3_blank/assets/less/themes/custom-theme

#2: Clone a theme folder and theme files

From the list of default theme folders, clone one folder then rename it. Open the folder then customize the theme using the LESS files.

4. Define the Theme

Now, you will need to compile less to css so that new created theme folder will be compiled to css theme folder.

Now, you will have a theme folder compiled in the folder: templates/ja_t3v3_blank/css/themes/custom-theme

In the back-end, you can select the new created theme for style you want

Notes:

As you can see, each theme has an independent folder. The folder contains all necessary files, it is not overrided from default theme so it will increase the speed of your site.