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
40%
Column
width
Panel
borderColorlightgrey
bgColor#F0F0F0
titleColorwhite
titleBGColor#88AACC
borderWidth1
titleOverview
borderStylesolid

There are two categories of themes in : global and custom. They are described below:

  1. Basic Steps#GlobalThemes Global Themes - themes provided by . There are three two global themes: Clear, Professional Blue and NouveauNouveau 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.
  2. Custom Themes- these themes are created by the designer. There are two types of Custom themes can be of two types:
    1. Application Themes -  Customized   Customized themes added to to to to an application. Application themes will themes will be included in included in the application download. 
    2. Designer themes -  customized   customized themes that are only available to the designer user that uploads them. 

 Refer Refer to Basic Steps for more details.

 Use 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 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