Have you ever been to a Realtor’s website and seen a contact form at the end of a listing? Maybe it said something like “Contact Me About This Property!” That’s cool. I like the clear call to action – it’s a great way to direct a potential buyer to the next logical step (contacting you!). In the WordPress tutorial below, I’d like to show you how to add a contact form at the end of your property listings AND dynamically pre-populate one of the form fields with your property address, like this:
Here’s are the components you’ll need to follow along:
- A website running WordPress
- The Winning Agent Pro theme (or any theme for the Genesis Framework 2.0+)
- Gravity Forms plugin
- AgentPress Listings plugin
Additionally, you’ll need to be unafraid of editing a little PHP in your site files. If you’re new to editing WordPress files, please take a moment to read this tutorial first.
Step 1: Create a Form
I’ll assume you’ve already got some listings set up in the AgentPress Listings plugin. We’re going to dive into creating your “Contact Me About This Property Form” using Gravity Forms. Once you’ve installed Gravity Forms and activated your license, you’ll see a Forms menu added to your WordPress dashboard. Go to Forms > New Form. You’ll be prompted for a form title and description. Enter whatever you want. I’m not bothering with a description, but I’ll title mine “Contact Me About This Property.” From there I’ll create a basic form with Name, Email, Property I’m interested in (single text line field), and Message (paragraph text). If you need help setting up this part of your Gravity Form, check out more detailed instructions here. My basic form now looks like this:
Step 2: Add Form to Your Listing Pages
There are two ways we could go about this. The first is what I’ll call the manual option: You can manually insert the form (via shortcode) at the end of each and every listing you create. A bit tedious, right? The second option is to dynamically add your form to every listing. It takes a tad more effort up front, but once you set it, you can forget it! I like this second option better. To dynamically display your form, you’ll need to know your form’s ID. You can get this from the top of the form editor screen. Once you know you’re ID, open your theme’s functions.php file (be careful!) and insert this code, substituting my form ID (13) for your own. I’ve commented the code to explain what’s happening and you can remove those comments if you want. Be careful to remove the opening php tag, per the instructions in my code comments or you will get a white screen of death. 🙂 Save your file, upload it to your server, and you’ll now see your blank form at the bottom of every listing. Cool, eh?
Step 3: Dynamically Add Listing Title to Form
Let’s take this a bit further and auto-populate the Property I’m interested in field with our property address (which happens to be the property title). Regardless of which option you went with in the last step (manually inserting your form or dynamically embedding it), you can use the code I’m about to share to auto-populate your form. First, we need to go back to the form editor and add a little something special to our form. Expand the Property I’m interested in field and click the Advanced tab. From there, check the box that says Allow field to by populated dynamically. Next, enter the value property_name
in the parameter name field. We’ll refer to that value in our code shortly. Save your form. Now, let’s go back to your functions.php file. Add in this chunk of code, taking care to remove the opening php tag like before. You won’t need to edit any of this code, assuming you used the same parameter name I’m using in this example. Save your file and upload it to your server.
Step 4: Enjoy Your Work
Alright! Now, every listing you create with AgentPress Listings will automatically include a Gravity Form at the bottom, with the listing’s title (address) already entered. You’ve made it easier on your leads (they can skip having to enter a property address) and easier for you (you know exactly which property a lead is interested in). Now get out there and drum up some business! 😉
Thank-you for this, it works great. However, on the Winning Agent demo (http://demo.winningagent.com/winning-agent-pro-theme/listings/8505-park-ave/), the pre-populated field is a Drop Down menu, not a single line text field.
How do we pre-populate a drop down field with the property name?
Thank-you.