How to customize the style and layout of a task form that is called directly by its URL?

Submitted by julien.houeix on Tue, 07/18/2017 - 11:02
1
0
-1

Hello,

I am creating an application that will call BPM Portal URLs to display forms. For example, there will be HTML links in my applications that will link to a Bonita URL that displays a task form (form that has been designed in the Bonita UI Designer).
I used the method explained in that documentation page :
http://documentation.bonitasoft.com/?page=bonita-bpm-portal-urls

It is working fine.

However, I would like to know if it possible to customize the layout and the style of the forms.

I read in the documentation that it is possible to customize the theme if the form is viewed in an application :
http://documentation.bonitasoft.com/?page=forms

But I don't even know how to add a form in an application. For me you could only add application pages in an application, not forms created by the UI designer.

I also saw that you could add css in the "ASSETS" section of the UI Designer, but I would have to copy the CSS for each form. Isn't there a way to make a CSS file apply to all forms?

Thanks in advance for your help.

1 answer

Submitted by antoine.mottier on Thu, 07/20/2017 - 16:36
1
0
-1
This one is the BEST answer!

Hi,

Actually in order to customize the layout of a form, for Bonita Community Edition, you will have to either:

  • edit the CSS ("style.css" available in "Asset" tab in the UI Designer) individually for each forms.
  • add a new external CSS (in "Asset" tab in the UI Designer) individually for each forms. Advantage of this option over the first one is that all your forms can refer to a shared CSS file (or set of files).

I agree that documentation is not very intuitive on this topic mostly because some solutions covered in documentation apply to subscription only that provide Portal theme and Application theme feature.

Comments

Submitted by julien.houeix on Thu, 07/20/2017 - 17:33

Hi Antoine, thanks a lot for your help!

There is still something that I dont't understand though : how do you add a form created with the UI Designer in a Bonita application? Is it something that is not possible with the Community Edition?

Permalink
Submitted by antoine.mottier on Thu, 07/20/2017 - 17:43

Actually you cannot add a form created with the UI Designer to an application, you can only add a page created with the UI Designer to an application (this is where the documentation is actually misleading).

What is also actually possible is to have, in an application page, a link to a form. Such link will use the task URL as explain in the documentation.
As the page is actually loaded in an iframe, opening the form link will load the form in the application iframe.
If form is loaded in application iframe it inherit from application theme (you can customize application theme only in Bonita Subscription Edition).

Hope this clarify a little bit the complex logic of how themes are applied.

Permalink
Submitted by julien.houeix on Fri, 07/21/2017 - 15:47

**Again, thanks a lot Antoine! :) **

So when the documentation says "if your form is viewed in an application", it actually means "if your form is included via an iframe in an application page".
I think it would be great if the documentation was a bit clearer about this.

Permalink
Notifications