I’m trying to customise the navbar on an ERPNext V14 system. I have a custom app and I want to override navbar.html with one in the app. From the thread linked below, I think I need to place my custom navbar.html in:
apps/myapp/myapp/public/js/myapp/ui/toolbar/navbar.html
However, in that thread, Patrick.St mentions adding the file to the app’s build.json. In V14, build.json no longer exists, I believe.
I have placed my custom navbar.html in the directory in my app and rebuilt but the navbar appears unchanged. Am I putting my template in the correct place in the directory structure and if so, what else do I need to do for it to be used?
Thank you, eleben. I just tried that but it is still not overriding the default navbar.
Do I need to do something else to make it override? As I said, in the original thread Patrick.St needed to include the file in build.json. The V14 equivalent is to include it in a .js bundle in apps/myapp/myapp/public/js but when I try that, “bench build” warns that it cannot include the file. I think it cannot include anything that is outside apps/myapp/myapp/public/js
You would only need to include that file in the build.json file if it was js code. Otherwise if the path is correct, frappe will override with your custom html file.
▲ [WARNING] [plugin frappe-html] There was an error importing /home/frappe/frappe-bench/apps/myapp/myapp/public/js/templates/saabits/ui/toolbar/navbar.html
../myapp/myapp/public/js/myapp.bundle.js:2:7:
2 │ import "./templates/myapp/ui/toolbar/navbar.html";
╵ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
I think it should be fine to include .html templates in the bundle. apps/erpnext/erpnext/public/js/erpnext.bundle.js includes quite a few HTML templates without any problems.
However, I don’t think this is what I need to do. I really need to find the correct path to put my navbar.html in to override the nav-bar in the desk view. If I put an edited navbar.html in apps/myapp/myapp/templates/includes/navbar/navbar.html, without putting it in the bundle, then it correctly overrides the nav-bar in the web-site view but that isn’t what I’m trying to do.
Thank you, Darshit.
That is a great way to customise the nav-bar for the website view without using a custom app. However, I could not see how to use it to customise the nav-bar for the desk view, which is what I am trying to customise.
Hello @BillJ , I managed to override the nav bar in desk view by running frappe build after writing some custom code and embedded CSS in navbar.html. Please let me know if you manage.
Hi @BillJ Just keep a back up of your navbar.html (for desk) and override the existing one and once you’re done writing your custom code run “bench build”.
[quote=“Brianmbewe, post:13, topic:107252, full:true”]
Hi @BillJ Just keep a back up of your navbar.html (for desk) and override the existing one and once you’re done writing your custom code run “bench build”.[/quote]
Thanks, Brian. I can do it that way and I know it will work but I was hoping to find the way to override it in my custom app without having to edit any core files.
@bahaou I need to add code to the template but I will bear in mind that I can include CSS using the hook file because I’m sure I will need to style it too. Thank you.
