Main Menu

Overview of the CF7 Skins User Interface

CF7 Skins has a simple and easy to learn user interface. Follow along to see the different sections and how they help you quickly create beautiful Contact Form 7 forms.

First, since CF7 Skins is built within Contact Form 7, you need to create a new Contact Form 7 form:

1. Log in to your WordPress account.

2. Go to Contact and click Add New.

Scroll down until you see the CF7 Skins section, just below the regular Contact Form 7 user interface.

Skins

The Skins section is divided into several main tabs:

Form

Template

Style

Form

The Form (visual editor) tab is where you build and edit your form. It displays an interactive, visual, layout of your form’s fields and structure.

CF7 Skins Form tab showing the visual form editor

On the side are all of the available fields, including Contact Form 7 tags and CF7 Skins items.

You can simply drag and drop selected form fields from the Fields section into the Form section.

Important: Only use the visual form editor after choosing a template. Selecting a template overrides the form section and will erase all of your changes.

To save any changes you make to the Form section, click Save Visual.

Tip: Once you click Save Visual, you do not need to click any other Save buttons.

Template

Templates, based on commonly used forms, act like an easy to follow guide that you can adjust based on your needs. Once a template has been selected, the Form section is automatically updated with the new layout, structure, and content.

Help & More Features

If you have a question or need extra help, quickly find useful advice and links in the Getting Started section. To see what extra features CF7 Skins offers to make your forms even better, take a look at the Add-ons section.