Customizing themes

The following article is suitable to be used for older versions only. Please use the guide here: Front-end Live Theme Customizer versions 3.0 and above.

All themes come with default designs that can be adjusted to fit your needs. The following options are available for all themes.

You can reach the Styles Pro Settings page with any of the following methods:

• From Menu:
  • Forms > Styles Pro
  • Click on Settings: Customize themes
• OR
  • Forms > Settings > Styles Pro
• OR
  • Or click on Edit Themes Form Settings

From the Styles Pro Settings page you can customize all of your themes. Make sure you have the options opened for the theme you want to customize. You can open options for all Styles Pro themes you have installed from the select box on the top.

Styles Pro Settings

Select a theme you want to customize from the top. As soon as you select one, you will see the customization options appear for that theme below.

Font: You can choose to use your theme fonts, web-safe fonts, or choose from over 300 Google fonts.

You can also customize: Font size (in any CSS units), Color, Style.

Labels: If required, you can choose a different Font for Labels and headings in the Form.

Buttons: Button text color and button background colors can be changed from here. The color picker also allows you to use transparency.

List Highlight Background: In Checkbox and Radio button styles, using Frame and List styles depends on a highlight color that is applied on the selected choice. This setting will change the background color for your highlighted list item.

Form background: Some themes come with background images. You can either use them or None based on your preference. You can also use colors (can also have transparency) using the color picker or an image.

If you are using the same Google fonts in your forms as in your WordPress theme, then you might not want to load the fonts again for optimization purposes. You can do that by checking “Do not load this font” in the settings.

Universal Settings

Default Theme: If you have a lot of forms on your website, this feature will be very useful. You can choose the Default theme here. Once a default theme is set here, you can still use different themes for different forms by simply going to that particular form’s settings and changing theme from Default to whatever theme you want to choose.

Custom CSS: You can write your custom CSS here. If enabled, CSS defined here will be loaded with all Styles Pro themes.

Custom Styles Guide

We have made it significantly easy to override the notoriously difficult-to-override Gravity Forms Styles! A simple guide to using Styles Pro to write your custom styles will be published soon, however, you should find it easy to get started.