Gold Penguin Logo with Text

Create Real Estate Custom Post Types in Breakdance Builder

Create custom post types for real estate with Breakdance Builder. Learn through this step-by-step guide to enhance your website's user experience
Updated February 23, 2024
custom post type for real estate
custom post type for real estate
Difficulty: Medium. You should know a normal amount about this tool/topic
Time Required: ~20 minutes

Planning to build a landing page for a new property listing? How about designing a website dedicated to real estate agents or companies selling properties?

The first thing that probably comes to your mind is WordPress.

But why not? After all, it’s one of the most popular and robust platforms for building websites. 

Plus, it has a user-friendly interface and a vast array of plugins and themes. For professionals with little experience in coding, this platform is one of the best go-to solutions for web development.

But here’s the thing. WordPress has its limitations when it comes to catering specifically to the real estate niche. For instance, the default post types may not efficiently represent some crucial details like property name, price, and address.

A more organized and tailored way to input and display property details on your website is to create custom post types.

With Breakdance builder, you’ll be surprised how easy it is to create one. No coding knowledge required.

Follow the steps in this guide to learn how. Let’s go!

custom post type for real estate

What Should Real Estate Pages Include?

First things first. Before creating a custom post type, let's identify the key components of a real estate page.

The specifics of a real estate webpage can vary based on your branding, whether you're a real estate agent or a property-selling company. However, certain elements must be present in your page to boost your potential sales or rentals.

Some of the must-haves for any real estate page are:

  • Property Listings - Concise details about each house, including its name, features, price, size, and address.
  • Property Description - A detailed breakdown of the property, highlighting unique features, nearby amenities, and any recent renovations.
  • Client Testimonials - Feedback from past clients can help build trust and credibility.
  • Mortgage Calculator - A tool for potential buyers to calculate monthly payments based on property price, down payment, and interest rate.
  • High-Quality Images - Clear, high-resolution photos of the property, both interior and exterior, to give visitors a visual idea of the space.
  • Contact Information - Details for potential buyers or renters to get in touch, including the real estate agent's phone number, email, and possibly a contact form.

For simplicity, let’s focus on creating a property listing. We'll make a special section where we can easily put in all the important details for each property.

How to Create Custom Post Types for Real Estate in Breakdance

First, you’ll need to create a custom header and footer for your page. If you don’t have one yet, make sure to check these separate tutorials we’ve created:

Once you have the header and footer, follow the steps below to create a custom post type for our real estate listing.

1) Install the Necessary Plugins

Go to Plugins > Add New. Find, install, and activate CPTUI and Advanced Custom Fields.

install ACF in WordPress
install CPT in WordPress

2) Create a New Post Type

With the plugins on, you'll see CPT UI on the left side of your dashboard. Enter your post details like slug and labels, then hit ‘Add Post Type.’

add custom post type

3) Add Your Custom Fields

Go to ACF > Add New. Put in your field details.

add custom fields in WordPress

To add more fields, click ‘+ Add Field.’ You can drag them to reorder.

edit fields in ACF

Under settings, set a rule so Post type is 'House'. Then, hit ‘Save Changes.’

add rules in ACF fields

4) Add a New House

Go to Houses > Add New. Enter a title and add in the house details, like the image, description, pricing, etc. 

custom post type for real estate

Once you’re done, click ‘Publish.’

5) Create a Real Estate Page on Breakdance

Head over to Breakdance > Templates.

Click ‘Add Template’ and select ‘Add Custom Template.’ Enter the template title and set the location to Single/ Houses. Click ‘Add Template.’

create template for real estate
add template title in Breakdance

6) Style It Up

Time to style the template. Click edit in Breakdance. 

edit page template in Breakdance

Here, you can add a section, picture, title, and text for house details. Click save. 

7) Make Your Text and Photos Dynamic

For photos, hit the 'dynamic' button and choose the right photo from the ACF field. Like 'House-photo.'

Breakdance dynamic photos
set dynamic photos in Breakdance

Do the same for the title and other texts. Here, I choose the address as the heading and normal text for other details.

set dynamic heading in Breakdance

Then, adjust the layout and background colors as you like.

style page in Breakdance

8) Create a Global Block 

Go to Breakdance > Global Blocks and click ‘Add Global Block.’

add global block in Breakdance

Name it and then style it up in Breakdance. You can copy a past design or start fresh.

style global block in Breakdance

Save the changes.

9) Show Off Your Listings on a New Page

Make a new page for your property listings and edit in Breakdance.

Add a ‘Post Loop Builder.’ Choose your global block from the dropdown, like ‘Individual-House.’

add post loop builder in Breakdance

Adjust the settings to show your property listings. For this, we're using 'House.'

query builder in Breakdance

Edit the other fields as desired. Then, finish with ‘Apply Query.’

10) Finishing Touches on the Layout

Tweak the layout how you want it to look. For instance, to show 3 houses per row, pick ‘grid’ with 3 items per row under the Style tab. Save your work when everything looks perfect. 

add style to Breakdance page

Here’s the final view of our House Listing page:

real estate webpage using Breakdance

Wrapping It Up

And there you have it, your very own House Listing page is ready to go!

You’ve just learned how to create custom post types for a real estate page using Breakdance.

But guess what? Breakdance has even more to offer. Try using Breakdance forms and connect them to your other apps. It's a nifty way to grab info from people interested in your properties.  

Interested? We’ve covered separate tutorials for this, so go ahead and check these out:

Having trouble with any of the steps above? Just leave a comment below, and we'll do our best to sort it out with you!

Want To Learn Even More?
If you enjoyed this article, subscribe to our free monthly newsletter
where we share tips & tricks on how to use tech & AI to grow and optimize your business, career, and life.
Written by Christy Cañete
Christy Cañete is a software engineer who's passionate about front-end web design. Not only can she code, but she writes too! She loves breaking down technical topics into super easy tutorials. If you're looking to learn without the jargon, she's your go-to.
Subscribe
Notify of
guest

0 Comments
Inline Feedbacks
View all comments
Join Our Newsletter!
If you enjoyed this article, subscribe to our newsletter where we share tips & tricks on how to make use of some incredible AI tools that you can use to grow and optimize a business
magnifiercross