WordPress.org

Make WordPress Core

Opened 3 years ago

Closed 3 years ago

#39154 closed defect (bug) (invalid)

Twenty Seventeen alters Google Maps branding which is against Google T&C's

Reported by: stiofansisland Owned by:
Milestone: Priority: normal
Severity: normal Version: 4.7
Component: Themes Keywords: close
Focuses: ui Cc:
PR Number:

Description

Twenty Seventeen theme alters the Google logo when a Google map is added to any page/post, this is against Google T&C's and should be fixed.

The problem is with this CSS rule

.entry-content a img, .widget a img {
    -webkit-box-shadow: 0 0 0 8px #fff;
    box-shadow: 0 0 0 8px #fff;
}

This could be fixed by adding this rule below that rule to:

.entry-content .gm-style a img, .widget .gm-style a img {
    -webkit-box-shadow: 0 0 0 0;
    box-shadow: 0 0 0 0;
}

Thanks,

Stiofanhttps://wpgeodirectory.com/wp-content/uploads/2016/12/gm-2017-bug.png

Change History (10)

This ticket was mentioned in Slack in #core-themes by stiofansisland. View the logs.


3 years ago

#2 follow-up: @sami.keijonen
3 years ago

Thanks for ticket.

Does gm-style class comes from a plugin?

#3 in reply to: ↑ 2 @stiofansisland
3 years ago

Replying to sami.keijonen:

Thanks for ticket.

Does gm-style class comes from a plugin?

No the class 'gm-style' is included with all Google embedded maps, we have been using it for over 5 years with no problems.

#4 follow-up: @sami.keijonen
3 years ago

When I embed a map from Google maps I just get regular iframe like this: <iframe style="border: 0;" src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d1982.3216807098454!2d24.852959215109287!3d60.20850794726272!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x468df608972b10e3%3A0x55584389f8e712d2!2sMesenaatintie%2C+00350+Helsinki!5e0!3m2!1sen!2sfi!4v1481134643416" width="600" height="450" frameborder="0" allowfullscreen="allowfullscreen"></iframe>

You're probably using Google maps API which probably includes gm-style class?

#5 in reply to: ↑ 4 @stiofansisland
3 years ago

Replying to sami.keijonen:

When I embed a map from Google maps I just get regular iframe like this: <iframe style="border: 0;" src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d1982.3216807098454!2d24.852959215109287!3d60.20850794726272!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x468df608972b10e3%3A0x55584389f8e712d2!2sMesenaatintie%2C+00350+Helsinki!5e0!3m2!1sen!2sfi!4v1481134643416" width="600" height="450" frameborder="0" allowfullscreen="allowfullscreen"></iframe>

You're probably using Google maps API which probably includes gm-style class?

Yes any embedded map using the API.
Grab the code from here (its a pain but you need a api key now)
https://developers.google.com/maps/documentation/javascript/examples/map-simple
Change the #map css to height:300px and width: 100% or the standard code will not show.

Or i can give you an example link if you would like?

Stiofan

#6 follow-up: @ocean90
3 years ago

  • Keywords close added

This sounds like something which you should fix by using the new Additional CSS control in the customizer.

From the about page:

Sometimes you just need a few visual tweaks to make your site perfect. WordPress 4.7 allows you to add custom CSS and instantly see how your changes affect your site. The live preview allows you to work quickly without page refreshes slowing you down.

#7 in reply to: ↑ 6 @stiofansisland
3 years ago

Replying to ocean90:

This sounds like something which you should fix by using the new Additional CSS control in the customizer.

From the about page:

Sometimes you just need a few visual tweaks to make your site perfect. WordPress 4.7 allows you to add custom CSS and instantly see how your changes affect your site. The live preview allows you to work quickly without page refreshes slowing you down.

This will affect everyone and anyone that uses any plugin with a map.
Additionally, this is not a nice to have, it is demanded by Google T&C's, which means Twenty Seventeen theme does not comply and users technically can't use maps with it.

Stiofan

This ticket was mentioned in Slack in #core-themes by stiofansisland. View the logs.


3 years ago

#9 @helen
3 years ago

It doesn't really make sense to me for a core theme to include specific CSS for some external service - surely this general of a rule affects any number of embeds that aren't doing enough resetting of their own CSS. This is really on the provider of said embed - Twitter is very strict about their display guidelines, for instance, and is quite aggressive with !important styles.

#10 @davidakennedy
3 years ago

  • Milestone Awaiting Review deleted
  • Resolution set to invalid
  • Status changed from new to closed

Thanks for the report @stiofansisland! Sorry you're having some display issues with Twenty Seventeen.

That said, this isn't something that should be addressed in Twenty Seventeen.

Default themes try their best to not be intrusive and work with nearly anything. But they can't favor certain plugins or services with integrations, styles, etc. because that's not fair to the many other plugins that aren't catered to in the theme. Also, sometimes with third-party services or plugins, adjustments will be needed. This is one of those cases.

So the solution is to add some custom CSS or report the bug to Google so it can scope its CSS rules better.

Thanks for using Twenty Seventeen!

Note: See TracTickets for help on using tickets.