How to Develop a Multilingual Real Estate Site with WordPress and no PHP

August 11, 2015

See how Antonio Almeida who considers himself as “a marketer who knows how to put things together with WordPress”, built a custom real estate site (multilingual, in 3 languages) using Toolset plugins, without writing PHP.

About the project

imalk.com - a multilingual real estate site built with Toolset plugins
imalk.com – a multilingual real estate site built with Toolset plugins

imoalk.com

This site was requested by Imoalk, which is a real estate company operating in Algarve, a city in south Portugal.

The client needed a custom solution to present their property portfolio and a light CRM solution to manage relations among properties, property owners, and property prospects.

There was an additional requirement to make the site available in three languages: English, Portuguese, and French.

Why Antonio selected Toolset

Essentials for real estate sites (custom search and detailed descriptions of properties)
Essentials for real estate sites (custom search and detailed descriptions of properties)

Here are some must-haves for real estate sites:

  • Properties described by details specific to the real estate field
  • custom listings of properties
  • property search
  • ability to feature certain properties

To bring the real estate site to life, he needed to focus on solutions for creating custom content.

When asked how he happened to run across Toolset, he explained:

“I found a reference link in a forum discussion about ‘creating more complex and custom WordPress sites.’”

Thus, after playing with Types he began to look at Views and the other Toolset components as a solid foundation to create more complex WordPress websites for different projects.

Antonio chose Toolset because it had everything he needed, including:

  • a possibility to create custom post types and custom fields (Types)
  • a possibility to manage relations between properties, property owners and property prospects (Types and Views)
  • a possibility to display properties in different ways (Views)
  • a possibility to create custom forms (CRED)
  • a possibility to hide some custom post types from owners and prospects CPT (Access)

Toolset plugins work flawlessly with WPML (the WordPress Multilingual plugin), which was definitely a deciding factor.

Antonio would rather not use featured themes packed with custom options. In his opinion, they don’t provide much flexibility—especially for nonprogrammers.

Choosing Toolset Bootstrap Theme as a base

Example real estate site built with Toolset that helped Antonio start with his own
Example real estate site built with Toolset that helped Antonio start with his own

The Toolset Bootstrap Theme (renamed now as Toolset Starter) was simple and, as Antonio says, luckily uncluttered with “all-purpose” elements most ready-to-use themes usually contain. Thus, he could easily add all he needed with Toolset plugins.

“I used Toolset Bootstrap Theme because I liked the “real estate” demo site available through the Framework Installer*.”

This is how he justified his decision.


hint *If you are new to Toolset, the Framework Installer is a plugin (available for download from your Toolset account) that allows you to create a copy of any Toolset reference demo sites in your WordPress installation and use it as a reference point or a foundation for further development.

Installing the Toolset Real Estate example was the first step. Next, Antonio just removed some of the default features he didn’t need and added a few others.

Customizing the site

Antonio got started by adding some specific custom fields and taxonomies to properties using the Types plugin. He also created child custom post types (Prospects and Owners) with Types to set up the relationships between his custom post types.

Custom post types for Antonio’s real estate project

Custom post types and taxonomies in Antonio’s site
Custom post types and taxonomies in Antonio’s site

  • Properties (child of Owners and Recruiters)
  • Owners
  • Recruiters
  • Prospects
  • Contacts (child of Properties—used to store contact entries from the form on single property pages; see the picture below)
  • Owner notes (child of Owners)
  • Prospect notes (child of Prospects)

Custom fields are essential for real estate sites

Next, Antonio needed to enhance the Property Custom Post Type with details. For this, he used the Types plugin again and added Custom Fields and Taxonomies. This made the site’s backend really easy for the end user to quickly insert new properties.

Displaying property details on the site’s frontend wasn’t difficult either. Using a Content Template with the Views plugin did the trick. A property page was fully customized without a single line of PHP. The outcome is awesome—see the screenshot attached:

Single property page on imoalk.com—gallery and property details
Single property page on imoalk.com—gallery and property details

