Using Your Customized Theme
Once you’ve uploaded your customized theme, you can use it for every form in an application or for specific forms. To use your theme in every form in an application, click Applications from frevvo’s left-hand menu. Click the properties [[Image:Cog_go.gif]] icon underneath your application’s name. When the Properties page is displayed, click the Choose Theme dropdown box and select your customized theme.
[[image:theme_applicationProp.png]]
This will apply your new theme to any new forms you create, '''but it won’t automatically change the theme for existing forms'''. To update an existing form with your new theme, locate the desired form and click Edit. Click the toolbar at the top of the form to access the form properties on the left side of the Forms Designer. Click the Style tab, and pick your customized theme from the Theme dropdown box.
[[image:theme_formProp.png]]
The theme can be selected dynamically via the form Url parameter _themeId. This parameter takes precedence over the theme selected at either the Application or in the Form itself as shown above. _themeId can be set to either than name of the theme, "Professional Green" in the case above. Or it can be set to the unique theme Id. You can find the Id via Copy Link Location on the Edit button or theme name in the Themes tab.
Here is an example using the Just the Iframe share code. The theme is set to one uploaded by the user named "yellow".
<pre>
<script src="http://test.frevvo.com:80/frevvo/web/user/qaforms/app/_Vse0geOLEdygU8Rk-2FAeQ/ formtype/_dV9uYOOLEdygU8Rk-2FAeQ/embed?container=true&_themeId=yellow" type="text/javascript" language="Javascript"></script>
</pre>
=== Editing Your Customized Theme === If you need to make additional changes to your customized theme, again edit the form.css on disk and re-zip the files and then upload the modifications by clicking the [[image:edit.png]] icon next to your existing theme. When you update a theme the changes take place immediately and automatically in all forms already using that theme.
=== Customized Themes and Templates === If you use a form that has your own custom theme when publishing a template, your custom theme will not become part of the template. If you want to share the form and the custom theme with someone else, you’ll need to send the downloaded form and the custom theme zip file.
=== Advanced Customization Techniques === The possibilities for customizing themes are virtually endless with CSS. Keep in mind that every control on your form has a CSS property field (as described in the horizontal radio button example), so you can set a value to any control in the forms designer and target the particular control using any allowable CSS property. Consider also that you can’t “hurt” anything by experimenting with the form.css file and uploading your customized theme to frevvo. If you upload the theme and it’s not quite what you want, just delete it. Even if you’ve applied the custom theme to a form, you can at any time reapply the original clear or professional blue theme by changing the form’s Theme property.
If you will be making sophisticated changes, we recommend using Firebug, which is a free Firefox add-on. With Firebug, you can make changes to the form.css file and see the changes applied instantly to your form in Firefox’s browser. Firebug also helps you inspect markup and determine which class IDs you need when adding your own custom styling touches. More information is available at www.getfirebug.com.
=== Flow.css Customizations === tbd
=== Tasks.css Customizations === tbd
=== Login.css Customizations === tbd
=== Submissions.css Customizations === tbd