Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Comment: Migrated to Confluence 5.3
Info

We recommend that you only customize themes where absolutely necessary. The CSS customizations depend on the forms underlying html structure. Since this structure is not guaranteed to stay the same in each release you will be required to retest your own themes and potentially make changes after each upgrade.

Section
Column
width40%
Panel
borderColorlightgrey
bgColor#F0F0F0
titleColorwhite
titleBGColor#88AACC
borderWidth1
titleOverview
borderStylesolid

 

There are three two categories of themes in : global , application and designercustom. They are described below:

 Use
  1. Application Themes - customized theme that is downloaded/uploaded as part of the application. See Basic Steps for more information.
  2. Global Themes - two themes provided by : Clear and Professional BlueGlobal Themes - themes provided by . There are two global themes: Nouveau and Nouveau Blue. These Global themes take advantage of newer browsers supporting modern CSS and are extremely well-suited to forms/flows running on mobile devices. The Nouveau theme is the default theme for new forms created in version 5.1.1.
  3. Custom Themes- these themes are created by the designer. There are two types of Custom themes:
    1. Application Themes -  Customized themes added to to an application. Application themes will be included in the application download.
    2. Designer themes -  customized themes
    added by the forms designer. 

 

Note

Global and designer themes are not included in an application download.

    1. that are only available to the designer user that uploads them.

Refer to Basic Steps for more details.

Use customized themes when:

  • You want to give a particular form a certain look and feel that you cannot achieve using the properties in the Forms Designer, or
  • You want several forms to have the same look and feel, and wish to apply the theme to all the forms instead of changing properties for one form at a time.

Perhaps the most common reason to customize a theme is to change your forms’ background color so the forms will blend in nicely with your existing Web site, but you can add as many other stylistic touches as you wish to make your forms visually appealing. Once you create a customized theme, you can use it in as many forms as you like—including forms that already exist as well as those you haven’t created yet.  

If you are customizing a theme for a single form, be aware of the various style properties that are available in the Forms Designer. Remember there are style properties for the form itself, as well as style properties for the individual controls in your form. You do not need to customize a theme if you wish only to change your  Expform’s your form’s height, adjust the color and font of your labels, or create different types of borders around a specific control—you can make these changes simply by editing the appropriate properties.

If you are going to make extensive style changes you need an understanding of CSS and must spend a little time examining and making inferences from the structure and markup of the file (form.css) that  uses that uses for its own custom themes. A tool such as Firebug can help greatly with this. On the other hand,   gives gives you as a starting point, a copy of the form.css file, which is well-commented. For many basic style changes, you do not have to do anything more than overlay the existing value or values with your own. We have provided several examples to get you started.

Warning

Be sure to test any form that uses a custom theme in all of the browsers your users might have. A form and its controls may display and function correctly in Internet Explorer, but not in Firefox or Safari. For example, adjusting the placement of controls in a form using custom themes may produce different results in a different browser or different browser versions. Note also that Customized themes are not available in the Standard Edition.

20%
Column
width
240px
Panel
borderColorlightgrey
bgColor#F0F0F0
titleColorwhite
titleBGColor#88AACC
borderWidth1
titleThemes Chapters
borderStylesolid

Basic Steps

Common Customization Examples

Customized Themes and Templates

Items in a Custom Theme

Zip

File

Rezipping / UpLoading Modified Themes

Using / Editing Customized Themes

Image Added