Google Maps not showing – No errors in console

[stellaractive]

There seems to be a conflict with my theme and Google Maps not showing up on events. I do not, however see any errors in console. Can you check this event and see if you see anything?

https://www.gchouston.org/event/flowers-in-fashion-floral-arranging-workshop-inspired-by-the-glamour-and-romance-of-oscar-de-la-renta/

[Victor]

Hi Cheryl!

Thanks for getting in touch. Let me help you troubleshoot that issue.

I’m not able to see the map either and like you say, there are no console errors showing up.

Is this happening for all other events or just this one?

I see you have tried the following:

• Deactivated all other plugins? Yes
• Switched to a default theme? Yes

Did you happen to notice a difference when deactivating all other plugins or switching to a default WordPress theme, like Twenty Seventeen? What happens if you try deactivating all plugins and switching to the Twenty Seventeen theme together? Do you notice a difference then?

If you see no difference in those conditions, then we’ll need to do some deeper troubleshooting.

Let me know about it.

Thanks,
Victor

[stellaractive]

Yes, I tried that and it starts working when I switch the theme but shows no reason why. Like I said there are no errors in the console and I can’t figure out what it is about your plugin that is conflicting with my theme. I use other plugins that call google maps api with no issue using the same theme.

[Victor]

Hi Cheryl!

Thanks for confirming that.

Could you please share a copy of your theme in a private reply? I will try to reproduce this issue in my own local installation to see if I can find the source of the problem.

Thanks,
Victor

[stellaractive]

This reply is private.

[Victor]

Hi Cheryl!

Thanks for sending over the themes. I do have ACF Pro to test it.

I could not reproduce the issue in my own local installation, but having a closer look at your site I found that the gmap div container has a wrong id assigned, which causes the map to not render. See below:

You should check the map.php template file located at /wp-content/plugins/the-events-calendar/src/views/modules/ That is where the id is assigned to the container with the map $index variable.

I hope that helps you locate the conflict! Let me know how that goes.

Best,
Victor

[stellaractive]

I have the pro version so in /wp-content/plugins/the-events-calendar/src/views/modules/, actually it’s, /wp-content/plugins/the-events-calendar-pro/src/views/pro/modules/meta and the only file in there is additional-fields.php. The map.php file is in /wp-content/plugins/the-events-calendar-pro/src/views/pro/.

I’m not sure what you instructing me to change here, if the id is wrong, isn’t that a bug in the plugin? I am not overriding this file in my theme. And if it is wrong, where and what am I supposed to change?

[Victor]

Hi Cheryl!

Even if you are using PRO, the template that is used to render the map in the single event page is the map.php template file located at /wp-content/plugins/the-events-calendar/src/views/modules/ 

In that template the $index variable holds the map identifier that is used to be printed in line 19:

<div id="tribe-events-gmap-<?php esc_attr_e( $index ) ?>" style="<?php esc_attr_e( $style ) ?>"></div><!-- #tribe-events-gmap-<?php esc_attr_e( $index ) ?> -->

The template is used inside the tribe_get_embedded_map() function. That function is being called from the map.php template file located at /wp-content/plugins/the-events-calendar/src/views/modules/meta/

My guess is that the $index variable is being modified somehow before being sent to the map.php template.

Another thing I noticed is that you are using a template called page-events.php as the Events template, which I’m not able to select in the themes you sent. Try selecting a different template by going to Events > Settings > Display tab. Does it change anything?

If it doesn’t, then I’d suggest you get in touch with the theme authors and let them know about this so they can offer some insight on this matter.

Let us know how that goes.

Best,
Victor

[stellaractive]

That page template didn’t change anything. Are you telling me that I should define the ID? I doubt I can reach the theme author, my theme is a blank wordpress theme that I have modified to suite my needs. Do you see anything in the parent functions.php file that could be conflicting with the $index? I don’t understand why I have never had this type of problem with Google Maps rendering before.

[Victor]

Hi Cheryl!

Thanks for following up with this.

I’m sorry it doesn’t work by selecting another template.

What I meant to explain before is that the $index variable is being altered somehow by your theme, another plugin or even a custom snippet.

I know you mentioned that changing theme solves the issue, which might indicate it’s a theme conflict. But, as I could not reproduce the error myself using the theme you provided, it makes me think there could also be something else involved, like a plugin or custom code.

Just to confirm, does the map work by switching to the parent theme? If it does, this narrows the problem down to the child theme. In which case, I would try deactivating all other plugins to see if the issue persists.

Let me know about it so I can further help you troubleshoot this.

Best,
Victor

[stellaractive]

That’s a nice catch. I didn’t think that it could be a snippet. I went through the child’s functions and started removing them one by one until the map worked and I discovered the culprit. It’s this snippet to change billing details to Customer Information:

<?php 
add_filter( 'gettext', 'upload_wp_text_convert', 20, 3 );

function upload_wp_text_convert( $translated_text, $text, $domain ) {
    switch ( $translated_text ) {
        case 'Billing details' :
            $translated_text = __( 'Customer Information', 'woocommerce' );
            break;
    }
    return $translated_text;
}  
?>

Can you see what about this snippet is causing the problem?

[Victor]

Hey Cheryl!

Great job finding out the conflicting code! 🙂

I don’t see anything wrong with that snippet. I do know that it might have performance implications.

You could try adding some code to remove the filter once the modified string is returned. But I’m not sure if it could break it.

You could also try using the Say What plugin > https://wordpress.org/plugins/say-what/, which I know some users do for the same purpose.

I hope that helps! Let me know if there is anything else I can help you with.

Best,
Victor

[stellaractive]

Thanks, I just removed the code. I’m marking this as resolved. Thanks for your help.

[Victor]

Hi Cheryl!

I’m glad to be of help here! Thanks for following up with this.

I’ll close this now but don’t hesitate to open a new topic if anything comes up and we’d be happy to help.

Good luck with your project!
Victor

[Author]

Posts