• Home
  • Documentation

Documentation

Map

FW Real Estate tutorial for Joomla!

FW Real Estate Map module configuration and settings

FW Real Estate map module allows to display a Google map with all your property locations. In this tutorial, we will learn how to configure the map module.

We will proceed as follows:

How to integrate your real estate website with Google Maps

To integrate your real estate website with Google maps, do the following.

  1. Get an Api Key and copy it. To get Google maps Api Key, review google maps documentation - maps/documentation/geocoding/get-api-key">https://developers.google.com/maps/documentation/geocoding/get-api-key.

  2. Locate Components dropdown in the top menu of your Joomla control panel and click on it.

  3. Choose FWRE Realtor=>Configuration from the list.

  4. Switch to the General tab.

  5. Find Google map section.

  6. Locate Hide Google map field and select No.

  7. Mouse over Google map Key textbox and paste the Api Key you have copied.

  8. Locate Google map Zoom dropdown and select 15. You set the desired start zoom level.

  9. Click Save button. Your screen should look similar to the screenshot below.

How to configure FW Real Estate Map module

Now that you have integrated with Google maps, let’s enable FW Real Estate map module.

  1. Locate Modules section following Extensions=>Modules direction.

  2. Find FW Real Estate map module using the search bar.

  3. Enable it clicking the check button.

Now, let’s configure the module.

  1. Click on the module title.

  2. Locate Module tab and configure it. Assign position to the module and give it a title. Use the sample parameters listed in the map-module-configuration-and-settings#fw-real-estate-map-module-configuration-and-settings">FW Real Estate map module configuration and settings section of this tutorial. Your screen should look similar to the screenshot below.

  1. Switch to the Menu Assignment tab.

  2. Locate Module Assignment dropdown and select On all pages. Thus, the search will be displayed on all pages of your website.

  3. Locate Options tab.

  4. Locate map height field and enter 450 into it.

  5. Click Save button.

Once the settings are saved, go to the front-end to see how the module is displayed.