How To Create Custom ERPNext Themes?

KylekClau · July 21, 2016, 6:56am

Hi,

I’m new to ERPNext. I want to create a custom theme for the system, such as side menu bars and etc.
Is there any guide available for that?

Any help will be appreciated. Thanks.

kolate_sambhaji · July 21, 2016, 7:01am

@KylekClau

Here is some way.
You can create your app.
In your add make your custom_css
add your custom_css in your apps hook.py file

github.com

frappe/frappe/blob/develop/frappe/hooks.py#L33


      
          
          
# website
          app_include_js = [
          	"libs.bundle.js",
          	"desk.bundle.js",
          	"list.bundle.js",
          	"form.bundle.js",
          	"controls.bundle.js",
          	"report.bundle.js",
          ]
          app_include_css = [
          	"desk.bundle.css",
          	"report.bundle.css",
          ]
          
          
doctype_js = {
          	"Web Page": "public/js/frappe/utils/web_template.js",
          	"Website Settings": "public/js/frappe/utils/web_template.js",
          }
          
          
web_include_js = ["website_script.js"]

Regards,
Sambhaji Kolate,
New Indictrans Technologies Pvt Ltd.

KylekClau · July 21, 2016, 7:38am

@kolate_sambhaji

Thanks for the information. How about making a side menu bar at the main dashboard instead of icons at the center of the main page, so I just need to edit the desk.min.css right?

I noticed that there are a “website theme” function at the settings. How does it works?

Thank you.

Regards,
KylekClau

kolate_sambhaji · July 21, 2016, 7:55am

@KylekClau you need to change template , you can start with css.
Also Its not good idea to change core files, so make customization in your custom app.

By default theming is worked on css rule. You can add css in your app

Regards,
Sambhaji Kolate,
New Indictrans Technologies Pvt Ltd.