Keeping in Touch: Updating the Contact Form on Your Author Website

If Smart Author Sites has built your author website and you have a contact form on the “contact” page of your site, you may be wondering if it is possible to update the fields on your own.

Here’s the good news: it certainly is! With the helpful guide below, you will learn how to modify which fields your readers can fill in, and even create more complex options — including Dropdown menus, checkboxes and more.

Contact Form 7 for WordPress

We like to use the Contact Form 7 plugin to create your contact form (unless otherwise specified, of course). This is a great plugin that has many different options and features. You can get quite creative with these forms and you don’t even need to know any coding or HTML. This is a really nice bonus — after all, you are an author, not a web developer. That’s our job!

To get started modifying an existing form you can follow these steps:

1. Log-in to WordPress

2. In the navigation menu on the left, go to “Contact” and select “Contact Forms”.

3. You will see a new screen that lists all the contact forms you currently have running on your author website. Go ahead and click the name of the form you wish to modify.

Adding a New Field

On the next screen you will get a first-hand look at the nuts and bolts of the contact form fields. The top left-hand box is the place where the fields are generated. This section is compiled by using some basic HTML with fields that are generated by Contact Form 7. It might look intimidating, but it is relatively simple to add new fields.

To get a sense of how the form works, you will see options like Name, Email, Subject and Message that will match what appears live on your contact page. This section will vary slightly depending on what fields already exist on this form.

To add a new field, there are a few easy steps to take. For the purposes of this example, let’s say you want to add field that reads “How did you hear about me?” and offers  a dropdown menu with a few options that a user could choose from.

To do this, take a look at the blank box on the right-hand side of the page. There will be a dropdown menu here that says Generate tag. Here you can select this dropdown menu and one of the many field types to add to the form. In this example you will select Drop-down Menu.

When you make this selection, a new box will appear that shows several small fields including Name, id, class and choices. This is a simple builder that will allow you to customize your own fields to add to your contact form. Follow these steps to create a new field with options:

1. In the Name field give your new field a unique identifying title rather than the default name and number that appear in the box. It should probably be one word and should be descriptive of your question. In this case you can use “referral.”

2. In the choices field you will add the items to appear in your dropdown menu as selectable options for your website visitors. Go ahead and fill out an option on each line.

3. You will see some code appear in a field that says “Copy this code and paste it into the form left.” Go ahead and copy the code, and then paste it in the location on the left box where you would like the question to appear. It can appear anywhere on the form, but should always go before the Send code at the bottom which usually looks something like this:

[submit “Send”]

4. In the left box, go ahead and add text before the code you pasted that asks the question. In this case you can say, “How did you hear about us?” So in the left box you might end up adding something like:

How did you hear about us?
[select referral “Google Search” “Via a Friend” “Through my Book” “Other”]

5. Back in the right-hand box you will see a box at the very bottom that reads “And, put this code into the Mail fields below.”

Go ahead and copy this code and then scroll down on the page. In a box on the bottom-right you will see a box that says “message body”. This is the e-mail you receive when the form is sent. To make sure the new field you created sends the field go ahead and add the code you copied in step #4 to the place in this field you would like to appear when you receive the email. You can also write a line of descriptor text so you recognize your new field. So you might paste:

How did you hear about us: [referral]

Into the box.

6. Finally, save the form and give it a test run!

Other Things You Can Do

It is possible to add all types of fields into the contact form — and even make certain fields required. Just make sure to fill out your preferences on the right-side box then paste the code that Contact Form 7 generates in the appropriate places.

With a bit of practice you will get the hang of it quickly! However, if you do have questions feel free to get in touch and we will be happy to help!