Single property page on imoalk.com- map and contact form
Single property page on imoalk.com- map and contact form

Custom search engine for properties

The heart of any real estate site is no doubt a custom search engine that allows a visitor to quickly find properties by different search criteria. Antonio’s site is no exception.

Property search on imoalk.com/search-properties/
Property search on imoalk.com/search-properties/

Most WordPress developers find building a custom search with WordPress to be a challenge. Indeed, the perspective of struggling with PHP to build a search for WordPress custom posts doesn’t seem encouraging.

Surprisingly, building the search prototype turned out to be a piece of cake for Antonio.

He used the Views plugin to handle it.

The Views plugin is famous for its support of the Custom Search feature; you just create a special View.

Antonio built the first version of his property search engine without any problems. Using a similar example as a reference point also helped.

Setting up filters for a property search
Setting up filters for a property search

The Query Filter section of the Views plugin allows you to define the custom search criteria:

  • you can use taxonomies,
  • you can use custom fields,
  • you can use different comparison functions (Antonio used the BETWEEN and LIKE, see screenshot attached).

Everything is done via a friendly GUI. Views generates the outcome for you.

Now Antonio faces a new challenge: how to show featured properties first in the results.

Custom contact form for each property

If you look at a single property page, you will see a contact form on the right sidebar. The interesting thing about this is that it allows a visitor to contact the agency for details about this particular property only.

Each Property has an individual contact form
Each property has an individual contact form

This form was built without PHP coding using the CRED plugin, a Toolset component for creating forms based on Custom Post Types.

Antonio reveals the trick he used to achieve his goal.

“I used CRED to build a contact form. This was easy to achieve. We just needed to configure it on form notification settings. I added a read-only field with a post title value {{wpv-post-title id=’$current_page’}} so the sent contents always include a reference to the property.”

Limiting access for some users

The site’s backend uses a light CRM. Antonio didn’t want data of Owners or Prospects to be available to everyone, so he restricted access to these Custom Post Types for admins and editors only. With the Access plugin, this was possible with a few clicks:

The Access plugin used in the real estate site
The Access plugin used in the real estate site

Making the site multilingual

Antonio had been a successful user of WPML (the most popular multilingual plugin for WordPress) before he found Toolset. In this case, choosing WPML to present his site in three different languages was an obvious decision.

He knew that using a minimalistic, “custom feature-free” theme would make the process of adjusting a site to different languages a piece of cake. This was why he preferred to use a simple theme and extend it with custom content beyond the theme’s control.

If your site is built with a simple WordPress theme and all extra functionality is covered using WordPress standard features such as Custom Post Types, Taxonomies and Custom Fields (coded with best programming practices!), turning it into a fully multilingual site becomes easy.

If you create a multilingual site with Toolset plugins, you don’t need to worry about compatibility issues either. We, as the authors of both Toolset and WPML plugins, take care to make all of your plugins mutually compatible.

The WPML plugin comes along with the so-called String Translation extension, which allows you to translate any custom strings coming from different sources. The picture below shows how WPML helps translate Custom Fields created with the Types plugin.

Please note that by using the context filter (top right corner) you can easily limit the results to strings registered with Types plugin only.

Translation options defined with the Types plugin (left side of the image) with WPML (right side of the image)
Translation options defined with the Types plugin (left side of the image) with WPML (right side of the image)

If you use Views together with WPML all strings to be outputted on the frontend are wrapped with some special  {{wpml-string}} shortcodes. Thus, they will be ready to translate in the String Translation panel of WPML in the same way as presented for Types in the previous picture.

If you use Views together with WPML, all the strings to be outputted on the frontend are wrapped with some special  shortcodes.
If you use Views together with WPML, all the strings to be outputted on the frontend are wrapped with some special {{wpml-string}} shortcodes.
If you use Views together with WPML all the strings to be outputted on the front-end are wrapped with some special {{wpml-string}} shortcodes.

In a nutshell, this is what you, as a WordPress developer, can do to make your site multilingual-ready. Here’s the full documentation on how to use Toolset plugins with WPML

