Map instead of Flexislider on Detail page

I’ll alert the wizards for you 🙂

Hi There, I am trying to do something quite similar but rather than replace the slider, I am wanting to move the map to a different area as I don’t want to use the tabs. I have implemented the code code above with the slight modification of trying to remove map in tabs and wrapping the new map in a div.

The new map is showing in the position that I want it to, but with a grey overlay and a loading icon which never finishes. The map is still showing in the tabs area but in the same state.

Looking in Chrome developer tools, I get the following errors related to the map:

You have included the Google Maps API multiple times on this page. This may cause unexpected errors

Uncaught InvalidValueError: setMap: not an instance of Map; and not an instance of StreetViewPanorama

These would make sense as there are two versions of the map on the page, but I am not too sure how to target removing the one in tabs.

Below is the code I am using in functions.php

remove_action( 'geodir_details_main_content', 'geodir_action_details_map',30);

function geodir_action_details_map_replace_slider(){
	global $post,$post_images,$video,$special_offers, $related_listing,$geodir_post_detail_fields;
	$map_args = array();
		$map_args['map_canvas_name'] = 'detail_page_map_canvas2' ;
		$map_args['width'] = '100%';
		$map_args['height'] = '300';
		if($post->post_mapzoom){$map_args['zoom'] = ''.$post->post_mapzoom.'';}
		$map_args['autozoom'] = false;
		$map_args['child_collapse'] = '0';
		$map_args['enable_cat_filters'] = false;
		$map_args['enable_text_search'] = false;
		$map_args['enable_post_type_filters'] = false;
		$map_args['enable_location_filters'] = false;
		$map_args['enable_jason_on_load'] = true;
		$map_args['enable_map_direction'] = true;
		echo '<div id="detailMapContainer">';
		geodir_draw_map($map_args);
		echo '</div>';
}

add_action( 'geodir_details_main_content', 'geodir_action_details_map_replace_slider',30);

Do you still have that problem once you tidy up your locations?
http://docs.wpgeodirectory.com/faqs/how-do-i-merge-locations/
For example you have a country called “all” in your database.

If you MERGE locations, you will not loose any listings, but if you DELETE a location then you will also delete all listings in that location.

You can’t have 2 identical maps on the same page, but you can have the listing map to the detail page, http://www.bookhinterland.com.au/accommodation/julies-retreat/

Hi,

taking Stiofan’s example and modifying it, without actually looking at the original code will not work.

remove_action( 'geodir_details_main_content', 'geodir_action_details_map',30);

will do nothing because function geodir_action_details_map doesn’t exist. Priority 30 is assigned to slider.

The map is called with the tabs, so you should start by removing the tab.

Here is explained how to manipulate the tabs array:

https://wpgeodirectory.com/support/topic/exclude-selected-tabs-from-detail-page-if-empty/#post-7305

Once the tab for the map has been removed you will need part of the function of Stiofan to add it back, but you will have to add it correctly.

In your function you were trying to add it where the slider is, which you had not removed and that cannot work.

Actions of the detail page are:

add_action( 'geodir_details_main_content', 'geodir_action_before_single_post',10);
add_action( 'geodir_details_main_content', 'geodir_action_page_title',20);
add_action( 'geodir_details_main_content', 'geodir_action_details_slider',30);
add_action( 'geodir_details_main_content', 'geodir_action_details_taxonomies',40);
add_action( 'geodir_details_main_content', 'geodir_action_details_micordata',50);
add_action( 'geodir_details_main_content', 'geodir_show_detail_page_tabs',60);
add_action( 'geodir_details_main_content', 'geodir_action_after_single_post',70);
add_action( 'geodir_details_main_content', 'geodir_action_details_next_prev',80);

Something like this should work.

add_action( 'geodir_details_main_content', 'geodir_action_details_map_in_content',65);

function geodir_action_details_map_in_content(){
	global $post,$post_images,$video,$special_offers, $related_listing,$geodir_post_detail_fields;
	$map_args = array();
		$map_args['map_canvas_name'] = 'detail_page_map_canvas2' ;
		$map_args['width'] = '600';
		$map_args['height'] = '300';
		if($post->post_mapzoom){$map_args['zoom'] = ''.$post->post_mapzoom.'';}
		$map_args['autozoom'] = false;
		$map_args['child_collapse'] = '0';
		$map_args['enable_cat_filters'] = false;
		$map_args['enable_text_search'] = false;
		$map_args['enable_post_type_filters'] = false;
		$map_args['enable_location_filters'] = false;
		$map_args['enable_jason_on_load'] = true;
		$map_args['enable_map_direction'] = true;
		geodir_draw_map($map_args);
}

I haven’t tested it, so let us know.

Thx

Hi,

I’ve just tested it on one of my test website:

1) Excluded Map tabs from detail page in GD >> DEsign >> Detail.

2) added this to theme functions.php file:

add_action( 'geodir_details_main_content', 'geodir_action_details_map_in_content',65);

function geodir_action_details_map_in_content(){
	global $post,$post_images,$video,$special_offers, $related_listing,$geodir_post_detail_fields;
	$map_args = array();
		$map_args['map_canvas_name'] = 'detail_page_map_canvas2' ;
		$map_args['width'] = '600';
		$map_args['height'] = '300';
		if($post->post_mapzoom){$map_args['zoom'] = ''.$post->post_mapzoom.'';}
		$map_args['autozoom'] = false;
		$map_args['child_collapse'] = '0';
		$map_args['enable_cat_filters'] = false;
		$map_args['enable_text_search'] = false;
		$map_args['enable_post_type_filters'] = false;
		$map_args['enable_location_filters'] = false;
		$map_args['enable_jason_on_load'] = true;
		$map_args['enable_map_direction'] = true;
		geodir_draw_map($map_args);
}

Result here: http://dropct.com/wpgd/places/mexico/quintana-roo/playa-del-carmen/attractions/rittenhouse-square/

At the bottom of the Tabs I see the map. If I want to show it before the tabs I just have to change priority to 55 in the new added action instead of 65.

If it’s not working for you, it could be because not knowing exactly what to do, you’ve been adding functions randomly and some of them are creating conflicts.

Please delete all modifications made and try the simple instructions above.

Thx

Hi,

this should be fixed adding this css:

#detailMapContainer #sticky_map_detail_page_map_canvas2 {
    height: auto !important;
}

Thx