Adding a Contact Form to your Site

There are two main options to have people contacting you through your OpenCUNY site. Both options are plugins: WP Jetpack and Contact Form 7. With either option, the end result is an email generated to you.

(of course, you could always go with posting an email address instead of a form, and if you want to avoid spam you could write the address out like yourname [at] gmail [dot] com)

Contact Form 7 is the more “old school” way to do this. It’s a plugin you activate specifically for contact forms. WP Jetpack (read more here) is a suite of plugins all put in the same place, and is constantly adding more functionality; they have recently brought in contact forms into their special features. Jetpack is more streamlined and simpler, but Contact Form 7, though more complex, allows you a bit more flexibility and customization.

The first step for either option is to install the plugins while in the dashboard of your site. Look for their names and then click activate. Once Jetpack is activated, follow the steps here to set it up. Once Contact Form 7 is activated you will see a new option in your Dashboard sidebar called “Contact”.

If going with the Jetpack option, in your Dashboard click Jetpack –> Settings. You’ll find “Contact Form” in the list and you should click Activate. Once you do this, when you now open the edit view of a post or page, you will see this option available to you:

Screen Shot 2016-07-10 at 9.25.32 AMThe form builder that pops up when you click on Add Contact Form will walk you through setting up your contact form, and to which email address(es) your form should send. And that’s it! (Note: Choose this option if you would like your form content to be sent to multiple email addresses because it is more buggy with Contact Form 7 when sending to multiple people).

Contact Form 7 works a little differently. In Contact Form 7, you create a form independent of a post, and then you later embed the contact form code into any post or page. This might be a better option if you have a very complex contact form where you are asking the person contacting you to fill out a lot of information–and you want to have this information displayed in various pages on your site. In Jetpack, you would have to recreate this in every post by clicking on Add Contact Form and adding extra areas to each form. However, in Contact Form 7, you just do this once, and then can embed the same form in as many places as you like. You can even add the contact form into a widget area to display in your site’s sidebar!

When in your dashboard, click Contact–> Add New. Contact Form 7 displays in HTML. The default is already set up to a basic contact form.

Screen Shot 2016-07-10 at 9.34.22 AMIf you would like to add more information you can use the buttons to generate new HTML for you, or if you know how to write in HTML, you can go ahead and write it out yourself.

Once you have done this, you will want to paste the contact form shortcode in to your post, page, or widget area. You can find your shortcode by clicking in your sidebar Contact –> Contact Forms.

Screen Shot 2016-07-10 at 9.41.47 AM

And remember to contact your OpenCUNY Coordinators with any questions. You can use our contact form to get in touch (which we built using Contact Form 7).