Customizing Camunda Welcome Page

I have developed customized web apps for admin/ cockpit/ tasklist successfully. Now I would like to customize the Camunda Welcome Page as shared in the screenshot.

Kindly assist how we can achieve this? Please share videos/links if available.

Thank you.

Hi @Avaneesh,

the Welcome app is located next to cockpit, admin and tasklist in the camunda-webapp-webjar:

grafik

You can find the original sources here: camunda-bpm-platform/webapps/ui/welcome at master · camunda/camunda-bpm-platform · GitHub

I haven’t tried it by myself, but I would go the same way as for customizing tasklist or cockpit.

Hope this helps, Ingo

P.S. maybe you can post a screenshot of your customized apps here?

1 Like

Hi,

Thanks for replying!!

But this won’t help much. I have shared my complete requirement in camunda below. Hope you can help me in designing and solving the problem stated below:

Query: I have to design a simple camunda application in spring boot where I can have my customized web interface. I do understand we can customize cockpit/tasklist/admin web interface. But I want to customize everything in the UI segment of camunda application like when we run the server and hit the localhost URL it loads the login page [want to customize it], later it loads the welcome page [want to customize it] and goes on.

Customize means over here is design the complete page as per my need.

Adding to this I have a few questions to be asked:

  1. After we start the server, it loads the login page. So where the login page is designed and what is the complete path for it? Can we customize the login page?
  2. As you have shared the above screenshot, I will be able to customize the web interface but how will I connect these dots? What is the path of the file to configure them?

If there is a complete project build as per my requirement, please share the link for the same?

Hi @Avaneesh,

when you develop a process application on Spring Boot, you use the webapps containing Cockpit, Tasklist, Admin and Welcome as a dependency in this project.

The project contains the BPMN file in src/main/resources and some Java classes to implement the service tasks and start the Sping Boot application.

If you look into the example that I posted in another thread (code/snippets/springboot-customized-webapps at master · camunda-consulting/code · GitHub), it contains the process application named springboot-customized-webapp-example.

This application has its own pom.xml and there are all dependencies for a Spring Boot process application including the one for the customized webapps.

This is where the development happens.

Hope this helps, Ingo

Hi @Ingo_Richtsmeier,

Thanks for the response. I am successfully able to design my customized webapps. I have a query to customize the shared screenshot below:

As per the screenshot below, my project structure looks like below but I am facing issues to customize the above page. With this project architecture, I am able to customize the camunda login page but not the above shared screenshot. Kindly help on the same and help me with the correct project structure to customize the above page?

@Ingo_Richtsmeier Kindly assist

Hi @Avaneesh,

the easiest way to try out customizing the webapps is with the Tomcat distribution (Camunda Download Center -). Here you get the all the webapps extracted in the folder camunda-bpm-tomcat-7.16.0\server\apache-tomcat-9.0.52\webapps\camunda. You can start editing the files and refresh the brower to see the results.

Afterwards it’s an additional step to apply your changes in the camunda-bpm-spring-boot-start-webapp.

I’m not a frontend specialist. After having a look into the welcome app on the Tomcat distro it seems to me that the page is completely build with java script and here I’m lost.

All I could do was to change the header by uncommenting some sections in the server\apache-tomcat-9.0.52\webapps\camunda\app\welcome\styles\user-styles.css and in the server\apache-tomcat-9.0.52\webapps\camunda\app\welcome\scripts\config.js files:

Maybe more changes are possible with styling, but that’s beyond my skills.

Hope this helps, Ingo