Want to create a WordPress real estate website? With the right tools, it's easy! Learn how to build real estate listings that WOW clients.
Want to build a real estate website with WordPress? Today I'll show you how! Using an advanced WordPress forms plugin with an application builder, you can create all the forms and layouts you need to run a functioning real estate site.
Before we get to the steps, let's agree on the main components of a real estate website:
- Real estate listings: These need to be displayed instantly after you, your team, or a client uploads their listing info to your site.
- WordPress forms: You'll need several forms on your site to upload data, receive leads, and collect customer data. For example, a real estate listings form.
- Lead magnets: To attract clients, you might consider using a simple or advanced mortgage calculator.
- Email automation: You probably want automatic emails to trigger when a customer requests info. Connecting your email marketing platform and CRM is also a must.
Still want to learn how to build a real estate website using WordPress? Let's get started.
Build a WordPress real estate website with Formidable
If you've wondered how to create a real estate website using WordPress, you're in good company. A recent survey found that 33% of homebuyers wish their agent had leveraged technology to better streamline the process.
Formidable Forms can help you take control from the very start! With a Formidable premium plugin and Formidable Visual Views installed on your WordPress site, you'll get access to two major features:
- Drag and drop form builder
- Our Views custom application plugin (similar to a drag and drop page builder)
It just takes a little bit of setup time to get started too. And our top-notch support team will always be around to help no matter what you need. Check out our pricing page to see if we are running a sale - you might be surprised!
Will this work with my WordPress theme?
Formidable plugins are fully responsive, meaning they will work with any WordPress theme you choose. If you have chosen a real estate theme but need a little more power, Formidable will fit in very well.
Our form building plugin has all the custom fields you need to build the forms your real estate site needs to thrive. Then, our Views plugin gives you the power to display your form submissions anywhere on your site.
To put it simply, you can upload your real estate listings with a form and automatically generate the property pages and easy property listings at once. For real estate businesses, this is a dream come true!
Formidable has everything you'll need to exceed most real estate WordPress themes too. Advanced search features, tons of form templates, and it's easy to customize everything. For example, create real estate contact forms with much more than an email address field.
This just might be the real estate website builder for WordPress that you've been searching for.
How to make a WordPress real estate website
This tutorial will work for other directory sites too since you can easily add any form fields you need. It is loosely based on Formidable's documentation on how to display real estate listings. (It is worth a read too if you can find a moment.)
Step 1: Load the Real Estate Listing form template
Formidable comes with a real estate listing form template. So this is a great place to start. The form template is fully customizable to suit your own specific needs and it offers the common features an online real estate listings form would have.
Go to your Forms admin dashboard, click the Add New button, and select the template in the starting screen. Use the form shortcode to place this form on the page of your choice.
For this example, I'll use the vanilla form template without any modifications. However, if you need extra fields or would like to adjust the layout to make your real estate form fit perfectly on your website, now is the time to do it.
Step 2: Create your WordPress listings page
To display your real estate listings on your WordPress website you need to create a View. This View will display the submitted properties in a grid and allow site visitors to click on them to see more details. Start by going to Formidable → Views and select Add New.
Select Grid View for the view type. Then select your Real Estate listings form in the Use Entries from Form drop-down.
Give your new View a title. This won't be visible on the site but is handy for reference. A descriptive title also makes it easier to find your View if you have a lot of them.
Add content to the listings view
This is where the real fun starts. Once you've entered your first few properties you can start to see how the layout and design look and tweak the content in your view to suit.
Next, set up the page and the form data in the grid and detail views. To create a grid, set the number of columns to 2 or 3. You may need to adjust this to suit your theme or maybe use a table layout.
Click the link to start adding content. Use the field list in the sidebar to insert field data into the View. Be sure to include a [detaillink] like this example:
<a href="[detaillink]">[photo-upload size=medium show_image=1]</a> <h3><a href="[detaillink]">$[list-price thousands_sep=","]</a></h3> [address] [city], [state] [bedrooms] bd / [bathrooms] ba [if sqft-living]/ [sqft-living] sq ft[/if sqft-living]
You'll probably want the auto paragraphs, so open the Advanced Settings section, and switch the Content Filter to add paragraphs. Also, add a Page Size while you're there to add pagination to the listings.
All the HTML can be customized to suit your needs and make your Real Estate listings look exactly how you would like. You can also use the Visual editor tab for your formatting. DON'T FORGET: swap out text like photo-upload and list-price in the example code for the IDs of your corresponding fields.
With Views, automatically display form data as soon as forms are submitted. Beautifully present, search and filter real estate listing data on the front-end.
Step 3: Enter property details and enjoy!
Once your listing page is perfected, work the same magic on your details page. The details page contains a lot more information about your property, the in-depth real estate listing. If you have included a [detaillink] shortcode in the main content, you'll see a toggle for the Detail Page.
Click on Detail Page, and click start adding content to add the content you'd like. Here's an example of what you might end up with:
[photo-upload size=medium show_image=1] <h2>[address] — $[list-price]</h2> [city], [state] [zip] [bedrooms] beds | [bathrooms] baths | [sqft-total] sq ft <b>MLS #:</b> [mlsid] <b>Year Built:</b> [year] <b>Status:</b> [property-status] <hr/> [description clickable=1] <hr/> <h3>Features</h3> <b>Living Square Feet:</b> [sqft-living] <b>General Features:</b> [gen-features] <b>Interior Features:</b> [interior]
You can even insert a NextGen photo gallery to show off the home properly.
Step 4: Publish the listing View
Finally, save your view and insert the view into a page using the Formidable Views block, or the [display-frm-data id=x] shortcode.
Troubleshooting Tip: If your [detaillink] doesn't go anywhere, go into your WordPress Settings and save your Permalinks. This is usually the culprit!
Bonus - Create a 'Featured Real Estate Listings' widget
A sidebar widget is a great way to highlight new or featured properties. This is simple to do as well. You don't need a WordPress real estate plugin to display a widget with listings.
Here are the steps:
- Go to Formidable → Views and select Add New.
- Choose the Grid View, and select your Real Estate listings form from the Use Entries from Form drop-down.
- Give the new view a title and a description for reference, if you would like.
Here is where it changes a little. This time you should not add the [detaillink]. AND set the Limit to 1 if you would like to randomly display a single featured listing that is different each time the page loads.
Design Tip: Personally, I prefer to display a random single listing. If you display all the featured properties it can overwhelm your sidebar or footer widget and look messy, especially when viewed on smaller screens.
As before, add content as needed. You can also add a link in the Before Content or After Content to view all listings. Click Sort entries right above the view content and set the Order to Random.
Only include featured listings
Finally, add a filter in the Filter Entries section at the top. Select your featured check box from the dropdown, is not equal to, and leave the last box blank. This is saying if the featured field is blank, then don't show it in the list.
Show the featured listing on your page
Save your view and copy the shortcode for your view, i.e. [display-frm-data id=x]. Go to Appearance → Widgets and drag a Text widget into your sidebar. Insert your view shortcode in the text widget, and save your widget.
Now your widget will display your featured properties!
Are you leasing the listed properties? Read 5 easy steps to the perfect online lease agreement form.
You don't need a separate WordPress Real Estate Plugin
As you can see, it's simple to create a completely customizable real estate listings page. Formidable Forms Pro with Formidable Visual Views is all you need. This tutorial has focused on functionality, so you may need to take some time to tweak your design and make it beautiful. I'm sure you'll produce beautiful real estate listings for your WordPress website.
Read more: How to add paid listings.
Need other real estate form templates? If you're building a real estate website, you may also be interested in calculators to use as lead magnets:
Getting started with Formidable is easy. Find a plan that works for you and try it risk-free for 14-days. If you don't love it, we'll give you all your money back. Or you can try our free plugin to get your feet wet!