How to Make Mad Lib Contact Forms in WordPress

I love Mad Libs, they are so much fun.  I remember as kids we’d worry about getting into trouble because we’d always fill the blanks with colorful expletives.   There’s something fun about “filling in the blank” whether it be Mad Libs or a game or in this case a form.

I decided to put a Mad Libs style form on this site because of two reasons. One, I thought it’d be a fun styling challenge and two I’ve heard that they convert better. There are a few articles out there referencing this, most are referring to Jeremy Kieth’s Huffduffer Sign-up Form shown below.
[note]”Mad Libs” Style Form Increases Conversion 25-40% – Luke Wroblewski [/note]

Now I am not asking people to sign up for a service so creating a narrative around filling out a contact form may not increase conversion. In fact it may inhibit it. If I’ve gotten people to the point where they want to send me information or request a quote and they find this form style difficult then it can have a negative effect. However I’m willing to try and see how it goes.

If you’re interested in how I did it, I’m using the Contact Form 7 plugin for WordPress. Below is a screenshot of the Contact Form 7 settings so you can see how it looks. I combined the “placeholder” attribute with some css to create the desired effect.


If you’re using a “Mad Libs” type form on your site I’d love to see how you do it and know if it actually converts better for you.

4 thoughts on “How to Make Mad Lib Contact Forms in WordPress

  1. Hi Jay

    This is something you can do easily by passing the wrapped content in your php. I prefer to see the wrapped content in my emails so I get the full context.

    Like

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s