Interactive Forms Edit Environment Presentation

This topic is intended for developers with experience in XperienCentral plugin development.
The information in this topic applies to XperienCentral versions 10.20.0 and higher.

In a new installation, the presentation used for Interactive Forms in the Interactive Forms module is the XperienCentral default presentation. You can apply your own presentation to the Interactive Forms module in order to allow your designers to see how forms will be rendered on the front-end while creating them. This mirrors the way that the look and feel of content items are rendered in the Editor. To apply your own presentation to the Interactive Forms module, follow these steps:

Open the form step presentation (formStep.jspf) in an editor.
Add your own code to the JSPF. For example:
```
<c:if test="${mode == 'preview'}">
<style>
.wm-field
{ height: 75px; }
.wm-field-input
{ float: right; }
</style>
```
The above code is a simple example. You can obviously apply any kind of styling that you wish.

Editor, by adding the next code to the formstep presentation (formStep.jspf) in the wmpformpresentation wcb, the design can be altered:

<c:if test="${mode == 'preview'}">
<style>
.wm-field

{ height: 75px; }

.wm-field-input

{ float: right; }

</style>

This is a basic change, more is possible by the developer/designer.

Back to top