From your site editor point of view, the translation becomes even easier! This is how Antonio summarizes it:

“Toolset and WPML work 99.99% fine with each other. I can’t remember having any issue implementing it, and my client (the person who manages the content) didn’t have any complaints. He just needs to add a property, duplicate it to the other languages and then edit/translate it.””

Here’s an example of how a single property looks in two languages—English and Portuguese—when you browse it from within the WordPress admin.

Single property in the WordPress backend - Portuguese version
Single property in the WordPress backend – Portuguese version

Single property in the WordPress backend - English version
Single property in the WordPress backend – English version

Summing up

Antonio’s case proves that highly complex (and even multilingual!) sites can be built without a much effort if you know what WordPress plugins to use and how to combine different pieces.

Even though he is not a PHP developer, he managed to build a site for a real estate agency with a great user interface for both visitors and editors. Everybody is satisfied, so the answer to the question asked in the opening paragraph seems to be obvious.

About the Antonio

image16
Antonio Almeida—the site’s author

Antonio Almeida the site’s author, has run a web developing and web hosting business as a freelancer since 2005.

He says that he has become “pretty good” at finding solutions for his clients. However, he is not a programmer or a designer. He chose WordPress as the base platform for his projects.

“WordPress is a wonderful CMS. I use it because it is a reliable development tool with an enormous source of plugins that can be used to build powerful applications even if one does not know how to code.

I’m a marketer who knows how to get things done with WordPress and third-party plugins. Almost everything can be accomplished with WordPress, and this is where Toolset comes around. :)”

 

Comments 6 Responses

  1. The Antonio is an excellent professional that not a few doubts. For me nothing surprised me in this work it. Congratulations to Antonio and continuation of many excellent works like this.

  2. Any chance of providing a more detailed training article (and video) on how to build a ‘directory’ website for ‘service providers’ rather than classifieds or real estate.

    • Hi Chris,
      how would you define ‘directory’ website for ‘service providers’? What should be included in such a website?

  3. Thank you Agnes for the follow-up to my earlier comment.

    I believe that a directory of ‘service providers’ is different than it is for ‘classifieds’, but I accept that others may see no real difference at all.

    A directory of ‘service providers’ is about selling people, which I think requires a softer selling approach. Whereas selling products is more ‘straight forward’ in that it involves a picture, a price, a brief description, and how to buy it.

    In selling ‘service providers’, a lot of trust has to be developed in the individual service provider. For example, in looking at a directory for ‘child psychologists’ where parents are considering the future of their child being hugely influenced by the individual psychologist would involve a lot more confidence building in that service provider and therefore the website, than does the presentation of a pair of red shoes.

    A lot of information about the individual service provider is required in such a directory. I suppose this could be included in the main body of text about the person rather than placed in custom fields.

    The searchable terms may also be more complex in that there are multiple relationships between many of the search terms such as location, names, type of client group, age, and categories.

    Agnes, I hope this is a little helpful. I would love to see a demo site for ‘service providers’ developed by you guys that I could then use it.

    Cheers
    Chris

    • Thanks for clarifying Chris.

      I think that the ‘service providers’ site differs from a typical classifieds only in terms of presenting the information on the site’s front-end. In terms of structures used it would be similar: if you want to search the providers on specific criteria you have to implement them as custom fields and taxonomies first. If you use the main body, as you suggested, you won’t be able to use the information provide as filters for your search.

      “location, names, type of client group, age, and categories.” I think that custom fields and/or taxonomies are ok to implement all of these.

      Actually I was planning to use Consultants CPT for the ‘Parametric Search’ tutorial for this new series of “Getting started with Views” tutorials and allow to search the Consultants on similar criteria:

      – location
      – availability
      – customer project budget
      – language
      etc

      Of course sometimes you need more complex databases and the relations between your Custom Post Types. It depends on the specific project requirements which might vary for each individual case.

  4. Thank you Agnes,

    That sounds good. I look forward to the tutorial on parametric search using consultants as an example.

    Cheers
    Chris