In 2009-2010 Custom Contact Forms was one of the first WordPress plugins I wrote. The purpose of the plugin was to solve a simple problem: easy contact form building on the web.
As I was building the plugin, WordPress 3.0 had not yet been released, and therefore custom post types and other useful API’s did not yet exist. I wrote the plugin the best I could using custom database tables (ouch!). The plugin become decently popular. I continued development on the plugin for the next year or so. In the process I learned a lot about writing code for WordPress. Also in the process I landed a job at 10up where I learned (and continue to learn) more than I ever thought I would.
Years later in 2015, here I am an experienced WordPress developer and an avid open source contributor. I have used most of the popular WordPress form plugins: Gravity Forms, Ninja Forms, Formidable, etc. Using all these plugins, despite lots of great functionality, have left me with the nagging feeling that something is missing.
That something was the WordPress experience. With the release of the media manager in WordPress 3.5, we have all grown accustomed to a high quality media management experience through smooth JavaScript interactions. Form management should be no different; they should be built within a media manager-esque modal, no page reloads should be necessary, and we should get live previews of what we are building. Simple task right? 8 months later… 🙂
Detailed installation and usage instructions are on Github. Download the plugin from WordPress.org
For Users
Within the post edit screen, a simple “Add Form” button next to the “Add Media” button brings up the form manager modal:
Within the form management modal, you can also see your existing forms and edit them if you choose:
After inserting a form into a post, you see a nice preview within TinyMCE:
While the meat of the plugin lies within the form manager, single form views exist. Within a single form view you can see a live form preview:
Also within the single form view lives the form submissions table. You can easily paginate through results and add/remove columns as you please:
For Developers
Most of the plugin is written in JavaScript. Custom Backbone views, models, and collections are written to emulate and display forms and fields. The plugin is extremely extensible. You can easily hook in to modify existing fields and views as well as create your own.
The plugin includes the new JSON REST API for WordPress. Right now, it is included as a Composer dependency for various reasons until the API is added to WordPress core.
Note: While the plugin is suitable for production environments, version 6 is still somewhat in beta. Please let me know on Github if you experience any problems.
Taylor Lovett 
Pingback: Custom Contact Forms Redux | The WordPress C(h)ronicle
This looks awesome 🙂 to be honest i have never used your plugin but i am intrigued by it. I love the media manager experience and if it was up to me, i’d use it everywhere! I’m curious about your wp-api integration, i haven’t looked at the code yet, how are you using the wp-api?
The API is used to power all the JS views – creating, reading, updating, and deleting forms/fields. It also powers reading submissions.
I have a custom made page builder plugin and I’m considering adding a page element for CCF. Can you add a filter to remove / hide the TinyMCE integration so I have programmatically disable the functionality without modifying the plugin directly / relying on the user to do it? It doesn’t make sense in my scenario and I’d rather not support that part.
Can you post an issue in Github? Happy to add a filter where you need it.
I love the look and feel of this plugin. Great job! The previous version was a little hard to get used to but it seemed to have a bit more functionality. I was wondering if you will reintroduce the ability to upload files in the form soon? The forms I have made on my site are really useless without that feature. (oh and thanks for fixing the glitch with pressing “ENTER” while filling out the form)
Hi Taylor, I have a client that is running 5.1.0.4. With the awesome work you have put in on 6, we are looking into upgrading. I notice that 6 breaks backwards compatibility and that we will need to update the database when we upgrade. Is the upgrade automatic or is it something we will need to do manually? Is there anything in particular we should look out for in the upgrade? The new UI looks great and we can’t wait to try it out. Thanks!
I like your plugin so I clicked on a link that said ‘donate here,’ but I don’t see a donate button. Where can I send you some dough?
Donate button fixed in latest version. Thank you.
Taylor-Sorry, I will submit issue, via the Github.-Thanks!
Hi! Great job. This plugin helped me a lot. I just want to ask if it can give a code that embeds the ‘submissions’ table to your site. Thank you.
hi there taylor!
very good job on this new update, very much more user-driven and good looking.
However, i am still looking for the export option that was available in the general settings of the previous version. Could you tell me where to find this please?
thxs
For now, you will have to leverage the default WordPress export/import process. However, this is in tested so there are no guarantees.
Hi Taylor,
Thank you so much for “Custom Contact Forms”. I have it up and running (my work on the page is not over yet) at http://www.knowledgenie.com/contact
I wanted to know if I can control the width of the form. I don’t want to span all across the width of the page.
Thanks
-Shiv.
Hey Shiv, the best way to do that is by adding custom CSS to your theme.
Hello, i really like your form. And it works great, mostly. In the paragraph text on my site the font color is white. In the single line text the font color is black. The white color is invisible. How do i proceed to fix this issue. The site is in dutch.
Hi Taylor,
Great plugin and super straightforward to use. Is there any way to autofill fields like name/email etc from the user that is already logged in? For example i’m using woocommerce and it’d be great if a customer is logged in and uses a form to have some fields already filled with basic data.
Thanks for sharing this great plugin.