Want to create a beautiful real estate website in WordPress?
I’ll show you how to do it the right way using Astra’s Ready Websites. These are pre-built websites you can import in 1-click using the Astra Starter Sites plugin. In other words, everything is already there; you just need to customize it. This is by far the easiest, most efficient way to build a real estate website in WordPress. They have multiple Real Estate themes to choose from; some are free, some are premium themes. I’ll also show you how to integrate IDX/MLS, showcase and manage properties, and even tips for ranking in Google. Because after all, how you build your real estate website also affects your Google rankings.
Your real estate website will be mobile responsive, SEO-friendly, fast loading, incorporate SSL, and format nicely when shared on Facebook. My goal is to make sure you build it the right way.
For hosting, we’ll be using SiteGround since they were rated #1 in most Facebook polls and are worlds better than Bluehost or any hosting company owned by EIG. For even faster hosting, DigitalOcean on Cloudways is usually the 2nd most popular in WordPress Facebook Groups.
Here’s what to do:
1. Get Domain & Hosting
SiteGround is a great place to get domain and hosting for real estate websites.
They were rated the #1 host in multiple Facebook polls and are much better (and faster) than EIG brands including Bluehost, HostGator, and even GoDaddy. People who moved to SiteGround usually see improved speeds, so it’s best to start with a solid host from the start.
Pick A Hosting Plan – the 3 SiteGround plans are StartUp, GrowBig, and GoGeek. The main difference is GrowBig and GoGeek can host multiples websites and come with more storage, server resources (makes your site faster), and staging. If you have the budget, I would do GrowBig or GoGeek since they are faster, otherwise StartUp will be fine is you’re just starting.
Sign Up And Choose A Domain Name – be sure to sign up through the WordPress hosting page which makes it easier to install WordPress in step #2. If you don’t have a domain name, you can register one here. You generally don’t need the add-ons (eg. domain privacy, site scanner, SEO packages) since they provide little benefit at an additional cost (they’re upsells).
2. Install WordPress
Check your email for a link to the launch wizard.
Click “start a new website,” select WordPress, and create your WordPress login details.
Once you complete the launch wizard, you get an email with your WordPress login details.
Time to login!
3. Make Your Website Secure With SSL
SSL makes sure all URLs are HTTPS and that the “lock” icon appears in your browser.
There are 2 simple steps to adding SSL to your real estate website:
Install Let’s Encrypt SSL – the first step is to login to your SiteGround account and go to cPanel → Security → Let’s Encrypt SSL, then install the free Let’s Encrypt SSL on your domain name.
Enable HTTPS In WordPress – login to your WordPress website and go to SG Optimizer → Environment Optimization → Enable HTTPS → Confirm. SiteGround will take care of the rest.
Now you will see the lock icon:
4. Download A WordPress Real Estate Theme
I highly recommend using one of Astra’s Ready Websites (I used this theme for the demo).
They are some of the nicest, most user-friendly, fastest loading, and mobile responsive templates. They’re also what most people are using now days to create WordPress sites.
Step 1: Install The Astra Starter Sites Plugin (Plugins → Add New → Astra Starter Sites).
Step 2: Install + Activate Astra’s Theme (You Will See This Prompt).
Step 3: Select Your Page Builder (Elementor is the most popular, fastest, and most user-friendly page builder for WordPress). Plus, all Astra’s real estate themes are built in Elementor.
Step 4: Choose Your Real Estate Theme: remember, you can customize everything from the images to colors, fonts, layouts, header, footer, and every part of your real estate website. Just because something isn’t the exact look you want doesn’t mean it can’t be changed. Although, it is easiest to choose a theme that is close to how you want your final real estate website to look.
Alternative Themes: if you can’t find a theme you like from Astra, I highly recommend looking at StudioPress themes as your next theme store. Their themes may be a little more difficult to customize, but they’re next in line when it comes to popularity, speed, and overall reliability. Their 3 real estate themes are Winning Agent Pro 2, AgentPress Pro, and Agent Focused Pro.
Step 5: Import The Site: Astra will automatically download all plugins, WordPress Customizer settings, content, and widgets to your real estate website. This process will take a few minutes.
Step 6: Refresh Your Website: it should look identical to the theme!
5. Install An IDX/MLS WordPress Plugin
Estatik was rated the #1 real estate plugin by Kinsta and has a 4.9/5 rating.
We’ll be using it to showcase your listings and you can view the demo here. You can use it for adding a responsive photos gallery, slideshows, property features, mortgage calculator, map views, multilingual support, and much more. The free Estatik plugin is limited but I highly recommend testing it and upgrading to the premium version which has many more features.
Install The Plugin
Go to Plugins → Add New → search/install the Estatik plugin.
Setup The Launch Wizard
Estatik has a handy launch wizard to help you get started with layouts, searches, slideshows, profiles, and other settings. It is highly recommend that you start with Estatik’s launch wizard.
Configure The Estatik Plugin Settings
Estatik has extensive documentation on configuring the plugin settings which control your real estate listing layouts, currency, map view, email, sharing, color, subscriptions, and ShelterZoom.
6. Adding Property Listings
Go to Estatik → Add New Listing → fill out the listing information below.
The fields builder lets you add additional details about the listing: description, neighborhood, features video, agent contact, documents, exterior features, floorplans, energy efficiency rating, and other details about the real estate listing. It can be text, contact details, files, etc.
Once you’ve configured the plugin settings and added listings, preview them to make sure you’re on the right track and that you like the design. Below are just a few different examples.
Individual property listing:
Map view:
Map search:
Property slideshow:
Use Shortcodes To Add Listings To A Page:
Or just use the pre-designed template that comes with your theme:
7. Manage Agents And Buyers
This section lets you create agent profiles and manage them by assigning listings to agents, hiding their listing on specific property pages, and enabling agents to register on the website.
8. Add Saved Searches And Wishlists
You can add a tiny heart icon allowing users to favorite listings and add saved searches.
9. Add A Mortgage Calculator
The mortgage calculator is a premium features that comes with Estatik Pro.
10. Name Your Real Estate Website
Name your WordPress real estate website under Settings → General. This should generally be your business name, or your personal name if you’re working as an independent agent/broker.
There are 3 steps to customizing your navigation menu:
- Pages you want in your nav menu need to be published.
- Create your navigation menu under Appearance → Menus.
- Visit Astra Options → Header to customize the nav menu design.
11. Design Your Homepage
Editing your pages is easy.
Go to Pages → All Pages → Edit With Elementor.
From here, editing is as easy as point, click, and edit.
Using Elementor Templates
You can used the pre-designed pages that come with your theme and go off that, or you can use the hundreds of free Elementor block and page templates. To do this, scroll down the page and click the folder option. Choose whether you want to add a block (individual section) or a page template (a full page template). Elementor has tons of templates for about page, testimonials, team, stats, services, FAQs, or even full page templates for showcasing your real estate listings.
Just 1 example of a full page template:
13. Design Your Agents + About Us Page
Just like you would edit your homepage with Elementor, you will do the same for your Agents/About page. Remember, if you’re not a fan of the pre-designed Agents page that comes with your Astra theme, Elementor has plenty of “about us” templates you can choose from.
14. Design Your Contact Page
Your contact page is similar only it includes a contact form.
To edit the contact form, go to WPForm All Forms → Edit. The WPForms editor lets you customize the fields, choose email(s) you want the confirmation sent to, confirmation messages, and connect it to Constant Contact. The free version is limited (they have a premium version with more options), but that depends on the features you want in your contact form.
15. Customize The Design Elements
Now it’s time to customize your website’s global design elements.
This is found under Appearance → Astra Options. You can upload your logo, favicon, change fonts, colors, header, footer, blog sidebar, and make other global customizations on your site.
This is where you upload your logo + favicon:
Customize fonts:
Customize colors:
16. Customize Your Mobile Real Estate Website
Most WordPress themes (including all Astra themes) are mobile responsive.
If you want to change something specific on your mobile real estate website, edit a page with Elementor and you will see a responsive mode option at the bottom left. This lets you view and edit the page on phones/tablets. Just like you would edit the page normally, you will point, click, and edit your mobile website as well. You can do this for any page on your real estate website.
15. Setup Your Blog
A blog isn’t mandatory, but it can help drive traffic to your real estate pages site.
Step 1: Add a page and title it “Blog”.
Step 2: In the WordPress Customizer, set the blog page as the Posts page.
Step 3: In the WordPress Customizer, decide if you want a sidebar on the blog.
Step 4: If you have a sidebar, add widgets to design it.
Step 5: Go to Posts → Categories. Add a few broad categories you will write about.
Step 6: Go to Settings → Permalinks and use the post name permalink structure.
Step 7: Write some blog posts! Be sure to target a keyword (topic) in each post!
11. Optimize Real Estate Listings For Google
Now we’ll find real estate keywords and create optimized pages/listings around them.
Step 1: Research Real Estate Keywords
Go to google.com, start typing a keyword, and look at the dropdown results. This is a great place to find real estate keywords. Be sure to find keywords for all different types of properties/services you offer and each location. Different locations have different keywords. Be sure to select long-tail (specific) phrases and avoid competing with authority sites/content.
The “fill in the blank” trick is a nifty way to find keywords:
Step 2: Create Pages Around Those Keywords
Align the keywords with your pages and create a separate page for each unique property type, location, etc. Keywords that are very similar (eg. synonyms) can be targeted on the same page.
Step 3: Place Keywords In Content
The most important place to use your keyword is in the page title, URL, content body (2-3 times is fine), and Yoast SEO title + meta description. Yoast’s lights turn green when you use the keyword, but do not obsess over these. Just use your keyword in the important places, use some internal/external links, and focus on great content. You should avoid keyword stuffing.
Step 4: Optimize Image Alt Text
By default, WordPress does not automatically add alt text to images (these are used to describe your images to search engines). The Auto Image Alt Text plugin automatically adds alt text based on the image’s file name. This means as long as you’re labeling images on your computer before uploading them (simply describing the image), the plugin will do the rest.
17. Install Fundamental WordPress Plugins
Below are a few fundamental plugins I recommend for your real estate website.
- Duplicate Page: duplicate pages to use as templates for other pages.
- Elementor Pro: grants you access to more templates and features.
- Estatik: real estate plugin for showcasing and managing properties.
- UpdraftPlus: backup your real estate website with 1-click.
- iThemes Security: secure your real estate website with 1-click.
- SG Optimizer: pre-installed speed plugin for SiteGround’s hosting.
- Yoast SEO: popular SEO plugin which you can break down into 3 steps: settings configuration, researching keywords, and content optimization (on-page SEO).
20. Setup Google Tools
You want to equip your real estate website with Google Analytics and Search Console.
Both tools are very helpful in their own ways; Google Analytics for learning about your visitors, and Search Console for finding errors (mobile, security, sitemap, indexing) and improving SEO.
Setting Up Google Analytics
- Sign up for a Google Analytics account.
- Copy/paste your UA code into a Google Analytics plugin (option 1).
- Copy/paste your tracking code and paste into your header (option 2).
- Wait several days for Google Analytics to start tracking data about visitors.
Setting Up Google Search Console
- Sign up for a Google Search Console account.
- Copy your TXT record during the verification process.
- Paste into your DNS (in SiteGround, My Accounts → cPanel → Advanced DNS Editor).
- Wait several days for Google Search Console to track data about your website and SEO.
Don’t forget to add your Yoast XML Sitemap to Google Search Console:
21. Make Your Website Load Fast
Making your real estate website load fast is good for both users and SEO.
You’re already on a good start with SiteGround, Astra, and Elementor. But there’s a few easy things you can do to make your site load even faster. I also have a full WordPress speed guide.
Configure A Cache Plugin – if you signed up for SiteGround’s WordPress hosting, their SG Optimizer plugin comes pre-installed on your site. In WordPress, go to SG Optimizer → Frontend + Media Optimization tabs and configure the settings below.
Avoid Uploading Gigantic Images – run your website through GTmetrix and check for serve scaled image errors. If you see any, it means your images are too large. I understand you want high quality images, but 2000 x 2000 pixel images are way too big. GTmetrix will show you the correct dimensions the images should be resized to (or check the placeholder images that come with your theme in the media library).
Optimize Third Party Scripts – these are any requests generated by outside website (embedded YouTube videos, Facebook Like boxes, social share counts on the blog, or anything that pull information from outside websites. Some third party requests can be optimized, others cannot. But it’s important to know they can slow down your site.
Avoid Bloated Plugins – these 65+ plugins are notorious for slowing down websites (that’s why it’s always best to test your site in GTmetrix after a plugin is installed).
22. Make Your Website Format Nicely On Facebook
You can upload custom images to make your real estate website look nice on social media.
To do this, you will need the Yoast SEO plugin installed. Next, edit a page and scroll down to the Yoast SEO section where you’ll see options to upload custom images to Facebook and Twitter. This mean you need to create custom graphics specific sizes (it can be an image of a property).
- Facebook image dimensions: 1200x630px
- Twitter image dimensions: 1024x512px
Once uploaded, copy and paste the URL to Facebook for testing:
How it would look if you didn’t upload custom images:
23. Get A Custom Real Estate Website Design
Looking for a custom, professional real estate web design?
We create beautiful real estate websites in WordPress that are optimized for search engines (including local SEO and Google Maps). Their also completely custom (meaning we don’t use themes). Contact us and we can schedule a talk to talk about your real estate website needs.
Cheers,
Tom
Keep reading the article at Tom Dupuis. The article was originally written by Tom Dupuis on 2020-06-07 20:31:54.
The article was hand-picked and curated for you by the Editorial Team of WP Archives.