Árvore de páginas

Versões comparadas

Chave

  • Esta linha foi adicionada.
  • Esta linha foi removida.
  • A formatação mudou.

Index


Índice
outlinetrue
exclude.*ndice
stylenone

Form theme customization

In the form editor, available in the process editor, you can select a template for the form that is being created. This style can be customized by any user who has permission to access the control panel.

...

Deck of Cards
effectDuration0.5
historyfalse
idsamples
effectTypefade
Card
defaulttrue
idPasso1
labelStep 1
effectTypeslide


  • Access the Control panel from the side menu.


Card
idPasso2
labelStep 2
effectTypeslide


  • Click on the Processes tab and then click the Form themes item.


Card
idPasso3
labelStep 3
effectTypeslide


  • On the screen, it is possible to download themes already registered, define whether the theme is or is not active to appear to the user and the standard theme which is the pre-selected theme when creating a form. To add a new theme, click Add.


Card
idPasso4
labelStep 4
effectTypeslide


  • On the screen, to add a new style, you are required to fill in a code to the theme, the description of the theme and select the CSS file to execute the upload.


Click Save. After that, the theme is registered and can already be used in the form editor.


Recommendations 

When uploading themes, it is important to follow these rules:

...

In some cases, it is necessary to use the !important, as these are classes that are already used by TOTVS Fluig Platform and can be subscribed.


HTML

The HTML automatically generated by the form editor with only one field gets the following structure:

Bloco de código
languagehtml/xml
titleFormulário
linenumberstrue
<form name="formulario">
	<h1 class="title-form-application">Formulario Exemplo</h1>
	<div class="form-field">
		<label class="label-field-properties">Campo Nome</label>
		<span class="is-required">
			<b>*</b>
		</span>
		<div class="form-input">
			<input type="text" name="nome" />
		</div>
	</div>
</form>


Example

Now, we'll create a theme with:

...