[Resolved] Embed Google map needs a title

Home Forums Support [Resolved] Embed Google map needs a title

Home Forums Support Embed Google map needs a title

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #627803
    Ron

    Good Afternoon GP

    I’m using a google map embed in a footer for our website, works fine.
    But, I use google lighthouse to monitor website for google recommendations.
    I get this google recommendation
    Accessibility: <frame> or <iframe> elements do not have a title”
    the offending code is for googles map embed code “ (Ironic)
    This is the code I’ve used to try to remedy this issue or different versions to no avail

    <head> <title>A embed Google map using iframe</title> </head>
    <iframe
    src=”https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d5332.439251464501!2d- 122.1701542!3d48.0674035!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x5485538368d42af1%3A0x2db5d76da17b5404!2sSonRise+Apartments!5 e0!3m2!1sen!2sus!4v1529822106275″ width=”250″ height=”200″ frameborder=”0″ style=”border:0″ allowfullscreen></iframe>

    I would appreciated input on how to properly code this Google map embed with a iframe title
    Ron

    GeneratePress 2.1.3
    GP Premium 1.6.2
    #627841
    David
    Staff
    Customer Support

    Hi Ron,

    you can add a title attribute to the iframe element e.g:

    <iframe title="title" src=”https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d5332.439251464501!2d- 122.1701542!3d48.0674035!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x5485538368d42af1%3A0x2db5d76da17b5404!2sSonRise+Apartments!5 e0!3m2!1sen!2sus!4v1529822106275″ width=”250″ height=”200″ frameborder=”0″ style=”border:0″ allowfullscreen></iframe>

    #627889
    Ron

    Thank You Dave code worked great!! On another topic are there any html online classes that you would recommend?

    #627896
    David
    Staff
    Customer Support

    Thats good to hear.

    Just starting out and want to the core stuff:
    https://freecodecamp.org is a good learning resource. And its free 🙂

    General guides:
    https://www.w3schools.com
    https://css-tricks.com

    Intermediate to advanced resources:
    https://developer.mozilla.org/en-US/

    Good reading:
    https://www.smashingmagazine.com

Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.