Theme Overview

With Paperform, you have the ability to customize the design, look, and feel of your forms through the “Theme Editor”.

In this guide, we will look at how you can change colors, fonts, form appearance and make other style changes in order to portray your brand, business, or personality.

Accessing the Theme Editor

A form's theme controls how the form will be presented.

You can access the form's ”Theme Editor” by selecting the water drop icon found in the top-right corner of the form editor.

Accessing the Theme Editor.

The “Theme Editor” is broken down into the following four sections:

• Theme Settings
• Typography
• UI Elements
• Translations

Theme Settings provides quick access to commonly used theme defaults. It is here that you can set default fonts and colors, as well as configure the “Form Experience”.

Theme Settings.

“Theme Settings” also provides a visual representation of how your form will appear with the current stylization settings.

On specific pricing plans, you can import a theme from your other forms or randomize the current theme.

The “Form Experience” feature allows you to choose between a standard form experience or a guided experience.

"Standard Mode" will present the form as it appears in the form editor, while "Guided Mode" will modify the behavior of the form’s pagination and allow submitters to progress through your form with a simpler approach - presenting one question at a time.

Form Experience.

“Typography” gives you control over the font, sizing, line heights, and coloring of the text on your form. It is here that you can configure the style for all your text elements.

Typography.

On specific pricing plans, you can add a custom font style and apply it to the text on your form.

Go to Theme → Typography → and select "Add Custom Style +".

To apply the custom font style to your text, highlight text on the form and click the arrow that shows up at the end of the options to select and apply the custom style.

Apply custom style.

We support all Google Fonts on all plans, and you can use other fonts on your forms with Custom CSS (a feature reserved for specific pricing plans).

Background

In this section, you can change the background of your form.

Go to Theme → UI Elements → Background, and you will see options to change the background color, upload a background image, or embed a YouTube, Vimeo, Loom, or Wistia video as a background video.

You can also blur the background or add a semi-transparent overlay color when using a background image or video. This is done using the Overlay menu.

Overlay menu.

Questions

Submit Button

If you would like to change the wording and the styling of the submit button, this section is where you can do so.

Submit button design.

The Submit Button section contains the ability to;

• Change the text used for the submit button.
• Turn on / off the “X questions to go” messaging.
• Turn on / off the total price from being displayed in the submit button.
• Change the button color

For specific pricing plans:

• The submit button typography, color, and style.

Pagination Buttons

On specific pricing plans, you have the option to use Custom CSS on your forms. Custom CSS allows you to completely customize the look and feel of your forms.

CSS (Cascading Style Sheets) is used to control the appearance of just about everything on the internet. Custom CSS gives you a fine level of control over the stylization on the page, allowing you to control the coloring, spacing, sizing, and more.

Using custom CSS requires a little technical knowledge of CSS; if you're new to CSS then a short course like this might help you get started. If you get stuck, just ask us in chat or at support@papeform.co.

In this section, you can create, edit, and manage the language of your form.

Just about all of the languages that are used in the form can be customized using “Translations”. Translations can be shared among forms and can also be edited in your account settings.

You can create, edit, and manage all of your translations in your Account Settings. You can then apply these translations to forms via the “Theme Editor”.

1. To add a translation, select "Add Translation." "Translation Title," "Translation Language," and "Translation Language is RTL" are required.

2. (Optional) If you select "Yes" for "Translation Language is RTL", then all messaging, questions, and answers for forms will be set to RTL.

3. (Optional) Please choose the appropriate character subsets from the font subsets dropdown if your language requires any.

4. Edit the default language of your form in the “General Translations” section.

5. When finished, select "Create Translation." The translation will appear in your list of Account Translations.

6. When editing a form, you can choose a translation or edit it by going to Theme Editor → Translations and select “Use”.

   If you would like your whole form to be in a different language, you will need to type out all the content including questions and text in your form in the desired language.

Now that you understand the “Theme Editor” it is time for you to begin designing the look and feel of your forms.

As always, if you need any additional help, reach out to us via chat or email us at support@paperform.co.