This FAQ is about using the Contact Form 7 tag editor. To edit your form on the CF7 Skins form tab (using the visual editor), see How do I edit my CF7 Skins form (using Visual Editor)?

When you start a new form in Contact Form 7, at the top of the page is a default contact form in the Contact Form 7 form tag editor:

Contact Form 7 - Default Contact Form

Selecting a CF7 Skins Template will change the HTML tags and Contact Form 7 tags shown in this editor.

If you haven’t selected a Template yet, choose one that has fields closest to what you want in your finished form.

Tip: Each Template is like an easy to follow guide, which you can adjust by moving, adding, copying, and deleting fields.

CF7 - Form Editor - Contact Template

Contact Form 7 form editor showing the CF7 Skins Contact Template

To edit the form, most people find copying, pasting, and deleting lines is the best way to make adjustments.

Remove a field by highlighting the line and deleting it.

Contact Form 7 - Delete Field

Add a field by copying one that is similar, pasting it where you want, then editing the field name. For example, if there is a First Name row, you can copy and paste it then change the label to Last Name.

Contact Form 7 - Add Fields - Copy and Paste

To add a brand new field tag, click a tag name from the tag generator button area just above your form editor. Insert it into your form, then copy and paste it into the correct position.

Tip: The tag will insert itself wherever your cursor was within the editor.

Contact Form 7 - Add New Tag

To know which tags and fields you can add, take a look at Contact Form 7’s Tag Syntax documentation. To check if you are changing the right field or label, try saving the form and previewing it after each change.

Important: If you select one template, edit it, then select another template, the form editor will overwrite any edits that you have made. Exit the page without saving to recover your form back to the last time you saved it.

For a more in-depth tutorial, follow along with Edit your CF7 Skins Form (Contact Form 7 Editor).

Related FAQs:

  1. How do I find and select a Template?
  2. How do I save my CF7 Skin?
  3. How do I preview what my form will look like?