How to customize Admin UI (Dashboard)

[megaacheyounes]

Hello

Thank you for this amazing project.

I've been trying Vendure and so far it seemed like a great platform, however, I've been trying to customize the Admin UI (Dashboard) as I do not like theme colors and some layouts/components. I wanted to know the best approach to make changes to the UI.

for example, for the login page, I tried editing the complied code in node_modules/@vendure/admin-ui and use the command patch-package to apply the changes during deployment, this did work but it seemed inefficient and not ideal.

before:

after :

May I know the best approach to modify the Admin UI ? can I move the admin-ui out of node_modules, modify the source and include it as a custom plugin? or use patch-package as described above? or is there a better approach?

Thank you!

[michaelbromley]

Hi,

The supported ways to customize the Admin UI are covered in this section of the docs: https://docs.vendure.io/guides/extending-the-admin-ui/admin-ui-theming-branding/

[megaacheyounes]

Thanks, but what about advanced customizations, like modifying HTML structure ?

[michaelbromley]

In that entire docs section on "Extending the Admin UI" it gives all the ways the UI can be modified.

For swapping out the login screen, it might be possible with this feature: https://docs.vendure.io/guides/extending-the-admin-ui/defining-routes/#overriding-built-in-routes

I've not tested that use-case though.