Feature #20795
openMigrate sites using google-maps-embed to embed-google-map
Added by Boone Gorges 3 months ago. Updated 3 months ago.
0%
Description
The old google-maps-embed plugin doesn't really work, and in particular it is occasionally completely broken when it doesn't force HTTPS requests. We should migrate over to whatever is our "official" solution for embedding Google Maps, which from my research appears to be embed-google-map (also super old?). It should be fairly straightforward to crawl through affected sites and rewrite the shortcodes.
I'm copying Ray and Scott here as they might be better positioned to make a recommendation about what should be used in 2024 to embed a Google Map on the Commons.
Files
| 2024-08-23_141110.png (92.9 KB) 2024-08-23_141110.png | Raymond Hoh, 2024-08-23 05:11 PM |
Related issues
Updated by Boone Gorges 3 months ago
- Related to Feature #3664: Google Maps Embed Plugin vs. Embed Google Map Plugin added
Updated by Boone Gorges 3 months ago
- Related to Feature #20766: Old plugin review added
Updated by scott voth 3 months ago
This plugin looks promising - https://wordpress.org/plugins/wp-google-maps/ Last updated a month ago.
Updated by Boone Gorges 3 months ago
Thanks, Scott! Unfortunately it looks like that plugin requires map objects to be created locally, so the migration routine would be more involved than simply swapping out shortcodes. Not impossible, but a lot more complicated.
Updated by scott voth 3 months ago
I've looked at several other plugins, but they require a Google API key. To set up the key it seems you need to have a billing account. Should we avoid looking at plugins like these?
Updated by Boone Gorges 3 months ago
Yeah, anything that requires an API key is probably off the table.
Updated by Raymond Hoh 3 months ago
- File 2024-08-23_141110.png 2024-08-23_141110.png added
I've deactivated google-maps-embed from sites where the [cetsEmbedGmap] shortcode was not found in the post content:
wp plugin deactivate google-maps-embed --url=efernandez.commons.gc.cuny.edu && wp plugin deactivate google-maps-embed --url=scottvoth.commons.gc.cuny.edu && wp plugin deactivate google-maps-embed --url=bccparlaitaliano.commons.gc.cuny.edu && wp plugin deactivate google-maps-embed --url=inperpetualbeta.commons.gc.cuny.edu && wp plugin deactivate google-maps-embed --url=livinglab.commons.gc.cuny.edu && wp plugin deactivate google-maps-embed --url=publicspace.commons.gc.cuny.edu && wp plugin deactivate google-maps-embed --url=urbanenvironmentstudies.commons.gc.cuny.edu && wp plugin deactivate google-maps-embed --url=cunyslist.commons.gc.cuny.edu && wp plugin deactivate google-maps-embed --url=lehmanonline.commons.gc.cuny.edu && wp plugin deactivate google-maps-embed --url=hunternurses.commons.gc.cuny.edu && wp plugin deactivate google-maps-embed --url=gcdi.commons.gc.cuny.edu && wp plugin deactivate google-maps-embed --url=andrewgmckinney.commons.gc.cuny.edu && wp plugin deactivate google-maps-embed --url=thesegalcenter.commons.gc.cuny.edu && wp plugin deactivate google-maps-embed --url=feministstudies.commons.gc.cuny.edu && wp plugin deactivate google-maps-embed --url=cunygraduatecentergeography.commons.gc.cuny.edu && wp plugin deactivate google-maps-embed --url=gcees.commons.gc.cuny.edu && wp plugin deactivate google-maps-embed --url=alandaluscuny.commons.gc.cuny.edu && wp plugin deactivate google-maps-embed --url=annesialamb.commons.gc.cuny.edu && wp plugin deactivate google-maps-embed --url=bronxedtech.commons.gc.cuny.edu && wp plugin deactivate google-maps-embed --url=activistwomen.commons.gc.cuny.edu && wp plugin deactivate google-maps-embed --url=iletcsforum.commons.gc.cuny.edu && wp plugin deactivate google-maps-embed --url=testblogtoday.commons.gc.cuny.edu && wp plugin deactivate google-maps-embed --url=tomryan.commons.gc.cuny.edu && wp plugin deactivate google-maps-embed --url=serapeaegypt.commons.gc.cuny.edu && wp plugin deactivate google-maps-embed --url=eshtestcac.commons.gc.cuny.edu && wp plugin deactivate google-maps-embed --url=preludenyc2013.commons.gc.cuny.edu && wp plugin deactivate google-maps-embed --url=cunyfemtech.commons.gc.cuny.edu && wp plugin deactivate google-maps-embed --url=vawshutdownmap.commons.gc.cuny.edu && wp plugin deactivate google-maps-embed --url=teachingimmigration.commons.gc.cuny.edu && wp plugin deactivate google-maps-embed --url=sissiliu.commons.gc.cuny.edu && wp plugin deactivate google-maps-embed --url=jojokarlin.commons.gc.cuny.edu && wp plugin deactivate google-maps-embed --url=gfarrellyroma.commons.gc.cuny.edu && wp plugin deactivate google-maps-embed --url=foodstuff.commons.gc.cuny.edu && wp plugin deactivate google-maps-embed --url=nurayyilmaz.commons.gc.cuny.edu && wp plugin deactivate google-maps-embed --url=omrit.commons.gc.cuny.edu && wp plugin deactivate google-maps-embed --url=axum.commons.gc.cuny.edu && wp plugin deactivate google-maps-embed --url=tarquinia.commons.gc.cuny.edu && wp plugin deactivate google-maps-embed --url=segalarchive.commons.gc.cuny.edu
Yeah, anything that requires an API key is probably off the table.
Without signing up for an API key, you can embed Google Maps with the following <iframe> embed codes.
The older, free Google Maps <iframe> embed code used:
<iframe src="https://maps.google.com/maps?q=LOCATION-SEARCH-OR-ADDRESS&output=embed"></iframe>
This still works today and is what the google-maps-embed plugin uses in their shortcode to generate the <iframe> embed. I don't know how long Google will allow this syntax to continue, but it is widely used on the internet. We could easily write our own maps shortcode such as [gmaps location="CUNY Graduate Center"] with this syntax and this should embed the location of the CUNY Graduate Center like the attached screenshot: https://redmine.gc.cuny.edu/attachments/29469
However, the latest, free Google Maps <iframe> embed code uses:
<iframe src="https://www.google.com/maps/embed?pb=SPECIAL-ENCODED-PARAM"></iframe>
You can generate this embed code yourself from the Google Maps website and using the "Share > Embed a Map" option. See https://blog.hubspot.com/website/how-to-embed-google-map-in-html .
The 'pb' parameter is some special secret sauce that has the longitude and latitude of the address among other things. Some devs have tried to decode this new 'pb' parameter with varying results: https://stackoverflow.com/questions/47017387/decoding-the-google-maps-embedded-parameters
I haven't done too much research into this yet, but it looks like it wouldn't be convenient to use this new embed syntax if we were to stick to a "no API key" approach, unless we tell users to copy the <iframe> 'src' attribute manually from the embed code, which could lead to some support issues.
in particular it is occasionally completely broken when it doesn't force HTTPS requests
Since the google-maps-embed plugin isn't updated any more, we can force the Google Maps URL to HTTPS ourselves. This should resolve the main problems with google-maps-embed. I don't think we should convert the older [cetsEmbedGmap] shortcode to the syntax of another Google Maps plugin at this time.
Updated by Boone Gorges 3 months ago
Ray, thanks so much for the context.
Since the google-maps-embed plugin isn't updated any more, we can force the Google Maps URL to HTTPS ourselves. This should resolve the main problems with google-maps-embed. I don't think we should convert the older [cetsEmbedGmap] shortcode to the syntax of another Google Maps plugin at this time.
Yeah, you're probably right. I guess I'm enjoying the aggressive remove-everything approach, but it seems fine to leave this plugin in place (though hidden):
https://github.com/cuny-academic-commons/cac/commit/091b28621cafffe7b9c11f60f825a790f76b7730
https://github.com/cuny-academic-commons/cac/commit/eecf97e2bea608ebe95bd94245d06d2d52ea381b
Ray, do you have any thoughts about whether https://wordpress.org/plugins/wp-google-maps/ is a good option going forward? The idea would not be to migrate old shortcodes. But it would become our recommended tool for those looking to embed maps.
Updated by Raymond Hoh 3 months ago
Ray, do you have any thoughts about whether https://wordpress.org/plugins/wp-google-maps/ is a good option going forward? The idea would not be to migrate old shortcodes. But it would become our recommended tool for those looking to embed maps.
Other than the various upsells to their premium version, wp-google-maps doesn't use Google Maps by default, it uses OpenStreetMap to render the maps, which is good. The one negative is the plugin creates ten database tables to hold map data such as locations, maps and markers. However, it is quite user-friendly.
Leaflet Map also uses OpenStreetMap by default and is a better technical option as it creates no database tables. However it's less user-friendly than wp-google-maps because it's shortcode-only.
I haven't looked in-depth into other mapping options yet.