This task is very complex and should be tried only by the persons that are fluent in php and javascript.

In a few words (process is explained in reverse order here)

You add infobox  data (image, text etc) by using properties attached to the actual marker. So the data you want to be inserted into infobox must first be “attached” to the marker.

You attach the data to the marked when you create it

The data you need to be attached to the marked is received via an json object created .

The json object is created in php .



The detailed explanations 

The json onject that have all the listing details  is generated   via wpestate_listing_pins() function from pin_managment.php  at line 55 . If you want to add extra info you need to make sure you user rawurlencode like in this line

$place_markers[]    = rawurlencode ($single_first_type);

After you get all  the info in $markers array we applye the json_encode function.


The pins data is then  attached to googlecode_regular_vars  in css_js_include.php at line  308 (to be used in google_map_code.js file)

'markers'           =>  $json_string,


In google_map_code.js file we have this code  that start placing the marker on the map

if (markers.length>0){
setMarkers(map, markers);


The function setMarkers location is called from js files like  google_map_code.js (default map file),  google_map_code_contact.js (for contact page),  google_map _code_listings.js (for property page )

In js/google_js/mapfunctions.js

The creation of all the pins is happening in the setMarkers()  function – around line 38. Here we look trough a location object and call the createMarker function from above.  Please note that we  have this “if ” check for custom search fields



The information we add into these infoboxes are “attached” tot he actual marker (pin) when we create it. This happend at line 242 in the same mapfunctions.js file via function createMarker()  ( line 241)

There is if block there : if you use the custom fields on advanced search or if you don’t . This is because the listings can be filtered over google map , so we need to attach the listings properties to the marker.



Here we attach the price , category, link etc….



The infobox (the listing image over the map when you click a pin) is created in javascript when you click on the pin. This is done in mapfunctions.js around line 335 via

google.maps.event.addListener(marker, 'click', function(event) {


The actual information that is display inside that infobox (image., title, price etc) is added at line 390

infoBox.setContent('<div class="info_details"><span id="infocloser" onClick=\'javascript:infoBox.close();\' ></span><a href="''">'+info_image+'</a><a href="''" id="infobox_title">'+title+'</a><div class="prop_detailsx">'+category_name+" "+in_type+" "+action_name+'</div><div class="prop_pricex">'+this.price+infosize+infobaths+inforooms+'</div></div>' );