[Tutorial] How to change theme color for JUX templates

10 Jun, 2015

Recently, we got an interesting question from our customers. They want to change the theme color as their own wish. To be honest, it is not difficult to add a new theme color in a JUX template. Here, I will show you how to do it quickly with JUX one - our hottest template. You can apply similarly with other JUX templates. Go to your backend and let’s start now:

1. Create a new theme color in folder template

- Step 1: Access the following file link: “template/jux_one /less/theme” to create folder “custom_color”

custom-color

- Step 2: Open an existed folder (eg: blue), copy 3 following files: template.less; template-responsive.less; variables.less into the folder “custom_color” you have created.

create-color

- Step 3: Open “variables.less” file to change the variable “@ style_color” into the color of your choice

style-color

- Step 4: In the “template/jux_one/images/themes” file folder, create a file folder “custom_color” and you can insert the icons with your new color.
Note: You will need to create new icons with your chosen color

new-icon

- Step 5: In the “template/jux_one/less/theme/custom_color” file folder, you should change the variable in “@ T3ImagePath”. In this case, I will change “blue” to “custom_color”

blue-color

2. Duplicate Theme color and set default

After finish creating the new “custom_colors” in “template” folder, I will guide you to duplicate theme color and set it as default for your website:

- Step 1: In the backend, open: extensions->Template Manager->Select template as default and duplicate it.

backend

- Step 2: Using your newly duplicated theme, open the “General” tab to Enable Development Mode

general

- Step 3: Open “Theme” tab, select the new theme color to assign it for your page, then save it

theme

- Step 4: Set the new Theme as default

default

The new theme color should now, work properly on your website. If you have any difficult in doing it, please do not hesitate to contact us . Enjoy your new theme!