Google Maps Full Width Gone?

[Chris]

So, what happened to the full width function for displaying Google maps? I used this on a website and now it’s gone after the upgrade.
Also, I can’t seem to find release notes anywhere for the new release.

[Barry]

Can you clarify what you are referring to when you say the full width function? It would definitely be possible to resize and reposition the map, if you wanted to do that. Have you checked out the new Themer’s Guide?

https://theeventscalendar.com/support/documentation/events-calendar-themers-guide/

Also, I can’t seem to find release notes anywhere for the new release.

I’m not sure that we do, but between resources such as the updated themer’s guide (above), the updated new user primers and of course our blog content you can get a pretty good and detailed sense of what has changed.

[Chris]

On another website I maintain, I am running version 2.0.11. Under the “Settings” tab there is an option that allows me to just type in a custom height and width for the Google Maps embed. I am just wondering exactly when it was removed from the settings tab.

[Chris]

Sorry, I guess that’s not a “full width” function, but I had the ability to use 100% width if I wanted.

[Kyle]

Hi Chris,

Thank you for patience so far!

The google map now displays at 100% the width of its container, so depending on which map display you’d like to have full-width, you can change the width of its container and the map will follow suit. If you’d like help getting started, you could let me know which map you’d like to be full width and I can do my best to point you in the right direction.

Cheers,
Kyle

[Todd]

I see that the map is at 100%, but (when not using the Skeleton-styles css) the map’s container — .tribe-events-meta-group — is only 33% and floated left. And this container has no other css class to hook onto, so any css put on .tribe-events-meta-group hits all meta groups. By contrast, the Venue’s container div gets a .vcard class in addition to .tribe-events-meta-group, which allows it to be targeted specifically.

Is there any way to target the Map’s container (without resorting to jquery), using a filter hook somehow? Or could the next release add a .map class to the container?

[Barry]

Hi Todd – please create a new thread for this one – that would also let you share a URL for your site which could provide us with a little more context (I’m not sure why you can’t use .tribe-events-venue-map right now, but we can look at it in more detail in your new thread).

Thanks!

[Kyle]

Hi Todd,

Before you create a new thread, I saw this and wanted to respond. You are right, we do need a unique class on the tribe-events-meta-group that houses the map in the first meta section. I’ve added unique classes to each meta group in the next maintenance release. For the time being you can put the following function in your theme’s functions.php https://gist.github.com/windfarm/6221379

I’m just rewriting the tribe_events_single_event_meta() as-is and manually adding a class of ‘tribe-events-meta-venue-map’ to that section. Sorry about this, thanks for bringing it to our attention!

Cheers,
Kyle

[Todd]

@Barry — The .tribe-events-venue-map has a 33%-width container (.tribe-events-meta-group), so the map can’t be wider than 33% of the page width, which is really much too small to actually see the map.

@Kyle — Thank you so much! That will be great 🙂 Much better than what i had done — which was to disable TEC’s google-maps entirely, and do my own iframe —


$myVenue['address'] = tribe_get_address();
$myVenue['city'] = tribe_get_city();
$myVenue['state'] = tribe_get_state();
$myVenue['zip'] = tribe_get_zip();
$myVenue['map_address'] = $myVenue['address'] .", ". $myVenue['city'] .", ". $myVenue['state'] .", ". $myVenue['zip'];
$myVenue['map_address'] = urlencode(str_replace(" ", "+", $myVenue['map_address']));

if( tribe_get_address() || tribe_get_city()) { ?>
<iframe width="600" height="300" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.com/maps?q=&z=14&output=embed&iwloc=near">
}


[Barry]

Cool – sounds like you’re sorted here – I’ll go ahead and close this one. Thanks everyone 🙂

[Support Droid]

This topic has not been active for quite some time and will now be closed.

If you still need assistance please simply open a new topic (linking to this one if necessary)
and one of the team will be only too happy to help.

[Author]

Posts